fix disabling Save button on Editor Tags page

src/features/AdminPage/TagsPage/TagsPage/TagAdminModal.tsx

@@ -3,7 +3,8 @@ import '@features/AdminPage/AdminModal.styles.scss';
 import CancelBtn from '@images/utils/Cancel_btn.svg';
 
 import React, {
-    Dispatch, SetStateAction, useEffect
+    Dispatch, SetStateAction, useEffect,
+    useState
 } from 'react';
 import { useAsync } from '@hooks/stateful/useAsync.hook';
 import useMobx from '@stores/root-store';
@@ -32,6 +33,8 @@ const SourceModal: React.FC<SourceModalProps> = ({
     const [form] = Form.useForm();
     const isEditing = !!initialData;
 
+    const [isSaveButtonDisabled, setIsSaveButtonDisabled] = useState(true);
+
     useAsync(() => tagsStore.fetchTags(), []);
 
     useEffect(() => {
@@ -40,8 +43,18 @@ const SourceModal: React.FC<SourceModalProps> = ({
                 title: initialData.title,
             });
         }
+        updateSaveButtonState();
     }, [initialData, isModalVisible, form]);
 
+    const updateSaveButtonState = () => {
+        const title = form.getFieldValue("title")?.trim();
+        const isChanged = initialData ? initialData.title !== title : true;
+        const isEmpty = !title;
+        const isExisting = isEmpty ? false : tagsStore.getTagArray.some(tag => tag.title === title);
+
+        setIsSaveButtonDisabled(!isChanged || isExisting || isEmpty);
+    }
+
     const closeModal = () => {
         setIsModalOpen(false);
     };
@@ -60,7 +73,7 @@ const SourceModal: React.FC<SourceModalProps> = ({
         await form.validateFields();
 
         const currentTag = {
-            ...(initialData?.id && { id : initialData?.id }),
+            ...(initialData?.id && { id: initialData?.id }),
             title: formData.title,
         };
 
@@ -110,19 +123,26 @@ const SourceModal: React.FC<SourceModalProps> = ({
                 )}
                 footer={null}
             >
-                <Form form={form} layout="vertical" onFinish={onSubmit} initialValues={initialData} onKeyDown={(e)=> e.key == "Enter" ? e.preventDefault(): ''}>
+                <Form
+                    form={form}
+                    layout="vertical"
+                    onFinish={onSubmit}
+                    initialValues={initialData}
+                    onKeyDown={(e) => e.key == "Enter" ? e.preventDefault() : ''}
+                    onValuesChange={updateSaveButtonState}>
                     <Form.Item
                         name="title"
                         label="Назва: "
                         rules={[{ required: true, message: 'Введіть назву' },
-                            {validator: validateTag}
+                        { validator: validateTag }
                         ]}
                     >
                         <Input placeholder="Title" maxLength={50} showCount />
                     </Form.Item>
                     <div className="center">
                         <Button
                             className="streetcode-custom-button"
+                            disabled={isSaveButtonDisabled}
                             onClick={() => handleOk()}
                         >
                             Зберегти