|
1 | 1 | "use client"; |
2 | 2 |
|
3 | | -import { useState, useEffect, useMemo, useRef, useCallback } from "react"; |
| 3 | +import { use, useState, useEffect, useMemo, useRef, useCallback } from "react"; |
4 | 4 | import { |
5 | 5 | Loader2, |
6 | 6 | PanelRight, |
@@ -117,9 +117,15 @@ export default function ProjectSessionDetailPage({ |
117 | 117 | }) { |
118 | 118 | const router = useRouter(); |
119 | 119 | const queryClient = useQueryClient(); |
120 | | - const [projectName, setProjectName] = useState<string>(""); |
121 | | - const [sessionName, setSessionName] = useState<string>(""); |
122 | | - const [backHref, setBackHref] = useState<string | null>(null); |
| 120 | + const { name: projectName, sessionName } = use(params); |
| 121 | + const backHref = useMemo(() => { |
| 122 | + if (typeof window !== "undefined") { |
| 123 | + try { |
| 124 | + return new URL(window.location.href).searchParams.get("backHref"); |
| 125 | + } catch {} |
| 126 | + } |
| 127 | + return null; |
| 128 | + }, []); |
123 | 129 | const [contextModalOpen, setContextModalOpen] = useState(false); |
124 | 130 | const [uploadModalOpen, setUploadModalOpen] = useState(false); |
125 | 131 | const [repoChanging, setRepoChanging] = useState(false); |
@@ -148,18 +154,6 @@ export default function ProjectSessionDetailPage({ |
148 | 154 | const [customWorkflowDialogOpen, setCustomWorkflowDialogOpen] = |
149 | 155 | useState(false); |
150 | 156 |
|
151 | | - // Extract params |
152 | | - useEffect(() => { |
153 | | - params.then(({ name, sessionName: sName }) => { |
154 | | - setProjectName(name); |
155 | | - setSessionName(sName); |
156 | | - try { |
157 | | - const url = new URL(window.location.href); |
158 | | - setBackHref(url.searchParams.get("backHref")); |
159 | | - } catch {} |
160 | | - }); |
161 | | - }, [params]); |
162 | | - |
163 | 157 | // Session queue hook (localStorage-backed) |
164 | 158 | const sessionQueue = useSessionQueue(projectName, sessionName); |
165 | 159 |
|
@@ -208,8 +202,8 @@ export default function ProjectSessionDetailPage({ |
208 | 202 | // Note: autoConnect is intentionally false to avoid SSR hydration mismatch |
209 | 203 | // Connection is triggered manually in useEffect after client hydration |
210 | 204 | const aguiStream = useAGUIStream({ |
211 | | - projectName: projectName || "", |
212 | | - sessionName: sessionName || "", |
| 205 | + projectName, |
| 206 | + sessionName, |
213 | 207 | autoConnect: false, // Manual connection after hydration |
214 | 208 | onError: (err) => { |
215 | 209 | console.error("AG-UI stream error:", err) |
|
0 commit comments