fix: statistics modal link

src/api/promocode/requests.ts

@@ -33,16 +33,11 @@ const getPromocodeList = async (body: GetPromocodeListBody) => {
 };
 const createFastlink = async (id: string) => {
   try {
-    return await makeRequest<
-      {id:string},
-      PromocodeList
-    >({
+    return await makeRequest<{ id: string }, { fastlink: string }>({
       url: baseUrl + "/fastlink",
       method: "POST",
-      body: {id},
+      body: { id },
     });
-
-     
   } catch (nativeError) {
     const [error] = parseAxiosError(nativeError);
     throw new Error(`Ошибка при создании фастлинка. ${error}`);
@@ -115,22 +110,22 @@ const deletePromocode = async (id: string): Promise<void> => {
   }
 };
 
-const getPromocodeStatistics = async (id: string, from: number, to: number,) => {
+const getPromocodeStatistics = async (id: string, from: number, to: number) => {
   try {
     const promocodeStatisticsResponse = await makeRequest<
       unknown,
-      PromocodeStatistics[]
+      PromocodeStatistics
     >({
       url: baseUrl + `/stats`,
       body: {
-        "id": id,
-        "from": from,
-        "to": to
+        id: id,
+        from: from,
+        to: to,
       },
       method: "POST",
       useToken: false,
     });
-console.log(promocodeStatisticsResponse)
+    console.log(promocodeStatisticsResponse);
     return promocodeStatisticsResponse;
   } catch (nativeError) {
     const [error] = parseAxiosError(nativeError);

src/model/promocodes.ts

@@ -33,6 +33,7 @@ export type Promocode = CreatePromocodeBody & {
   offLimit: boolean;
   delete: boolean;
   createdAt: string;
+  fastLinks: string[];
 };
 
 export type PromocodeList = {
@@ -42,7 +43,6 @@ export type PromocodeList = {
 
 export type PromocodeStatistics = {
   id: string;
-  link: string;
-  useCount: number;
-  purchasesCount: number;
+  usageCount: number;
+  usageMap: Record<string, number>;
 };

src/pages/dashboard/Content/PromocodeManagement/StatisticsModal.tsx

@@ -14,11 +14,12 @@ import { DatePicker } from "@mui/x-date-pickers/DatePicker";
 
 import { fadeIn } from "@root/utils/style/keyframes";
 
-import type { GridColDef } from "@mui/x-data-grid";
-import type { PromocodeStatistics } from "@root/model/promocodes";
 import moment from "moment";
 import { promocodeApi } from "@root/api/promocode/requests";
-import ContentCopyIcon from '@mui/icons-material/ContentCopy';
+import ContentCopyIcon from "@mui/icons-material/ContentCopy";
+
+import type { GridColDef } from "@mui/x-data-grid";
+import type { Promocode } from "@root/model/promocodes";
 
 type StatisticsModalProps = {
   id: string;
@@ -27,20 +28,29 @@ type StatisticsModalProps = {
   setId: (id: string) => void;
   setTo: (date: number) => void;
   setFrom: (date: number) => void;
+  promocodes: Promocode[];
   // promocodeStatistics: PromocodeStatistics[] | null | undefined;
   // promocodeStatistics: any;
 };
 
-const COLUMNS: GridColDef<PromocodeStatistics, string>[] = [
+type Row = {
+  id: number;
+  link: string;
+  useCount: number;
+};
+
+const COLUMNS: GridColDef<Row, string>[] = [
   {
     field: "copy",
     headerName: "копировать",
     width: 50,
     sortable: false,
-    valueGetter: ({ row }) => String(row.purchasesCount),
+    valueGetter: ({ row }) => String(row.useCount),
     renderCell: (params) => {
       return (
-        <IconButton onClick={() => navigator.clipboard.writeText(params.row.link)}>
+        <IconButton
+          onClick={() => navigator.clipboard.writeText(params.row.link)}
+        >
           <ContentCopyIcon />
         </IconButton>
       );
@@ -65,15 +75,10 @@ const COLUMNS: GridColDef<PromocodeStatistics, string>[] = [
     headerName: "Покупок",
     width: 70,
     sortable: false,
-    valueGetter: ({ row }) => String(row.purchasesCount),
+    valueGetter: ({ row }) => String(1),
   },
 ];
 
-type ROW = {
-  link: string,
-  useCount: number
-}
-
 export const StatisticsModal = ({
   id,
   setId,
@@ -81,40 +86,54 @@ export const StatisticsModal = ({
   from,
   to,
   setTo,
-  //promocodeStatistics,
+  promocodes,
 }: StatisticsModalProps) => {
   const [startDate, setStartDate] = useState<Date>(new Date());
   const [endDate, setEndDate] = useState<Date>(new Date());
   const theme = useTheme();
   const isMobile = useMediaQuery(theme.breakpoints.down(550));
   const [general, setGeneral] = useState({});
-  const [rows, setRows] = useState([]);
+  const [rows, setRows] = useState<Row[]>([]);
   const createFastlink = async () => {
-    await promocodeApi.createFastlink(id)
-    getParseData()
-  }
+    await promocodeApi.createFastlink(id);
+    getParseData();
+  };
+
   const getParseData = async () => {
-    const promocodeStatistics = await promocodeApi.getPromocodeStatistics(id, moment(startDate).unix(), moment(endDate).unix())
-    const rows = [] as ROW[]
-    //@ts-ignore
-    for (const [key, value] of Object.entries(promocodeStatistics.usageMap)) {
-      rows.push({
-        link: key,
-      //@ts-ignore
+    const promocodeStatistics = await promocodeApi.getPromocodeStatistics(
+      id,
+      moment(startDate).unix(),
+      moment(endDate).unix()
+    );
+
+    const rows = Object.values(promocodeStatistics.usageMap).map(
+      (value, index) => ({
+        link:
+          promocodes.find((promocode) => promocode.id === id)?.fastLinks[0] ??
+          "",
         useCount: value,
-        id:rows.length
+        id: index,
       })
-    }
-    setGeneral(promocodeStatistics)
-    //@ts-ignore
-    setRows(rows)
-  }
+    ) as Row[];
+
+    setGeneral(promocodeStatistics);
+    setRows(rows);
+  };
+
   useEffect(() => {
-    if (id.length > 0) getParseData()
-  }, [id])
+    if (id.length > 0) {
+      getParseData();
+    }
+
+    if (!id) {
+      setRows([]);
+      setGeneral({});
+    }
+  }, [id]);
+
   // const formatTo = to === null ? 0 : moment(to).unix()
   // const formatFrom = from === null ? 0 : moment(from).unix()
-  console.log(general)
+  console.log(general);
   // useEffect(() => {
   //     (async () => {
   //         const gottenGeneral = await promocodeStatistics(id, startDate, endDate)
@@ -125,9 +144,9 @@ export const StatisticsModal = ({
     <Modal
       open={Boolean(id)}
       onClose={() => {
-        setId("")
-        setStartDate(new Date())
-        setEndDate(new Date())
+        setId("");
+        setStartDate(new Date());
+        setEndDate(new Date());
       }}
       sx={{ "& > .MuiBox-root": { outline: "none" } }}
     >
@@ -163,16 +182,10 @@ export const StatisticsModal = ({
               alignItems: "center",
             }}
           >
-            <Button
-              sx={{ maxWidth: "100px" }}
-            onClick={createFastlink}
-            >
+            <Button sx={{ maxWidth: "100px" }} onClick={createFastlink}>
               Создать короткую ссылку
             </Button>
-            <Button
-              sx={{ maxWidth: "100px" }}
-              onClick={getParseData}
-            >
+            <Button sx={{ maxWidth: "100px" }} onClick={getParseData}>
               Обновить статистику
             </Button>
           </Box>

src/pages/dashboard/Content/PromocodeManagement/index.tsx

@@ -12,9 +12,9 @@ import DeleteModal from "./DeleteModal";
 
 export const PromocodeManagement = () => {
   const theme = useTheme();
-  
-  const [deleteModal, setDeleteModal] = useState<string>("")
-  const deleteModalHC = (id:string) => setDeleteModal(id)
+
+  const [deleteModal, setDeleteModal] = useState<string>("");
+  const deleteModalHC = (id: string) => setDeleteModal(id);
 
   const [showStatisticsModalId, setShowStatisticsModalId] =
     useState<string>("");
@@ -35,7 +35,7 @@ export const PromocodeManagement = () => {
     setShowStatisticsModalId,
     deleteModalHC
   );
-  console.log(showStatisticsModalId)
+  console.log(showStatisticsModalId);
   if (error) return <Typography>Ошибка загрузки промокодов</Typography>;
 
   return (
@@ -101,8 +101,13 @@ export const PromocodeManagement = () => {
         setTo={setTo}
         from={from}
         setFrom={setFrom}
+        promocodes={data?.items ?? []}
+      />
+      <DeleteModal
+        id={deleteModal}
+        setModal={setDeleteModal}
+        deletePromocode={deletePromocode}
       />
-      <DeleteModal id={deleteModal} setModal={setDeleteModal} deletePromocode={deletePromocode}/>
     </LocalizationProvider>
   );
 };