fix: activity and comment display nothing (#200)

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>

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)
 

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()

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>
   )

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>

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
+  }
+
+}