Merge pull request #26 from rosset-nocpes/patch-3

feat(edit-tags): add tags to existing text/tags
hikka-io · May 20, 2024 · 1360c03 · 1360c03
2 parents 7368947 + 9930f97
commit 1360c03
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 6 deletions.
diff --git a/app/(pages)/edit/components/edit-description/components/tags-modal.tsx b/app/(pages)/edit/components/edit-description/components/tags-modal.tsx
@@ -2,7 +2,10 @@
 
 import * as React from 'react';
 import { FC } from 'react';
-import { UseFormSetValue } from 'react-hook-form/dist/types/form';
+import {
+    UseFormGetValues,
+    UseFormSetValue,
+} from 'react-hook-form/dist/types/form';
 import MaterialSymbolsAddRounded from '~icons/material-symbols/add-rounded';
 import MaterialSymbolsCheckSmallRounded from '~icons/material-symbols/check-small-rounded';
 import MaterialSymbolsDeleteForeverRounded from '~icons/material-symbols/delete-forever-rounded';
@@ -15,9 +18,10 @@ import { useSettingsContext } from '@/services/providers/settings-provider';
 
 interface Props {
     setValue: UseFormSetValue<any>;
+    getValues: UseFormGetValues<any>;
 }
 
-const TagsModal: FC<Props> = ({ setValue }) => {
+const TagsModal: FC<Props> = ({ setValue, getValues }) => {
     const { closeModal } = useModalContext();
     const [newTag, setNewTag] = React.useState('');
     const { setState: setSettingsState, editTags } = useSettingsContext();
@@ -31,7 +35,14 @@ const TagsModal: FC<Props> = ({ setValue }) => {
     };
 
     const handleSetTag = (tag: string) => {
-        setValue('description', tag);
+        setValue(
+            'description',
+            getValues('description') === ''
+                ? tag
+                : getValues('description') +
+                      (tag.split(' ')[0] == '---' ? ' ' : ', ') +
+                      tag.toLowerCase(),
+        );
         closeModal();
     };
 

diff --git a/app/(pages)/edit/components/edit-description/edit-description.tsx b/app/(pages)/edit/components/edit-description/edit-description.tsx
@@ -17,7 +17,7 @@ interface Props {
 }
 
 const EditDescription: FC<Props> = ({ mode }) => {
-    const { control, setValue } = useFormContext();
+    const { control, setValue, getValues } = useFormContext();
     const { openModal } = useModalContext();
     const { editTags } = useSettingsContext();
 
@@ -35,7 +35,18 @@ const EditDescription: FC<Props> = ({ mode }) => {
                                 size="badge"
                                 variant="outline"
                                 key={tag}
-                                onClick={() => setValue('description', tag)}
+                                onClick={() =>
+                                    setValue(
+                                        'description',
+                                        getValues('description') === ''
+                                            ? tag
+                                            : getValues('description') +
+                                                  (tag.split(' ')[0] == '---'
+                                                      ? ' '
+                                                      : ', ') +
+                                                  tag.toLowerCase(),
+                                    )
+                                }
                             >
                                 {tag
                                     .slice(0, 20)
@@ -49,12 +60,24 @@ const EditDescription: FC<Props> = ({ mode }) => {
                             onClick={() =>
                                 openModal({
                                     title: 'Теги редагування',
-                                    content: <TagsModal setValue={setValue} />,
+                                    content: (
+                                        <TagsModal
+                                            setValue={setValue}
+                                            getValues={getValues}
+                                        />
+                                    ),
                                 })
                             }
                         >
                             Усі теги
                         </Button>
+                        <Button
+                            size="badge"
+                            variant="secondary"
+                            onClick={() => setValue('description', '')}
+                        >
+                            Очистити поле
+                        </Button>
                     </div>
                     <ScrollBar orientation="horizontal" />
                 </ScrollArea>