@open-mercato/core 0.10.1-develop.7717.1.2befe9c634 → 0.10.1-develop.7721.1.b5c4a00a68

package/dist/modules/staff/lib/time-tracking-ui/TaskDrawer.js

@@ -13,6 +13,7 @@ import {
   DrawerHeader,
   DrawerTitle
 } from "@open-mercato/ui/primitives/drawer";
+import { Alert, AlertDescription } from "@open-mercato/ui/primitives/alert";
 import { Avatar } from "@open-mercato/ui/primitives/avatar";
 import { Badge } from "@open-mercato/ui/primitives/badge";
 import { Button } from "@open-mercato/ui/primitives/button";
@@ -28,7 +29,11 @@ import {
 } from "@open-mercato/ui/primitives/select";
 import { ErrorMessage, LoadingMessage } from "@open-mercato/ui/backend/detail";
 import { apiCall, apiCallOrThrow, withScopedApiRequestHeaders } from "@open-mercato/ui/backend/utils/apiCall";
-import { buildOptimisticLockHeader } from "@open-mercato/ui/backend/utils/optimisticLock";
+import {
+  buildOptimisticLockHeader,
+  extractOptimisticLockConflict,
+  extractRecordLockConflict
+} from "@open-mercato/ui/backend/utils/optimisticLock";
 import { surfaceRecordConflict } from "@open-mercato/ui/backend/conflicts";
 import { useBackendChrome } from "@open-mercato/ui/backend/BackendChromeProvider";
 import { useConfirmDialog } from "@open-mercato/ui/backend/confirm-dialog";
@@ -42,6 +47,10 @@ import { useT } from "@open-mercato/shared/lib/i18n/context";
 import { useOrganizationScopeVersion } from "@open-mercato/shared/lib/frontend/useOrganizationScope";
 import { createLogger } from "@open-mercato/shared/lib/logger";
 import { TaskCommentThread } from "./TaskCommentThread.js";
+import { useAppEvent } from "@open-mercato/ui/backend/injection/useAppEvent";
+import { SupportRequestPanel } from "./SupportRequestPanel.js";
+import { SupportAttachmentsSection } from "./SupportAttachmentsSection.js";
+import { readSupportTicket, SUPPORT_ACTIVITY_EVENT } from "./supportTicketData.js";
 import { TaskQuickLog } from "./TaskQuickLog.js";
 import { TagPicker, tagChipStyle } from "./TagPicker.js";
 import { slugifyProjectName } from "../time-tracking/projectCode.js";
@@ -65,15 +74,28 @@ import {
   toDrawerComment,
   toDrawerEntry,
   todayIsoDate,
-  buildEntryClocks
+  buildEntryClocks,
+  isAssignmentEventForTask,
+  TASK_ASSIGNMENT_CHANGED_EVENT,
+  TASK_DRAWER_QUERY_ROOT
 } from "./taskDrawerData.js";
 const logger = createLogger("staff").child({ component: "TaskDrawer" });
 const TASK_ENTITY_ID = "staff:staff_time_task";
 const TASK_DRAWER_MUTATION_CONTEXT_ID = "staff.time_tracking.task_drawer";
+function taskDrawerFormId(taskId) {
+  return `${TASK_DRAWER_MUTATION_CONTEXT_ID}:${taskId}`;
+}
+const ASSIGNMENT_RACE_CODES = /* @__PURE__ */ new Set(["task_already_claimed", "task_assignment_changed"]);
+function isAssignmentRace(error) {
+  if (extractOptimisticLockConflict(error) || extractRecordLockConflict(error)) return true;
+  if (!error || typeof error !== "object") return false;
+  const code = error.code;
+  return typeof code === "string" && ASSIGNMENT_RACE_CODES.has(code);
+}
 const RATES_FEATURE = "staff.timesheets.rates.view";
 const TASKS_MANAGE_FEATURE = "staff.timesheets.tasks.manage";
 const ENTRIES_LIST_PATH = "/backend/staff/time-tracking/entries";
-const DRAWER_QUERY_ROOT = ["staff", "time-tracking", "task-drawer"];
+const DRAWER_QUERY_ROOT = TASK_DRAWER_QUERY_ROOT;
 const DIRECTORY_PAGE_SIZE = 100;
 const CHILD_PAGE_SIZE = 100;
 const COMMENT_PAGE_SIZE = 50;
@@ -81,6 +103,12 @@ const ENTRY_PAGE_SIZE = 100;
 const MAX_ENTRY_PAGES = 3;
 const RECENT_ENTRY_COUNT = 5;
 const ELAPSED_TICK_MS = 1e3;
+function readTaskAssignmentAbility(row) {
+  const block = row._staffAssignment;
+  if (!block || typeof block !== "object") return { canClaim: false, canRelease: false };
+  const ability = block;
+  return { canClaim: ability.canClaim === true, canRelease: ability.canRelease === true };
+}
 async function fetchProjectEntries(projectId) {
   const rows = [];
   for (let page = 1; page <= MAX_ENTRY_PAGES; page += 1) {
@@ -119,10 +147,18 @@ function TaskDrawer({
   const [now, setNow] = React.useState(() => Date.now());
   const saveChainRef = React.useRef(Promise.resolve());
   const versionRef = React.useRef(null);
-  const { runMutation, retryLastMutation } = useGuardedMutation({
+  const [notice, setNotice] = React.useState(null);
+  const { runMutation: runGuardedMutation, retryLastMutation } = useGuardedMutation({
     contextId: TASK_DRAWER_MUTATION_CONTEXT_ID,
     blockedMessage: t("staff.time_tracking.taskDrawer.properties.saveError", "Could not save the change.")
   });
+  const runMutation = React.useCallback(
+    (input) => {
+      setNotice(null);
+      return runGuardedMutation(input);
+    },
+    [runGuardedMutation]
+  );
   const taskQuery = useQuery({
     queryKey: [...DRAWER_QUERY_ROOT, "task", `scope:${scopeVersion}`, taskId],
     enabled: open && taskId.length > 0,
@@ -135,11 +171,17 @@ function TaskDrawer({
       const row = readItems(call.result)[0];
       if (!row) return null;
       const parsed = toBoardTask(row);
-      return parsed ? { task: parsed, createdAt: readString(row, "created_at", "createdAt") } : null;
+      return parsed ? {
+        task: parsed,
+        createdAt: readString(row, "created_at", "createdAt"),
+        support: readSupportTicket(row),
+        assignment: readTaskAssignmentAbility(row)
+      } : null;
     }
   });
   const task = taskQuery.data?.task ?? null;
   const createdAt = taskQuery.data?.createdAt ?? null;
+  const support = taskQuery.data?.support ?? null;
   const projectId = task?.timeProjectId ?? null;
   const taskInjectionContext = React.useMemo(
     () => ({
@@ -157,6 +199,9 @@ function TaskDrawer({
     versionRef.current = task.updatedAt;
     setTagIds(task.tagIds);
   }, [task]);
+  React.useEffect(() => {
+    setNotice(null);
+  }, [taskId]);
   const statusesQuery = useQuery({
     queryKey: [...DRAWER_QUERY_ROOT, "statuses", `scope:${scopeVersion}`, projectId ?? "none"],
     enabled: open && !!projectId,
@@ -320,15 +365,28 @@ function TaskDrawer({
   }, [taskQuery]);
   const reportError = React.useCallback(
     (error, fallback) => {
+      const conflictNotice = {
+        status: "warning",
+        message: t(
+          "staff.time_tracking.taskDrawer.conflict",
+          "Someone else changed this task. It now shows the latest version. Check it and try again."
+        )
+      };
+      const seenVersion = versionRef.current;
+      invalidate("children");
       if (surfaceRecordConflict(error, t)) {
+        setNotice(conflictNotice);
         invalidate("task");
-        invalidate("children");
         return;
       }
       logger.error("staff.time_tracking task drawer mutation failed", { err: error });
-      flash(error instanceof Error && error.message ? error.message : fallback, "error");
+      setNotice({ status: "error", message: error instanceof Error && error.message ? error.message : fallback });
+      void taskQuery.refetch().then((refreshed) => {
+        const currentVersion = refreshed.data?.task.updatedAt ?? null;
+        if (seenVersion && currentVersion && currentVersion !== seenVersion) setNotice(conflictNotice);
+      });
     },
-    [invalidate, t]
+    [invalidate, t, taskQuery]
   );
   const handleQuickLog = React.useCallback(
     async ({ minutes, description, date, isBillable, startClock, endClock }) => {
@@ -372,9 +430,7 @@ function TaskDrawer({
             { errorMessage: t("staff.time_tracking.taskDrawer.quickLog.error", "Could not save the time entry.") }
           ),
           context: {
-            formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-            resourceKind: "staff.timesheets.time_entry",
-            resourceId: taskId,
+            formId: taskDrawerFormId(taskId),
             retryLastMutation
           }
         });
@@ -401,14 +457,12 @@ function TaskDrawer({
           { errorMessage: t("staff.time_tracking.board.timer.stopError", "Could not stop the timer.") }
         ),
         context: {
-          formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-          resourceKind: "staff.timesheets.time_entry",
-          resourceId: entryId,
+          formId: taskDrawerFormId(taskId),
           retryLastMutation
         }
       });
     },
-    [retryLastMutation, runMutation, t]
+    [retryLastMutation, runMutation, t, taskId]
   );
   const handleStopTimer = React.useCallback(async () => {
     if (!runningTimer.entryId) return;
@@ -458,9 +512,7 @@ function TaskDrawer({
           { errorMessage: t("staff.time_tracking.board.timer.startError", "Could not start the timer.") }
         ),
         context: {
-          formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-          resourceKind: "staff.timesheets.time_entry",
-          resourceId: taskId,
+          formId: taskDrawerFormId(taskId),
           retryLastMutation
         }
       });
@@ -535,9 +587,7 @@ function TaskDrawer({
               )
             ),
             context: {
-              formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-              resourceKind: "staff.timesheets.task",
-              resourceId: taskId,
+              formId: taskDrawerFormId(taskId),
               retryLastMutation
             }
           });
@@ -572,9 +622,7 @@ function TaskDrawer({
               )
             ),
             context: {
-              formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-              resourceKind: "staff.timesheets.task",
-              resourceId: taskId,
+              formId: taskDrawerFormId(taskId),
               retryLastMutation
             }
           });
@@ -609,6 +657,72 @@ function TaskDrawer({
     },
     [saveTaskField]
   );
+  const canClaim = taskQuery.data?.assignment.canClaim === true;
+  const canRelease = taskQuery.data?.assignment.canRelease === true;
+  const runAssignmentAction = React.useCallback(
+    (action) => {
+      if (!task) return;
+      const errorMessage = action === "claim" ? t("staff.time_tracking.taskDrawer.assignment.claimError", "Could not claim the task.") : t("staff.time_tracking.taskDrawer.assignment.releaseError", "Could not release the task.");
+      setBusy(true);
+      void runSerialized(async () => {
+        try {
+          const done = await runMutation({
+            operation: () => apiCallOrThrow(
+              `/api/staff/timesheets/tasks/${encodeURIComponent(taskId)}/${action}`,
+              { method: "POST" },
+              { errorMessage }
+            ),
+            context: {
+              formId: taskDrawerFormId(taskId),
+              retryLastMutation
+            }
+          });
+          const updatedAt = typeof done?.result?.updatedAt === "string" ? done.result.updatedAt : null;
+          if (updatedAt) versionRef.current = updatedAt;
+          else await refreshVersion();
+          invalidate("task");
+          flash(
+            action === "claim" ? t("staff.time_tracking.taskDrawer.assignment.claimed", "Task claimed.") : t("staff.time_tracking.taskDrawer.assignment.released", "Task released."),
+            "success"
+          );
+          onChanged?.();
+        } catch (error) {
+          if (!isAssignmentRace(error)) {
+            reportError(error, errorMessage);
+            return;
+          }
+          const refreshed = await taskQuery.refetch();
+          const assigneeId = refreshed.data?.task.assigneeStaffMemberId ?? null;
+          const takenByOther = action === "claim" && assigneeId !== null && assigneeId !== selfStaffMemberId;
+          setNotice({
+            status: "warning",
+            message: takenByOther ? t("staff.timesheets.errors.taskAlreadyClaimed", "Someone else already took this task.") : t(
+              "staff.time_tracking.taskDrawer.conflict",
+              "Someone else changed this task. It now shows the latest version. Check it and try again."
+            )
+          });
+          invalidate("task");
+          onChanged?.();
+        } finally {
+          setBusy(false);
+        }
+      });
+    },
+    [
+      invalidate,
+      onChanged,
+      refreshVersion,
+      reportError,
+      retryLastMutation,
+      runMutation,
+      runSerialized,
+      selfStaffMemberId,
+      t,
+      task,
+      taskId,
+      taskQuery
+    ]
+  );
   const handleToggleSubtask = React.useCallback(
     async (child, done) => {
       const targetStatusId = done ? resolveDoneStatusId(statuses) : resolveDefaultStatusId(statuses);
@@ -638,9 +752,7 @@ function TaskDrawer({
             )
           ),
           context: {
-            formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-            resourceKind: "staff.timesheets.task",
-            resourceId: child.id,
+            formId: taskDrawerFormId(taskId),
             retryLastMutation
           }
         });
@@ -656,7 +768,7 @@ function TaskDrawer({
         setBusy(false);
       }
     },
-    [invalidate, onChanged, reportError, retryLastMutation, runMutation, statuses, t]
+    [invalidate, onChanged, reportError, retryLastMutation, runMutation, statuses, t, taskId]
   );
   const handleAddSubtask = React.useCallback(async () => {
     const title = subtaskDraft.trim();
@@ -685,9 +797,7 @@ function TaskDrawer({
           }
         ),
         context: {
-          formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-          resourceKind: "staff.timesheets.task",
-          resourceId: taskId,
+          formId: taskDrawerFormId(taskId),
           retryLastMutation
         }
       });
@@ -713,8 +823,62 @@ function TaskDrawer({
     t,
     taskId
   ]);
+  useAppEvent(
+    SUPPORT_ACTIVITY_EVENT,
+    (event) => {
+      const eventTaskId = event.payload?.taskId;
+      if (!open || eventTaskId !== taskId) return;
+      invalidate("task");
+      invalidate("comments");
+      invalidate("attachments");
+    },
+    [invalidate, open, taskId]
+  );
+  useAppEvent(
+    TASK_ASSIGNMENT_CHANGED_EVENT,
+    (event) => {
+      if (!open || !isAssignmentEventForTask(event.payload, taskId)) return;
+      invalidate("task");
+    },
+    [invalidate, open, taskId]
+  );
+  const handleMakeInternal = React.useCallback(
+    async (comment) => {
+      setBusy(true);
+      try {
+        await runMutation({
+          operation: () => withScopedApiRequestHeaders(
+            buildOptimisticLockHeader(comment.updatedAt),
+            () => apiCallOrThrow(
+              `/api/staff/timesheets/tasks/${encodeURIComponent(taskId)}/comments`,
+              {
+                method: "PUT",
+                headers: { "content-type": "application/json" },
+                body: JSON.stringify({ id: comment.id, visibility: "internal" })
+              },
+              { errorMessage: t("staff.time_tracking.taskComments.makeInternalError", "Could not change the reply.") }
+            )
+          ),
+          context: {
+            formId: taskDrawerFormId(taskId),
+            retryLastMutation
+          }
+        });
+        invalidate("comments");
+      } catch (error) {
+        if (surfaceRecordConflict(error, t)) {
+          invalidate("comments");
+          return;
+        }
+        reportError(error, t("staff.time_tracking.taskComments.makeInternalError", "Could not change the reply."));
+      } finally {
+        setBusy(false);
+      }
+    },
+    [invalidate, reportError, retryLastMutation, runMutation, t, taskId]
+  );
   const handlePostComment = React.useCallback(
-    async (body2) => {
+    async (body2, visibility = "internal") => {
       setBusy(true);
       try {
         await runMutation({
@@ -723,14 +887,12 @@ function TaskDrawer({
             {
               method: "POST",
               headers: { "content-type": "application/json" },
-              body: JSON.stringify({ body: body2 })
+              body: JSON.stringify({ body: body2, visibility })
             },
             { errorMessage: t("staff.time_tracking.taskDrawer.comments.error", "Could not post the comment.") }
           ),
           context: {
-            formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-            resourceKind: "staff.timesheets.task_comment",
-            resourceId: taskId,
+            formId: taskDrawerFormId(taskId),
             retryLastMutation
           }
         });
@@ -764,9 +926,7 @@ function TaskDrawer({
             { errorMessage: t("staff.time_tracking.taskDrawer.properties.tagError", "Could not save the tags.") }
           ),
           context: {
-            formId: TASK_DRAWER_MUTATION_CONTEXT_ID,
-            resourceKind: "staff.timesheets.task_tag",
-            resourceId: taskId,
+            formId: taskDrawerFormId(taskId),
             retryLastMutation
           }
         });
@@ -840,6 +1000,9 @@ function TaskDrawer({
       );
     }
     return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+      notice ? /* @__PURE__ */ jsx(Alert, { status: notice.status, "data-testid": "task-drawer-notice", children: /* @__PURE__ */ jsx(AlertDescription, { children: notice.message }) }) : null,
+      support ? /* @__PURE__ */ jsx(SupportRequestPanel, { ticket: support }) : null,
+      support ? /* @__PURE__ */ jsx(SupportAttachmentsSection, { taskId }) : null,
       /* @__PURE__ */ jsx(
         TaskQuickLog,
         {
@@ -1008,7 +1171,9 @@ function TaskDrawer({
           loadError: commentsQuery.isError,
           posting: busy,
           canComment: canManage,
-          onPost: handlePostComment
+          onPost: handlePostComment,
+          mode: support ? "support" : "internal",
+          onMakeInternal: support ? handleMakeInternal : void 0
         }
       ),
       /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-3", "data-testid": "task-drawer-properties", children: [
@@ -1061,7 +1226,31 @@ function TaskDrawer({
                   /* @__PURE__ */ jsx(SelectContent, { children: members.map((member) => /* @__PURE__ */ jsx(SelectItem, { value: member.id, children: member.name }, member.id)) })
                 ]
               }
-            )
+            ),
+            canClaim ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                size: "sm",
+                variant: "outline",
+                disabled: busy,
+                onClick: () => runAssignmentAction("claim"),
+                "data-testid": "task-drawer-claim",
+                children: t("staff.time_tracking.taskDrawer.assignment.claim", "Claim")
+              }
+            ) : null,
+            canRelease ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                size: "sm",
+                variant: "ghost",
+                disabled: busy,
+                onClick: () => runAssignmentAction("release"),
+                "data-testid": "task-drawer-release",
+                children: t("staff.time_tracking.taskDrawer.assignment.release", "Release")
+              }
+            ) : null
           ] })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [