diff --git a/src/components/ModalTags.tsx b/src/components/ModalTags.tsx index 94614b1..c885d65 100644 --- a/src/components/ModalTags.tsx +++ b/src/components/ModalTags.tsx @@ -1,8 +1,9 @@ import { IAPITag } from "@/pages/profile_tasks.dto"; +import apiClient from "@/services/api"; import { cn } from "@/utils/class-merge"; -import { BookOpenIcon, DocumentDuplicateIcon } from "@heroicons/react/24/outline"; +import { BookOpenIcon, CheckIcon, DocumentDuplicateIcon, PlusCircleIcon } from "@heroicons/react/24/outline"; import { FunctionComponent } from "preact"; -import { Dispatch, StateUpdater, useEffect, useState } from "preact/hooks"; +import { Dispatch, StateUpdater, useEffect, useRef, useState } from "preact/hooks"; import Button from "./ui/Button"; import ModalWindow, { ModalWindowProps } from "./ui/Modal"; @@ -22,6 +23,7 @@ interface ModalTagsProps extends ModalWindowProps { first: IAPITag[]; second: IAPITag[]; }; + refreshTags: () => void; } const ModalTags: FunctionComponent = ({ @@ -31,16 +33,46 @@ const ModalTags: FunctionComponent = ({ onChange, value, tagsList, + refreshTags, ...rest }) => { const [showFirstTags, setShowFirstTags] = useState(false); const [showSecondTags, setShowSecondTags] = useState(false); + const [showAddFirstTag, setShowAddFirstTag] = useState(false); + const [showAddSecondTag, setShowAddSecondTag] = useState(false); + const addFirstTagRef = useRef(null); + const addSecondTagRef = useRef(null); useEffect(() => { if (showFirstTags && showSecondTags) setShowFirstTags(false); }, [showSecondTags]); useEffect(() => { if (showFirstTags && showSecondTags) setShowSecondTags(false); }, [showFirstTags]); + + const handleCreateTag = async () => { + if (!addFirstTagRef.current?.value && !addSecondTagRef.current?.value) return; + const data: { subject_name?: string; taskType_name?: string } = {}; + if (addFirstTagRef.current && addFirstTagRef.current.value) data.subject_name = addFirstTagRef.current.value; + if (addSecondTagRef.current && addSecondTagRef.current.value) data.taskType_name = addSecondTagRef.current.value; + const response = await apiClient<{ success: boolean; subject?: IAPITag; taskType?: IAPITag }>( + "/api/tags/create_tags/", + { method: "POST", body: JSON.stringify(data) } + ); + if (response.success) { + refreshTags(); + if (showAddFirstTag) { + const new_subject_id = response.subject!.id; + onChange!((prev) => ({ ...prev, first: new_subject_id })); + setShowAddFirstTag(false); + } + if (showAddSecondTag) { + const new_taskType_id = response.taskType!.id; + onChange!((prev) => ({ ...prev, second: new_taskType_id })); + setShowAddSecondTag(false); + } + } + }; + return ( = ({ onClose!(); setShowFirstTags(false); setShowSecondTags(false); + setShowAddFirstTag(false); + setShowAddSecondTag(false); }} className="relative h-[14rem] justify-between py-4 md:h-[14rem] md:w-[25rem]" zIndex={70} @@ -58,21 +92,31 @@ const ModalTags: FunctionComponent = ({
{showFirstTags && ( -
-
+
+
{tagsList?.first.map((tag) => (
= ({

{tag.name}

))} +
+ {showAddFirstTag && ( +
+ + +
+ )}
)} {showSecondTags && ( -
-
+
+
{tagsList?.second.map((tag) => (
= ({

{tag.name}

))} +
+ {showAddSecondTag && ( +
+ + +
+ )}
)}
diff --git a/src/pages/profile_calendar.tsx b/src/pages/profile_calendar.tsx index dec2498..a179943 100644 --- a/src/pages/profile_calendar.tsx +++ b/src/pages/profile_calendar.tsx @@ -378,6 +378,7 @@ const ProfileCalendar: FunctionComponent = () => { ) : ( <> {
) : (