feat: VerificationTab

src/pages/dashboard/ModalUser/PurchaseTab.tsx

@@ -1,5 +1,4 @@
 import { DataGrid } from "@mui/x-data-grid";
-import { useTheme } from "@mui/material";
 
 import type { GridColDef } from "@mui/x-data-grid";
 
@@ -54,10 +53,7 @@ const ROWS = [
   },
 ];
 
-export const PurchaseTab = () => {
-  const theme = useTheme();
-
-  return (
+export const PurchaseTab = () => (
   <DataGrid
     rows={ROWS}
     columns={COLUMNS}
@@ -102,5 +98,4 @@ export const PurchaseTab = () => {
       },
     }}
   />
-  );
-};
+);

src/pages/dashboard/ModalUser/TransactionsTab.tsx

@@ -1,5 +1,5 @@
 import { DataGrid } from "@mui/x-data-grid";
-import { Typography, useTheme } from "@mui/material";
+import { Typography } from "@mui/material";
 
 import type { GridColDef } from "@mui/x-data-grid";
 
@@ -86,10 +86,7 @@ const ROWS = [
   },
 ];
 
-export const TransactionsTab = () => {
-  const theme = useTheme();
-
-  return (
+export const TransactionsTab = () => (
   <DataGrid
     rows={ROWS}
     columns={COLUMNS}
@@ -134,5 +131,4 @@ export const TransactionsTab = () => {
       },
     }}
   />
-  );
-};
+);

src/pages/dashboard/ModalUser/VerificationTab.tsx

@@ -0,0 +1,38 @@
+import { Box, Typography } from "@mui/material";
+
+import type { File } from "./index";
+
+type VerificationTabProps = {
+  files: File[];
+};
+
+export const VerificationTab = ({ files }: VerificationTabProps) => (
+  <Box sx={{ padding: "25px" }}>
+    {files.map(({ name, url }, index) => (
+      <Box sx={{ marginBottom: "25px" }}>
+        <Typography sx={{ fontWeight: "bold", fontSize: "18px" }}>
+          {index + 1}.{" "}
+          {name === "inn"
+            ? "Скан ИНН организации (выписка из ЕГЮРЛ)"
+            : name === "rule"
+            ? "Устав организации"
+            : name === "certificate"
+            ? "Свидетельство о регистрации НКО"
+            : `Скан документа ${index + 1}`}
+        </Typography>
+        <Typography>
+          <a
+            style={{
+              color: "#7E2AEA",
+              textDecoration: "none",
+              fontSize: "18px",
+            }}
+            href={url}
+          >
+            {url.split("/").pop()?.split(".")?.[0]}
+          </a>
+        </Typography>
+      </Box>
+    ))}
+  </Box>
+);

src/pages/dashboard/ModalUser/index.tsx

@@ -13,6 +13,7 @@ import {
 import { UserTab } from "./UserTab";
 import { PurchaseTab } from "./PurchaseTab";
 import { TransactionsTab } from "./TransactionsTab";
+import { VerificationTab } from "./VerificationTab";
 
 import { authStore } from "@root/stores/auth";
 import theme from "@root/theme";
@@ -34,7 +35,7 @@ const TABS = [
 const baseUrl =
   process.env.NODE_ENV === "production" ? "" : "https://hub.pena.digital";
 
-type File = {
+export type File = {
   name: "inn" | "rule" | "egrule" | "certificate";
   url: string;
 };
@@ -167,6 +168,7 @@ const ModalUser = () => {
                 )}
                 {value === 1 && <PurchaseTab />}
                 {value === 2 && <TransactionsTab />}
+                {value === 3 && <VerificationTab files={user?.files || []} />}
               </Box>
             </Box>
           </Box>