Phase 0.2: Remove frontend deprecated code
- Delete pages: sum, audit, admin/random-jobs - Delete old homepage (counter) and create redirect page - Update Header.tsx: remove Counter, Sum, Audit, Random Jobs nav items - Update auth-context.tsx: remove VIEW_COUNTER, INCREMENT_COUNTER, USE_SUM permissions - Update profile/page.test.tsx: fix nav link assertions
This commit is contained in:
parent
5bad1e7e17
commit
a5c1eccb4b
GPG key ID:
883EDBAA726BD96C
9 changed files with 27 additions and 1260 deletions
|
|
@ -1,229 +0,0 @@
|
|||
"use client";
|
||||
|
||||
import { useEffect, useState, useCallback } from "react";
|
||||
import { Permission } from "../../auth-context";
|
||||
import { api } from "../../api";
|
||||
import { sharedStyles } from "../../styles/shared";
|
||||
import { Header } from "../../components/Header";
|
||||
import { useRequireAuth } from "../../hooks/useRequireAuth";
|
||||
import { components } from "../../generated/api";
|
||||
|
||||
type RandomNumberOutcome = components["schemas"]["RandomNumberOutcomeResponse"];
|
||||
|
||||
export default function AdminRandomJobsPage() {
|
||||
const [outcomes, setOutcomes] = useState<RandomNumberOutcome[]>([]);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [isLoadingData, setIsLoadingData] = useState(true);
|
||||
const { user, isLoading, isAuthorized } = useRequireAuth({
|
||||
requiredPermission: Permission.VIEW_AUDIT,
|
||||
fallbackRedirect: "/",
|
||||
});
|
||||
|
||||
const fetchOutcomes = useCallback(async () => {
|
||||
setError(null);
|
||||
try {
|
||||
const data = await api.get<RandomNumberOutcome[]>("/api/audit/random-jobs");
|
||||
setOutcomes(data);
|
||||
} catch (err) {
|
||||
setOutcomes([]);
|
||||
setError(err instanceof Error ? err.message : "Failed to load outcomes");
|
||||
} finally {
|
||||
setIsLoadingData(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (user && isAuthorized) {
|
||||
fetchOutcomes();
|
||||
}
|
||||
}, [user, isAuthorized, fetchOutcomes]);
|
||||
|
||||
const formatDate = (dateStr: string) => {
|
||||
return new Date(dateStr).toLocaleString();
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<main style={styles.main}>
|
||||
<div style={styles.loader}>Loading...</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
if (!user || !isAuthorized) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<main style={styles.main}>
|
||||
<Header currentPage="admin-random-jobs" />
|
||||
|
||||
<div style={styles.content}>
|
||||
<div style={styles.tableCard}>
|
||||
<div style={styles.tableHeader}>
|
||||
<h2 style={styles.tableTitle}>Random Number Job Outcomes</h2>
|
||||
<span style={styles.totalCount}>{outcomes.length} outcomes</span>
|
||||
</div>
|
||||
|
||||
<div style={styles.tableWrapper}>
|
||||
<table style={styles.table}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={styles.th}>ID</th>
|
||||
<th style={styles.th}>Job ID</th>
|
||||
<th style={styles.th}>Triggered By</th>
|
||||
<th style={styles.th}>Value</th>
|
||||
<th style={styles.th}>Duration</th>
|
||||
<th style={styles.th}>Status</th>
|
||||
<th style={styles.th}>Created At</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{error && (
|
||||
<tr>
|
||||
<td colSpan={7} style={styles.errorRow}>
|
||||
{error}
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{!error && isLoadingData && (
|
||||
<tr>
|
||||
<td colSpan={7} style={styles.emptyRow}>
|
||||
Loading...
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{!error && !isLoadingData && outcomes.length === 0 && (
|
||||
<tr>
|
||||
<td colSpan={7} style={styles.emptyRow}>
|
||||
No job outcomes yet
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{!error &&
|
||||
!isLoadingData &&
|
||||
outcomes.map((outcome) => (
|
||||
<tr key={outcome.id} style={styles.tr}>
|
||||
<td style={styles.tdNum}>{outcome.id}</td>
|
||||
<td style={styles.tdNum}>{outcome.job_id}</td>
|
||||
<td style={styles.td}>{outcome.triggered_by_email}</td>
|
||||
<td style={styles.tdValue}>{outcome.value}</td>
|
||||
<td style={styles.tdNum}>{outcome.duration_ms}ms</td>
|
||||
<td style={styles.td}>
|
||||
<span style={styles.statusBadge}>{outcome.status}</span>
|
||||
</td>
|
||||
<td style={styles.tdDate}>{formatDate(outcome.created_at)}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
const pageStyles: Record<string, React.CSSProperties> = {
|
||||
content: {
|
||||
flex: 1,
|
||||
padding: "2rem",
|
||||
overflowY: "auto",
|
||||
},
|
||||
tableCard: {
|
||||
background: "rgba(255, 255, 255, 0.03)",
|
||||
backdropFilter: "blur(10px)",
|
||||
border: "1px solid rgba(255, 255, 255, 0.08)",
|
||||
borderRadius: "20px",
|
||||
padding: "1.5rem",
|
||||
boxShadow: "0 25px 50px -12px rgba(0, 0, 0, 0.5)",
|
||||
maxWidth: "1200px",
|
||||
margin: "0 auto",
|
||||
},
|
||||
tableHeader: {
|
||||
display: "flex",
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center",
|
||||
marginBottom: "1rem",
|
||||
},
|
||||
tableTitle: {
|
||||
fontFamily: "'Instrument Serif', Georgia, serif",
|
||||
fontSize: "1.5rem",
|
||||
fontWeight: 400,
|
||||
color: "#fff",
|
||||
margin: 0,
|
||||
},
|
||||
totalCount: {
|
||||
fontFamily: "'DM Sans', system-ui, sans-serif",
|
||||
fontSize: "0.875rem",
|
||||
color: "rgba(255, 255, 255, 0.4)",
|
||||
},
|
||||
tableWrapper: {
|
||||
overflowX: "auto",
|
||||
},
|
||||
table: {
|
||||
width: "100%",
|
||||
borderCollapse: "collapse",
|
||||
fontFamily: "'DM Sans', system-ui, sans-serif",
|
||||
},
|
||||
th: {
|
||||
textAlign: "left",
|
||||
padding: "0.75rem 1rem",
|
||||
fontSize: "0.75rem",
|
||||
fontWeight: 600,
|
||||
color: "rgba(255, 255, 255, 0.4)",
|
||||
textTransform: "uppercase",
|
||||
letterSpacing: "0.05em",
|
||||
borderBottom: "1px solid rgba(255, 255, 255, 0.08)",
|
||||
},
|
||||
tr: {
|
||||
borderBottom: "1px solid rgba(255, 255, 255, 0.04)",
|
||||
},
|
||||
td: {
|
||||
padding: "0.875rem 1rem",
|
||||
fontSize: "0.875rem",
|
||||
color: "rgba(255, 255, 255, 0.7)",
|
||||
},
|
||||
tdNum: {
|
||||
padding: "0.875rem 1rem",
|
||||
fontSize: "0.875rem",
|
||||
color: "rgba(255, 255, 255, 0.9)",
|
||||
fontFamily: "'DM Mono', monospace",
|
||||
},
|
||||
tdValue: {
|
||||
padding: "0.875rem 1rem",
|
||||
fontSize: "1rem",
|
||||
color: "#a78bfa",
|
||||
fontWeight: 600,
|
||||
fontFamily: "'DM Mono', monospace",
|
||||
},
|
||||
tdDate: {
|
||||
padding: "0.875rem 1rem",
|
||||
fontSize: "0.75rem",
|
||||
color: "rgba(255, 255, 255, 0.4)",
|
||||
},
|
||||
statusBadge: {
|
||||
fontFamily: "'DM Sans', system-ui, sans-serif",
|
||||
fontSize: "0.7rem",
|
||||
fontWeight: 500,
|
||||
padding: "0.25rem 0.5rem",
|
||||
borderRadius: "4px",
|
||||
textTransform: "uppercase",
|
||||
background: "rgba(34, 197, 94, 0.2)",
|
||||
color: "rgba(34, 197, 94, 0.9)",
|
||||
},
|
||||
emptyRow: {
|
||||
padding: "2rem 1rem",
|
||||
textAlign: "center",
|
||||
color: "rgba(255, 255, 255, 0.3)",
|
||||
fontSize: "0.875rem",
|
||||
},
|
||||
errorRow: {
|
||||
padding: "2rem 1rem",
|
||||
textAlign: "center",
|
||||
color: "#f87171",
|
||||
fontSize: "0.875rem",
|
||||
},
|
||||
};
|
||||
|
||||
const styles = { ...sharedStyles, ...pageStyles };
|
||||
Loading…
Add table
Add a link
Reference in a new issue