diff --git a/app/(pages)/edit/[editId]/page.tsx b/app/(pages)/edit/[editId]/page.tsx index 0fef01e4..41eb04ff 100644 --- a/app/(pages)/edit/[editId]/page.tsx +++ b/app/(pages)/edit/[editId]/page.tsx @@ -13,7 +13,7 @@ import getEdit from '@/services/api/edit/getEdit'; import getQueryClient from '@/utils/getQueryClient'; import EditView from '../_components/edit-view'; -import Content from '../_components/ui/content/content'; +import Content from '@/app/(pages)/edit/_components/content/content'; import EditStatus from '../_components/ui/edit-status'; import Actions from './_components/actions'; import Author from './_components/author'; diff --git a/app/(pages)/edit/_components/ui/content/_components/details.tsx b/app/(pages)/edit/_components/content/_components/details.tsx similarity index 100% rename from app/(pages)/edit/_components/ui/content/_components/details.tsx rename to app/(pages)/edit/_components/content/_components/details.tsx diff --git a/app/(pages)/edit/_components/ui/content/_components/general.tsx b/app/(pages)/edit/_components/content/_components/general.tsx similarity index 100% rename from app/(pages)/edit/_components/ui/content/_components/general.tsx rename to app/(pages)/edit/_components/content/_components/general.tsx diff --git a/app/(pages)/edit/_components/ui/content/content.tsx b/app/(pages)/edit/_components/content/content.tsx similarity index 95% rename from app/(pages)/edit/_components/ui/content/content.tsx rename to app/(pages)/edit/_components/content/content.tsx index 6cedb450..e9a5c917 100644 --- a/app/(pages)/edit/_components/ui/content/content.tsx +++ b/app/(pages)/edit/_components/content/content.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; -import General from '@/app/(pages)/edit/_components/ui/content/_components/general'; +import General from '@/app/(pages)/edit/_components/content/_components/general'; import SubHeader from '@/components/sub-header'; import { Button } from '@/components/ui/button'; import { useSettingsContext } from '@/services/providers/settings-provider'; @@ -17,7 +17,7 @@ interface Props { } const Component = ({ slug, content_type, content }: Props) => { - const [type, setType] = React.useState<'general' | 'details'>('general'); + const [type, setType] = React.useState<'general' | 'details'>('details'); const { titleLanguage } = useSettingsContext(); if (!content) { @@ -39,18 +39,18 @@ const Component = ({ slug, content_type, content }: Props) => {
{type === 'general' && ( diff --git a/app/(pages)/edit/_components/ui/content/index.ts b/app/(pages)/edit/_components/content/index.ts similarity index 100% rename from app/(pages)/edit/_components/ui/content/index.ts rename to app/(pages)/edit/_components/content/index.ts diff --git a/app/(pages)/edit/_components/edit-description/_components/tags-modal.tsx b/app/(pages)/edit/_components/edit-description/_components/tags-modal.tsx new file mode 100644 index 00000000..b6e6c056 --- /dev/null +++ b/app/(pages)/edit/_components/edit-description/_components/tags-modal.tsx @@ -0,0 +1,106 @@ +'use client'; + +import * as React from 'react'; +import { 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'; + + + +import { Button } from '@/components/ui/button'; +import { Input } from '@/components/ui/input'; +import { useModalContext } from '@/services/providers/modal-provider'; +import { useSettingsContext } from '@/services/providers/settings-provider'; + + +interface Props { + setValue: UseFormSetValue; +} + +const Component = ({ setValue }: Props) => { + const { closeModal } = useModalContext(); + const [newTag, setNewTag] = React.useState(''); + const { setState: setSettingsState, editTags } = useSettingsContext(); + + const handleAddTag = () => { + setSettingsState!((prev) => ({ + ...prev, + editTags: [...(prev?.editTags || []), newTag], + })); + setNewTag(''); + }; + + const handleSetTag = (tag: string) => { + setValue('description', tag); + closeModal(); + }; + + const handleRemoveTag = (tag: string) => { + setSettingsState!((prev) => ({ + ...prev, + editTags: prev?.editTags?.filter((t) => t !== tag) || [], + })); + }; + + return ( + <> +
+
+ setNewTag(e.target.value)} + className="flex-1 w-full" + /> + +
+
+ +
+ +
+ {editTags?.map((tag, index) => ( +
+

{tag}

+
+ + +
+
+ ))} + + {editTags?.length === 0 && ( +
+

+ Не знайдено збережених тегів редагування +

+
+ )} +
+ + ); +}; + +export default Component; diff --git a/app/(pages)/edit/_components/ui/edit-description.tsx b/app/(pages)/edit/_components/edit-description/edit-description.tsx similarity index 66% rename from app/(pages)/edit/_components/ui/edit-description.tsx rename to app/(pages)/edit/_components/edit-description/edit-description.tsx index 9e164269..260f8ce9 100644 --- a/app/(pages)/edit/_components/ui/edit-description.tsx +++ b/app/(pages)/edit/_components/edit-description/edit-description.tsx @@ -1,15 +1,17 @@ -import * as React from 'react'; -import { Control, UseFormRegister, UseFormSetValue } from 'react-hook-form/dist/types/form'; - +'use client'; +import * as React from 'react'; +import { Controller } from 'react-hook-form'; +import { Control, UseFormSetValue } from 'react-hook-form/dist/types/form'; import { Button } from '@/components/ui/button'; import { Label } from '@/components/ui/label'; import { ScrollArea, ScrollBar } from '@/components/ui/scroll-area'; import { Textarea } from '@/components/ui/textarea'; -import { Controller } from 'react-hook-form'; -import { Input } from '@/components/ui/input'; +import { useModalContext } from '@/services/providers/modal-provider'; +import TagsModal from './_components/tags-modal'; +import { useSettingsContext } from '@/services/providers/settings-provider'; interface Props { setValue?: UseFormSetValue; @@ -17,9 +19,11 @@ interface Props { disabled?: boolean; } -const TAGS = ['Додано назву', 'Додано синоніми', 'Додано опис', 'Додано імʼя']; const Component = ({ setValue, control, disabled }: Props) => { + const { openModal } = useModalContext(); + const { editTags } = useSettingsContext(); + return (
); }; diff --git a/app/(pages)/edit/_components/edit-description/index.ts b/app/(pages)/edit/_components/edit-description/index.ts new file mode 100644 index 00000000..2b30308a --- /dev/null +++ b/app/(pages)/edit/_components/edit-description/index.ts @@ -0,0 +1,3 @@ +import EditDescription from './edit-description'; + +export default EditDescription; \ No newline at end of file diff --git a/app/(pages)/edit/_components/edit-form.tsx b/app/(pages)/edit/_components/edit-form.tsx index ec571de3..58b3df33 100644 --- a/app/(pages)/edit/_components/edit-form.tsx +++ b/app/(pages)/edit/_components/edit-form.tsx @@ -10,7 +10,7 @@ import { Turnstile, TurnstileInstance } from '@marsidev/react-turnstile'; import EditGroup from '@/app/(pages)/edit/_components/edit-group'; import AutoButton from '@/app/(pages)/edit/_components/ui/auto-button'; -import EditDescription from '@/app/(pages)/edit/_components/ui/edit-description'; +import EditDescription from '@/app/(pages)/edit/_components/edit-description/edit-description'; import { useContentData } from '@/app/(pages)/edit/page.hooks'; import { Button } from '@/components/ui/button'; import addEdit from '@/services/api/edit/addEdit'; diff --git a/app/(pages)/edit/_components/edit-view.tsx b/app/(pages)/edit/_components/edit-view.tsx index 6f9ecae6..402a32a6 100644 --- a/app/(pages)/edit/_components/edit-view.tsx +++ b/app/(pages)/edit/_components/edit-view.tsx @@ -10,7 +10,7 @@ import { Turnstile, TurnstileInstance } from '@marsidev/react-turnstile'; import EditGroup from '@/app/(pages)/edit/_components/edit-group'; import AutoButton from '@/app/(pages)/edit/_components/ui/auto-button'; -import EditDescription from '@/app/(pages)/edit/_components/ui/edit-description'; +import EditDescription from '@/app/(pages)/edit/_components/edit-description/edit-description'; import { Button } from '@/components/ui/button'; import updateEdit from '@/services/api/edit/updateEdit'; import { useAuthContext } from '@/services/providers/auth-provider'; diff --git a/app/(pages)/edit/new/page.tsx b/app/(pages)/edit/new/page.tsx index 31668bd5..1e3bf45e 100644 --- a/app/(pages)/edit/new/page.tsx +++ b/app/(pages)/edit/new/page.tsx @@ -10,7 +10,7 @@ import getAnimeInfo from '@/services/api/anime/getAnimeInfo'; import getCharacterInfo from '@/services/api/characters/getCharacterInfo'; import getQueryClient from '@/utils/getQueryClient'; -import Content from '../_components/ui/content/content'; +import Content from '@/app/(pages)/edit/_components/content/content'; import EditForm from '../_components/edit-form'; import RulesAlert from './_components/rules-alert'; diff --git a/services/providers/settings-provider.tsx b/services/providers/settings-provider.tsx index 5b2fbdf6..c37b914c 100644 --- a/services/providers/settings-provider.tsx +++ b/services/providers/settings-provider.tsx @@ -12,6 +12,7 @@ import { interface State { titleLanguage?: 'title_en' | 'title_ua' | 'title_ja'; + editTags?: string[]; } interface ContextProps extends State { @@ -35,6 +36,7 @@ async function getInitialState(): Promise { return { titleLanguage: 'title_ua', + editTags: ['Додано назву', 'Додано синоніми', 'Додано опис', 'Додано імʼя'], }; } @@ -65,4 +67,4 @@ export default function SettingsProvider({ children }: Props) { {children} ); -} \ No newline at end of file +}