feat: services table, base segmented control

src/app/services/modals/ServiceCategoryEditorModal.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { Flex, TextInput } from "@mantine/core";
+import { useForm } from "@mantine/form";
+import { ContextModalProps } from "@mantine/modals";
+import {
+    CreateServiceCategorySchema,
+    ServiceCategorySchema,
+    UpdateServiceCategorySchema,
+} from "@/lib/client";
+import BaseFormModal, {
+    CreateEditFormProps,
+} from "@/modals/base/BaseFormModal/BaseFormModal";
+
+type Props = CreateEditFormProps<
+    CreateServiceCategorySchema,
+    UpdateServiceCategorySchema,
+    ServiceCategorySchema
+>;
+
+const ServiceCategoryEditorModal = ({
+    context,
+    id,
+    innerProps,
+}: ContextModalProps<Props>) => {
+    const initialValues = innerProps.isEditing
+        ? innerProps.entity
+        : {
+              name: "",
+              dealServiceRank: "",
+              productServiceRank: "",
+          };
+
+    const form = useForm<Partial<ServiceCategorySchema>>({
+        initialValues,
+        validate: {
+            name: name =>
+                (!name || name.trim() === "") &&
+                "Необходимо ввести название категории",
+        },
+    });
+
+    const onClose = () => context.closeContextModal(id);
+
+    return (
+        <BaseFormModal
+            {...innerProps}
+            form={form}
+            closeOnSubmit
+            onClose={onClose}>
+            <Flex
+                gap={"xs"}
+                direction={"column"}>
+                <TextInput
+                    placeholder={"Введите название категори"}
+                    label={"Название категории"}
+                    {...form.getInputProps("name")}
+                />
+            </Flex>
+        </BaseFormModal>
+    );
+};
+
+export default ServiceCategoryEditorModal;