fix: typing issues

frontend/src/app-components/dialogs/DeleteDialog.tsx

@@ -8,25 +8,24 @@
 
 import ErrorIcon from "@mui/icons-material/Error";
 import {
+  Button,
   Dialog,
   DialogActions,
+  DialogContent,
   Grid,
   Typography,
-  DialogContent,
-  Button,
 } from "@mui/material";
-import { FC } from "react";
 
 import { DialogTitle } from "@/app-components/dialogs/DialogTitle";
 import { DialogControl } from "@/hooks/useDialog";
 import { useTranslate } from "@/hooks/useTranslate";
 
-export type DeleteDialogProps = DialogControl<string>;
-export const DeleteDialog: FC<DeleteDialogProps> = ({
+export type DeleteDialogProps<T = string> = DialogControl<T>;
+export const DeleteDialog = <T extends any = string>({
   open,
   callback,
   closeDialog: closeFunction,
-}: DeleteDialogProps) => {
+}: DeleteDialogProps<T>) => {
   const { t } = useTranslate();
 
   return (

frontend/src/components/visual-editor/v2/Diagrams.tsx

@@ -42,7 +42,7 @@ import { DeleteDialog } from "@/app-components/dialogs";
 import { MoveDialog } from "@/app-components/dialogs/MoveDialog";
 import { CategoryDialog } from "@/components/categories/CategoryDialog";
 import { isSameEntity } from "@/hooks/crud/helpers";
-import { useDelete, useDeleteFromCache } from "@/hooks/crud/useDelete";
+import { useDeleteFromCache } from "@/hooks/crud/useDelete";
 import { useDeleteMany } from "@/hooks/crud/useDeleteMany";
 import { useFind } from "@/hooks/crud/useFind";
 import { useGetFromCache } from "@/hooks/crud/useGet";
@@ -90,10 +90,7 @@ const Diagrams = () => {
   const { data: categories } = useFind(
     { entity: EntityType.CATEGORY },
     {
-      initialPaginationState: {
-        page: 0,
-        pageSize: 999, // @TODO: We need to display all categories
-      },
+      hasCount: false,
       initialSortState: [{ field: "createdAt", sort: "asc" }],
     },
     {
@@ -114,13 +111,6 @@ const Diagrams = () => {
   const { mutateAsync: updateCategory } = useUpdate(EntityType.CATEGORY, {
     invalidate: false,
   });
-  const { mutateAsync: deleteBlock } = useDelete(EntityType.BLOCK, {
-    onSuccess() {
-      deleteDialogCtl.closeDialog();
-      setSelectedBlockId(undefined);
-    },
-    invalidate: false,
-  });
   const { mutateAsync: deleteBlocks } = useDeleteMany(EntityType.BLOCK, {
     onSuccess: () => {
       deleteDialogCtl.closeDialog();
@@ -188,6 +178,7 @@ const Diagrams = () => {
     if (categories?.length > 0 && !selectedCategoryId) {
       setSelectedCategoryId(categories[0].id);
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   useEffect(() => {
@@ -525,7 +516,7 @@ const Diagrams = () => {
       <Box sx={{ width: "100%" }}>
         <CategoryDialog {...getDisplayDialogs(addCategoryDialogCtl)} />
         <BlockDialog {...getDisplayDialogs(editDialogCtl)} />
-        <DeleteDialog {...deleteDialogCtl} callback={onDelete} />
+        <DeleteDialog<string[]> {...deleteDialogCtl} callback={onDelete} />
         <MoveDialog
           open={moveDialogCtl.open}
           openDialog={moveDialogCtl.openDialog}