feat: 수정 심사 페이지에서 심사 상태를 노출하도록 수정

Author: MU-Software

apps/pyconkr-admin/src/components/pages/modification_audit/list.tsx

@@ -0,0 +1,64 @@
+import * as Common from "@frontend/common";
+import { CircularProgress, Stack, Table, TableBody, TableCell, TableHead, TableRow, Typography } from "@mui/material";
+import { ErrorBoundary, Suspense } from "@suspensive/react";
+import * as React from "react";
+import { Link } from "react-router-dom";
+
+import { BackendAdminSignInGuard } from "../../elements/admin_signin_guard";
+
+type ListRowType = {
+  id: string;
+  status: "approved" | "rejected" | "requested" | "cancelled";
+  str_repr: string;
+  created_at: string;
+  updated_at: string;
+};
+
+const InnerAdminModificationAuditList: React.FC = ErrorBoundary.with(
+  { fallback: Common.Components.ErrorFallback },
+  Suspense.with({ fallback: <CircularProgress /> }, () => {
+    const backendAdminClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
+    const listQuery = Common.Hooks.BackendAdminAPI.useListQuery<ListRowType>(backendAdminClient, "modification-audit", "modification-audit");
+
+    return (
+      <Stack sx={{ flexGrow: 1, width: "100%", minHeight: "100%" }}>
+        <Typography variant="h5" children="수정 심사 목록" />
+        <br />
+        <Table>
+          <TableHead>
+            <TableRow>
+              <TableCell sx={{ width: "25%" }}>ID</TableCell>
+              <TableCell sx={{ width: "17.5%" }}>상태</TableCell>
+              <TableCell sx={{ width: "40%" }}>이름</TableCell>
+              <TableCell sx={{ width: "17.5%" }}>요청 시각</TableCell>
+            </TableRow>
+          </TableHead>
+          <TableBody>
+            {listQuery.data?.map((item) => {
+              const link = `/modification-audit/modification-audit/${item.id}`;
+              const isRequested = item.status === "requested";
+              return (
+                <TableRow key={item.id}>
+                  <TableCell children={<Link to={link} children={item.id} />} />
+                  <TableCell>
+                    <Typography variant="body2" fontWeight={isRequested ? 700 : 400} color={isRequested ? "primary" : "textSecondary"}>
+                      {item.status}
+                    </Typography>
+                  </TableCell>
+                  <TableCell children={<Link to={link} children={item.str_repr} />} />
+                  <TableCell>{new Date(item.created_at).toLocaleString()}</TableCell>
+                </TableRow>
+              );
+            })}
+          </TableBody>
+        </Table>
+      </Stack>
+    );
+  })
+);
+
+export const AdminModificationAuditList: React.FC = () => (
+  <BackendAdminSignInGuard>
+    <InnerAdminModificationAuditList />
+  </BackendAdminSignInGuard>
+);

apps/pyconkr-admin/src/routes.tsx

@@ -22,6 +22,7 @@ import { AccountRedirectPage } from "./components/pages/account/account";
 import { AccountManagementPage } from "./components/pages/account/manage";
 import { SignInPage } from "./components/pages/account/sign_in";
 import { PublicFileUploadPage } from "./components/pages/file/upload";
+import { AdminModificationAuditList } from "./components/pages/modification_audit/list";
 import { AdminModificationAuditEditor } from "./components/pages/modification_audit/pages";
 import { AdminCMSPageEditor } from "./components/pages/page/editor";
 import { AdminPresentationEditor } from "./components/pages/presentation/editor";
@@ -209,6 +210,6 @@ export const RegisteredRoutes = {
   "/cms/sitemap/:id": <SiteMapList />,
   "/event/presentation/create": <AdminPresentationEditor />,
   "/event/presentation/:id": <AdminPresentationEditor />,
-  "/modification-audit": <AdminList app="modification-audit" resource="modification-audit" hideCreateNew />,
+  "/modification-audit": <AdminModificationAuditList />,
   "/modification-audit/modification-audit/:id": <AdminModificationAuditEditor />,
 };