From c9713a93ac14a6dc56874e31be582057d9e2bd14 Mon Sep 17 00:00:00 2001 From: hamid zarghami Date: Sat, 25 Jul 2026 11:19:08 +0330 Subject: [PATCH] remove remark --- src/components/DefaulModal.tsx | 21 ++++++++++-- src/components/ModalConfrim.tsx | 9 +++-- .../task-detail/TaskDetailToolbar.tsx | 34 ++++++++++++++++++- .../labels/TaskDetailLabelsList.tsx | 16 +++++++-- .../labels/TaskDetailLabelsPopover.tsx | 6 ++++ .../taskmanager/task/hooks/useTaskData.ts | 12 +++++++ .../taskmanager/task/service/TaskService.ts | 5 +++ 7 files changed, 95 insertions(+), 8 deletions(-) diff --git a/src/components/DefaulModal.tsx b/src/components/DefaulModal.tsx index 9fb8969..41b2901 100644 --- a/src/components/DefaulModal.tsx +++ b/src/components/DefaulModal.tsx @@ -1,4 +1,5 @@ import { FC, Fragment, ReactNode, useEffect } from 'react' +import { clx } from '../helpers/utils' import HeaderModal from './HeaderModal' interface Props { @@ -8,6 +9,8 @@ interface Props { isHeader?: boolean, title_header?: string, width?: number + /** Raise above popovers (z-80) when confirm opens from nested panels */ + elevated?: boolean } const DefaulModal: FC = (props: Props) => { @@ -26,7 +29,14 @@ const DefaulModal: FC = (props: Props) => { { props.open && ( -
+
e.stopPropagation()} + className={clx( + 'xl:justify-center xl:items-center items-end flex overflow-hidden fixed inset-0 h-auto top-0 bottom-0 m-auto outline-none focus:outline-none xl:max-w-xl mx-auto', + props.elevated ? 'z-[100]' : 'z-[60]', + )} + >
@@ -46,7 +56,14 @@ const DefaulModal: FC = (props: Props) => {
-
+
e.stopPropagation()} + className={clx( + 'fixed size-full top-0 bottom-0 right-0 modalGlass inset-0', + props.elevated ? 'z-[90]' : 'z-50', + )} + /> ) } diff --git a/src/components/ModalConfrim.tsx b/src/components/ModalConfrim.tsx index ae92f28..82870c6 100644 --- a/src/components/ModalConfrim.tsx +++ b/src/components/ModalConfrim.tsx @@ -1,7 +1,8 @@ import { FC, useState } from 'react' -import DefaulModal from './DefaulModal' +import { createPortal } from 'react-dom' import { useTranslation } from 'react-i18next' import Button from './Button' +import DefaulModal from './DefaulModal' import Textarea from './Textarea' type Props = { @@ -18,12 +19,13 @@ const ModalConfrim: FC = (props: Props) => { const { t } = useTranslation('global') const [description, setDescription] = useState('') - return ( + return createPortal(
@@ -60,7 +62,8 @@ const ModalConfrim: FC = (props: Props) => { />
- + , + document.body, ) } diff --git a/src/pages/taskmanager/components/task-detail/TaskDetailToolbar.tsx b/src/pages/taskmanager/components/task-detail/TaskDetailToolbar.tsx index b8c16ce..a904bc3 100644 --- a/src/pages/taskmanager/components/task-detail/TaskDetailToolbar.tsx +++ b/src/pages/taskmanager/components/task-detail/TaskDetailToolbar.tsx @@ -17,7 +17,13 @@ import TaskDetailTimePopover from "./time/TaskDetailTimePopover"; import type { TaskUser } from "./users/types"; import type { UserItemType } from "../../../users/types/UserTypes"; import type { TaskDetailType } from "../../task/types/TaskTypes"; -import { useCreateCheckListItem, useCreateTaskAttachment, useCreateTaskRemark, useUpdateTask } from "../../task/hooks/useTaskData"; +import { + useCreateCheckListItem, + useCreateTaskAttachment, + useCreateTaskRemark, + useDeleteTaskRemark, + useUpdateTask, +} from "../../task/hooks/useTaskData"; import { useSingleUpload } from "../../../service/hooks/useServiceData"; import { ErrorType } from "../../../../helpers/types"; @@ -31,6 +37,7 @@ type Props = { const TaskDetailToolbar: FC = ({ activeTab, onTabChange, taskDetail, taskId }) => { const { t } = useTranslation("global"); const createTaskRemark = useCreateTaskRemark(); + const deleteTaskRemark = useDeleteTaskRemark(); const createCheckListItem = useCreateCheckListItem(); const createTaskAttachment = useCreateTaskAttachment(); const singleUpload = useSingleUpload(); @@ -224,6 +231,29 @@ const TaskDetailToolbar: FC = ({ activeTab, onTabChange, taskDetail, task ); }; + const handleDeleteLabel = (id: string) => { + const effectiveTaskId = taskId || taskDetail?.id; + if (!effectiveTaskId) return; + + deleteTaskRemark.mutate( + { id, taskId: effectiveTaskId }, + { + onSuccess: () => { + setLabels((prev) => prev.filter((label) => label.id !== id)); + setSelectedLabelIds((prev) => { + const next = new Set(prev); + next.delete(id); + return next; + }); + toast(t("success"), "success"); + }, + onError: (error: ErrorType) => { + toast(error.response?.data?.error.message[0], "error"); + }, + }, + ); + }; + const handleChecklistClose = () => { if (isChecklistOpen) onTabChange("checklist"); }; @@ -338,7 +368,9 @@ const TaskDetailToolbar: FC = ({ activeTab, onTabChange, taskDetail, task onViewChange={setLabelsView} onToggle={handleLabelToggle} onCreate={handleCreate} + onDelete={handleDeleteLabel} isSubmitting={createTaskRemark.isPending} + isDeleting={deleteTaskRemark.isPending} /> ) : null } diff --git a/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsList.tsx b/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsList.tsx index ba0fc6f..531e866 100644 --- a/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsList.tsx +++ b/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsList.tsx @@ -2,6 +2,7 @@ import { AddCircle, Edit } from "iconsax-react"; import { type FC } from "react"; import { useTranslation } from "react-i18next"; import Button from "../../../../../components/Button"; +import TrashWithConfrim from "../../../../../components/TrashWithConfrim"; import TaskDetailLabelCheckbox from "./TaskDetailLabelCheckbox"; import type { TaskLabel } from "./types"; @@ -10,10 +11,20 @@ type Props = { selectedIds: Set; onToggle: (id: string) => void; onEdit: (label: TaskLabel) => void; + onDelete: (id: string) => void; onCreateClick: () => void; + isDeleting?: boolean; }; -const TaskDetailLabelsList: FC = ({ labels, selectedIds, onToggle, onEdit, onCreateClick }) => { +const TaskDetailLabelsList: FC = ({ + labels, + selectedIds, + onToggle, + onEdit, + onDelete, + onCreateClick, + isDeleting = false, +}) => { const { t } = useTranslation("global"); return ( @@ -32,7 +43,8 @@ const TaskDetailLabelsList: FC = ({ labels, selectedIds, onToggle, onEdit {label.title && {label.title}}
- onEdit(label)} size={16} color="#0047FF" /> + onEdit(label)} size={16} color="#0047FF" className="shrink-0 cursor-pointer" /> + onDelete(label.id)} isLoading={isDeleting} size={16} color="#FF0000" />
); })} diff --git a/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsPopover.tsx b/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsPopover.tsx index 134eff5..475ef65 100644 --- a/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsPopover.tsx +++ b/src/pages/taskmanager/components/task-detail/labels/TaskDetailLabelsPopover.tsx @@ -10,7 +10,9 @@ type Props = { onViewChange: (view: LabelsView) => void; onToggle: (id: string) => void; onCreate: (title: string, color: string) => void; + onDelete: (id: string) => void; isSubmitting?: boolean; + isDeleting?: boolean; }; const TaskDetailLabelsPopover: FC = ({ @@ -20,7 +22,9 @@ const TaskDetailLabelsPopover: FC = ({ onViewChange, onToggle, onCreate, + onDelete, isSubmitting = false, + isDeleting = false, }) => { return ( <> @@ -30,7 +34,9 @@ const TaskDetailLabelsPopover: FC = ({ selectedIds={selectedIds} onToggle={onToggle} onEdit={() => undefined} + onDelete={onDelete} onCreateClick={() => onViewChange("create")} + isDeleting={isDeleting} /> ) : ( { }); }; +export const useDeleteTaskRemark = () => { + const queryClient = useQueryClient(); + + return useMutation({ + mutationFn: ({ id }: { id: string; taskId: string }) => api.deleteTaskRemark(id), + onSuccess: (_data, variables) => { + queryClient.invalidateQueries({ queryKey: ["task-detail", variables.taskId] }); + queryClient.invalidateQueries({ queryKey: ["project"] }); + }, + }); +}; + export const useCreateCheckListItem = () => { const queryClient = useQueryClient(); diff --git a/src/pages/taskmanager/task/service/TaskService.ts b/src/pages/taskmanager/task/service/TaskService.ts index b96f987..f1f4416 100644 --- a/src/pages/taskmanager/task/service/TaskService.ts +++ b/src/pages/taskmanager/task/service/TaskService.ts @@ -64,6 +64,11 @@ export const createTaskRemark = async (params: CreateTaskRemarkType): Promise { + const { data } = await axios.delete(`/task-manager/remarks/${id}`); + return data; +}; + export const createCheckListItem = async (params: CreateCheckListItemType): Promise => { const { data } = await axios.post(`/task-manager/check-list-items`, params); return data;