feat: service deleting and rest categories placeholders

src/pages/ServicesPage/components/ServicesTable/ServicesTable.tsx

@@ -36,7 +36,6 @@ const ServicesTable: FC<Props> = ({
     });
     const minRank = categoryRanks.sort()[0];
     const maxRank = categoryRanks.sort()[categoryRanks.length - 1];
-    console.log(minRank, maxRank);
 
     const onEditClick = (service: ServiceSchema) => {
         if (!onChange) return;
@@ -185,7 +184,7 @@ const ServicesTable: FC<Props> = ({
                 },
                 enableRowActions: true,
                 renderRowActions: ({ row }) => (
-                    <Flex gap="xs">
+                    <Flex display={row.original.isPlaceholder ? "none" : "flex"} gap="xs">
                         <Tooltip label="Редактировать">
                             <ActionIcon
                                 onClick={() => onEditClick(row.original)}

src/pages/ServicesPage/components/ServicesTable/columns.tsx

@@ -33,19 +33,23 @@ export const useServicesTableColumns = () => {
                 header: "Услуга",
                 enableGrouping: false,
                 enableSorting: false,
+                Cell: ({ row, cell }) => {
+                    return row.original.isPlaceholder ? "" : (cell.renderValue<string>());
+                },
             },
             {
                 accessorKey: "price",
                 header: "Цена",
                 enableGrouping: false,
                 enableSorting: false,
-                Cell: ({ row }) => getPriceRow(row.original),
+                Cell: ({ row }) => row.original.isPlaceholder ? "" : getPriceRow(row.original),
             },
             {
                 accessorKey: "cost",
                 header: "Себестоимость",
                 enableGrouping: false,
                 enableSorting: false,
+                Cell: ({ row }) => row.original.isPlaceholder ? "" : `${row.original.cost}₽`,
             },
 
         ],

src/pages/ServicesPage/hooks/useServicesList.tsx

@@ -1,10 +1,16 @@
 import { useQuery } from "@tanstack/react-query";
 import { ServiceService } from "../../../client";
 
-const useServicesList = () => {
+type Props = {
+    withPlaceholders?: boolean;
+
+}
+const useServicesList = (props: Props) => {
+    const { withPlaceholders = false } = props;
+
     const { isPending, error, data, refetch } = useQuery({
-        queryKey: ["getAllServices"],
-        queryFn: ServiceService.getAllServices,
+        queryKey: ["getAllServices", withPlaceholders],
+        queryFn: () => ServiceService.getAllServices({ withPlaceholders: withPlaceholders }),
     });
     const services = isPending || error || !data ? [] : data.services;
 

src/pages/ServicesPage/hooks/useServicesState.tsx

@@ -9,7 +9,7 @@ import useServicesList from "./useServicesList.tsx";
 import { Text } from "@mantine/core";
 
 const useServicesState = () => {
-    const { services, refetch } = useServicesList();
+    const { services, refetch } = useServicesList({ withPlaceholders: true });
 
     const onCreateClick = () => {
         modals.openContextModal({
@@ -27,7 +27,7 @@ const useServicesState = () => {
                 notifications.guess(ok, { message: message });
                 if (!ok) return;
                 await refetch();
-            }
+            },
         );
     };
 
@@ -45,7 +45,7 @@ const useServicesState = () => {
         ServiceService.createServiceCategory({
             requestBody: { category: category },
         }).then(({ ok, message }) =>
-            notifications.guess(ok, { message: message })
+            notifications.guess(ok, { message: message }),
         );
     };