Fix pipeline detail hook order causing React error 310

src/app/(admin)/admin/rounds/pipeline/[id]/page.tsx

@@ -287,6 +287,26 @@ export default function PipelineDetailPage() {
     }
   }, [selectedStageId])
 
+  const trackOptionsForEditors = useMemo(
+    () =>
+      (pipeline?.tracks ?? [])
+        .slice()
+        .sort((a, b) => a.sortOrder - b.sortOrder)
+        .map((track) => ({
+          id: track.id,
+          name: track.name,
+          stages: track.stages
+            .slice()
+            .sort((a, b) => a.sortOrder - b.sortOrder)
+            .map((stage) => ({
+              id: stage.id,
+              name: stage.name,
+              sortOrder: stage.sortOrder,
+            })),
+        })),
+    [pipeline]
+  )
+
   if (isLoading) {
     return (
       <div className="space-y-6">
@@ -328,25 +348,6 @@ export default function PipelineDetailPage() {
     (s) => s.id === selectedStageId
   )
   const mainTrackDraft = structureTracks.find((track) => track.kind === 'MAIN')
-  const trackOptionsForEditors = useMemo(
-    () =>
-      pipeline.tracks
-        .slice()
-        .sort((a, b) => a.sortOrder - b.sortOrder)
-        .map((track) => ({
-          id: track.id,
-          name: track.name,
-          stages: track.stages
-            .slice()
-            .sort((a, b) => a.sortOrder - b.sortOrder)
-            .map((stage) => ({
-              id: stage.id,
-              name: stage.name,
-              sortOrder: stage.sortOrder,
-            })),
-        })),
-    [pipeline.tracks]
-  )
 
   const handleTrackChange = (trackId: string) => {
     setSelectedTrackId(trackId)