feat: statuses colors

src/components/ui/BaseTable/components/UpdateDeleteTableActions.tsx

@@ -1,7 +1,8 @@
 import React, { CSSProperties, FC } from "react";
 import { IconDotsVertical, IconEdit, IconTrash } from "@tabler/icons-react";
-import { Box, Flex, Group, Menu, Text } from "@mantine/core";
+import { Box, Flex, Menu } from "@mantine/core";
 import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
+import DropdownMenuItem from "@/components/ui/DropdownMenuItem/DropdownMenuItem";
 import ThemeIcon from "@/components/ui/ThemeIcon/ThemeIcon";
 import useIsMobile from "@/hooks/utils/useIsMobile";
 
@@ -31,26 +32,16 @@ const UpdateDeleteTableActions: FC<Props> = ({
                     </Box>
                 </Menu.Target>
                 <Menu.Dropdown>
-                    <Menu.Item
-                        onClick={e => {
-                            e.stopPropagation();
-                            onChange();
-                        }}>
-                        <Group wrap={"nowrap"}>
-                            <IconEdit />
-                            <Text>Редактировать</Text>
-                        </Group>
-                    </Menu.Item>
-                    <Menu.Item
-                        onClick={e => {
-                            e.stopPropagation();
-                            onDelete();
-                        }}>
-                        <Group wrap={"nowrap"}>
-                            <IconTrash />
-                            <Text>Удалить</Text>
-                        </Group>
-                    </Menu.Item>
+                    <DropdownMenuItem
+                        onClick={onChange}
+                        icon={<IconEdit />}
+                        label={"Редактировать"}
+                    />
+                    <DropdownMenuItem
+                        onClick={onDelete}
+                        icon={<IconTrash />}
+                        label={"Удалить"}
+                    />
                 </Menu.Dropdown>
             </Menu>
         );

src/components/ui/DropdownMenuItem/DropdownMenuItem.tsx

@@ -0,0 +1,26 @@
+import React, { FC, MouseEventHandler, ReactNode } from "react";
+import { Group, Menu, Text } from "@mantine/core";
+
+type Props = {
+    onClick: MouseEventHandler<HTMLButtonElement>;
+    icon: ReactNode;
+    label: string;
+};
+
+const DropdownMenuItem: FC<Props> = ({ icon, label, onClick }) => {
+    const onClickWrapper: MouseEventHandler<HTMLButtonElement> = e => {
+        e.stopPropagation();
+        onClick(e);
+    };
+
+    return (
+        <Menu.Item onClick={onClickWrapper}>
+            <Group wrap={"nowrap"}>
+                {icon}
+                <Text>{label}</Text>
+            </Group>
+        </Menu.Item>
+    );
+};
+
+export default DropdownMenuItem;