From 6f1b65737708055361a53a56700b961b5a71549e Mon Sep 17 00:00:00 2001
From: hudy9x <95471659+hudy9x@users.noreply.github.com>
Date: Thu, 6 Jun 2024 15:06:22 +0700
Subject: [PATCH] fix: activity and comment display nothing (#200)

---
 .../ui-app/app/_features/Activity/index.tsx   |  7 +---
 .../TaskChecklist/useGetTaskChecklist.ts      |  1 -
 .../app/_features/TaskComments/context.tsx    |  6 ++--
 .../app/_features/TaskComments/index.tsx      |  4 +--
 .../ui-app/app/_features/TaskDetail/index.tsx |  4 +--
 packages/ui-app/app/_hooks/useTaskIdChange.ts | 36 +++++++++++++++++++
 6 files changed, 44 insertions(+), 14 deletions(-)
 create mode 100644 packages/ui-app/app/_hooks/useTaskIdChange.ts

diff --git a/packages/ui-app/app/_features/Activity/index.tsx b/packages/ui-app/app/_features/Activity/index.tsx
index 53e092f4..84d8a5ae 100644
--- a/packages/ui-app/app/_features/Activity/index.tsx
+++ b/packages/ui-app/app/_features/Activity/index.tsx
@@ -1,13 +1,8 @@
 import './style.css'
 import { ActivityContextProvider } from './context'
 import ActivityContainer from './ActivityContainer'
-import { useSearchParams } from 'next/navigation'
 
-export default function Activity() {
-  const sp = useSearchParams()
-  const taskId = sp.get('taskId')
-
-  // if (!taskId) return null
+export default function Activity({ taskId }: { taskId: string }) {
 
   return (
     <ActivityContextProvider>
diff --git a/packages/ui-app/app/_features/TaskChecklist/useGetTaskChecklist.ts b/packages/ui-app/app/_features/TaskChecklist/useGetTaskChecklist.ts
index 1b4fa8f9..c749f76e 100644
--- a/packages/ui-app/app/_features/TaskChecklist/useGetTaskChecklist.ts
+++ b/packages/ui-app/app/_features/TaskChecklist/useGetTaskChecklist.ts
@@ -20,7 +20,6 @@ export default function useGetTaskChecklist(taskId: string) {
         return
       }
 
-      console.log('task checklist return ', data)
       addTaskChecklist(taskId, data)
       setCheclistLoading(false)
 
diff --git a/packages/ui-app/app/_features/TaskComments/context.tsx b/packages/ui-app/app/_features/TaskComments/context.tsx
index 51a042e7..ae04d9f9 100644
--- a/packages/ui-app/app/_features/TaskComments/context.tsx
+++ b/packages/ui-app/app/_features/TaskComments/context.tsx
@@ -43,9 +43,9 @@ const CommentContext = createContext<ICommentContext>({
   setComments: () => console.log(1)
 })
 
-export const CommentContextProvider = ({ children }: PropsWithChildren) => {
-  const sp = useSearchParams()
-  const taskId = sp.get('taskId')
+export const CommentContextProvider = ({ taskId, children }: PropsWithChildren & { taskId: string }) => {
+  // const sp = useSearchParams()
+  // const taskId = sp.get('taskId')
 
   const [comments, setComments] = useState<Comment[]>([] as Comment[])
   const { user } = useUser()
diff --git a/packages/ui-app/app/_features/TaskComments/index.tsx b/packages/ui-app/app/_features/TaskComments/index.tsx
index 77fdd9a4..2ab66233 100644
--- a/packages/ui-app/app/_features/TaskComments/index.tsx
+++ b/packages/ui-app/app/_features/TaskComments/index.tsx
@@ -1,9 +1,9 @@
 import { CommentContextProvider } from './context'
 import TaskCommentContainer from './TaskCommentContainer'
 
-export default function TaskComments() {
+export default function TaskComments({ taskId }: { taskId: string }) {
   return (
-    <CommentContextProvider>
+    <CommentContextProvider taskId={taskId}>
       <TaskCommentContainer />
     </CommentContextProvider>
   )
diff --git a/packages/ui-app/app/_features/TaskDetail/index.tsx b/packages/ui-app/app/_features/TaskDetail/index.tsx
index 1c4c978f..b8c58977 100644
--- a/packages/ui-app/app/_features/TaskDetail/index.tsx
+++ b/packages/ui-app/app/_features/TaskDetail/index.tsx
@@ -320,13 +320,13 @@ export default function TaskDetail({
             </Tab.List>
 
             <Tab.Content value="task-activity">
-              <Activity />
+              <Activity taskId={id} />
             </Tab.Content>
             <Tab.Content value="task-attachment">
               <FileControl />
             </Tab.Content>
             <Tab.Content value="task-comments">
-              <TaskComments />
+              <TaskComments taskId={id} />
             </Tab.Content>
           </Tab>
         </section>
diff --git a/packages/ui-app/app/_hooks/useTaskIdChange.ts b/packages/ui-app/app/_hooks/useTaskIdChange.ts
new file mode 100644
index 00000000..f9ed9479
--- /dev/null
+++ b/packages/ui-app/app/_hooks/useTaskIdChange.ts
@@ -0,0 +1,36 @@
+import { onPushStateRun } from "packages/ui-app/libs/pushState"
+import { useEffect, useState } from "react"
+
+export const useTaskIdChange = () => {
+  const [taskId, setTaskId] = useState('')
+  useEffect(() => {
+    const destroy = onPushStateRun((url: string) => {
+
+      const newUrl = new URL(url)
+      const taskId = newUrl.searchParams.get('taskId')
+      if (taskId) {
+        setTaskId(taskId)
+      }
+      // fn(taskId || '')
+    })
+
+    return () => {
+      destroy()
+    }
+  }, [])
+
+  useEffect(() => {
+    const newUrl = new URL(window.location.toString())
+    const taskId = newUrl.searchParams.get('taskId')
+    if (taskId) {
+      setTaskId(taskId)
+      // fn(taskId)
+    }
+
+  }, [])
+
+  return {
+    taskId
+  }
+
+}