feat: attributes page

src/app/module-editor/[moduleId]/components/shared/AttributeTableActions/AttributeTableActions.tsx

@@ -1,39 +1,44 @@
 import { FC } from "react";
 import { IconArrowRight, IconEdit, IconTrash } from "@tabler/icons-react";
 import { Center, Flex } from "@mantine/core";
-import { useModuleEditorContext } from "@/app/module-editor/[moduleId]/contexts/ModuleEditorContext";
 import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
 import { AttributeSchema } from "@/lib/client";
 
 type Props = {
     attribute: AttributeSchema;
+    onUpdate: (attribute: AttributeSchema) => void;
+    onDelete: (attribute: AttributeSchema) => void;
+    addAttributeToModule?: (attribute: AttributeSchema) => void;
 };
 
-const AttributeTableActions: FC<Props> = ({ attribute }) => {
-    const { attributeActions } = useModuleEditorContext();
-
+const AttributeTableActions: FC<Props> = ({
+    attribute,
+    onUpdate,
+    onDelete,
+    addAttributeToModule,
+}) => {
     return (
         <Center>
             <Flex gap={"xs"}>
                 <ActionIconWithTip
-                    onClick={() => attributeActions.onUpdate(attribute)}
+                    onClick={() => onUpdate(attribute)}
                     disabled={attribute.isBuiltIn}
                     tipLabel={"Редактировать"}>
                     <IconEdit />
                 </ActionIconWithTip>
                 <ActionIconWithTip
-                    onClick={() => attributeActions.onDelete(attribute)}
+                    onClick={() => onDelete(attribute)}
                     disabled={attribute.isBuiltIn}
                     tipLabel={"Удалить"}>
                     <IconTrash />
                 </ActionIconWithTip>
-                <ActionIconWithTip
-                    onClick={() =>
-                        attributeActions.addAttributeToModule(attribute)
-                    }
-                    tipLabel={"Добавить в модуль"}>
-                    <IconArrowRight />
-                </ActionIconWithTip>
+                {addAttributeToModule && (
+                    <ActionIconWithTip
+                        onClick={() => addAttributeToModule(attribute)}
+                        tipLabel={"Добавить в модуль"}>
+                        <IconArrowRight />
+                    </ActionIconWithTip>
+                )}
             </Flex>
         </Center>
     );

src/app/module-editor/[moduleId]/components/shared/AttributesTable/useAttributesTableColumns.tsx

@@ -3,12 +3,14 @@
 import { useMemo } from "react";
 import { DataTableColumn } from "mantine-datatable";
 import { Center } from "@mantine/core";
+import { useAttributesContext } from "@/app/attributes/contexts/AttributesContext";
 import AttributeTableActions from "@/app/module-editor/[moduleId]/components/shared/AttributeTableActions/AttributeTableActions";
 import useIsMobile from "@/hooks/utils/useIsMobile";
 import { AttributeSchema } from "@/lib/client";
 
 const useAttributesTableColumns = () => {
     const isMobile = useIsMobile();
+    const { attributesActions } = useAttributesContext();
 
     return useMemo(
         () =>
@@ -30,7 +32,10 @@ const useAttributesTableColumns = () => {
                     title: <Center>Действия</Center>,
                     width: "0%",
                     render: attribute => (
-                        <AttributeTableActions attribute={attribute} />
+                        <AttributeTableActions
+                            attribute={attribute}
+                            {...attributesActions}
+                        />
                     ),
                 },
             ] as DataTableColumn<AttributeSchema>[],

src/app/module-editor/[moduleId]/components/shared/ModuleAttribute/ModuleAttribute.tsx

@@ -1,5 +1,5 @@
 import { FC } from "react";
-import { IconEdit, IconX } from "@tabler/icons-react";
+import { IconEditCircle, IconX } from "@tabler/icons-react";
 import { Card, Group, Stack, Text, Title } from "@mantine/core";
 import { useModuleEditorContext } from "@/app/module-editor/[moduleId]/contexts/ModuleEditorContext";
 import styles from "@/app/module-editor/[moduleId]/ModuleEditor.module.css";
@@ -55,7 +55,7 @@ const ModuleAttribute: FC<Props> = ({ attribute }) => {
                             "Редактировать название (только для данного модуля)"
                         }
                         onClick={() => onEditAttributeLabel(attribute)}>
-                        <IconEdit />
+                        <IconEditCircle />
                     </ActionIconWithTip>
                     <ActionIconWithTip
                         tipLabel={"Удалить из модуля"}