bug: fix ssr

src/app/admin/matrix-management/detail/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import React, { useEffect, useMemo, useState } from 'react'
+import React, { useEffect, useMemo, useState, Suspense } from 'react' // CHANGED: add Suspense
 import { useSearchParams, useRouter } from 'next/navigation'
 import PageLayout from '../../../components/PageLayout'
 import { ArrowLeftIcon, MagnifyingGlassIcon, PlusIcon, UserIcon, BuildingOffice2Icon } from '@heroicons/react/24/outline'
@@ -12,7 +12,7 @@ import SearchModal from './components/searchModal'
 const DEFAULT_FETCH_DEPTH = 50 // provisional large depth to approximate unlimited
 const LEVEL_CAP = (level: number) => Math.pow(5, level) // L1=5, L2=25, ...
 
-export default function MatrixDetailPage() {
+function MatrixDetailPageInner() {
   const sp = useSearchParams()
   const router = useRouter()
 
@@ -537,4 +537,24 @@ export default function MatrixDetailPage() {
       </div>
     </PageLayout>
   )
+}
+
+// CHANGED: default export wraps inner component in Suspense
+export default function MatrixDetailPage() {
+  return (
+    <Suspense
+      fallback={
+        <PageLayout>
+          <div className="min-h-screen flex items-center justify-center">
+            <div className="text-center">
+              <div className="animate-spin rounded-full h-10 w-10 border-b-2 border-[#8D6B1D] mx-auto mb-3" />
+              <p className="text-[#4A4A4A]">Loading...</p>
+            </div>
+          </div>
+        </PageLayout>
+      }
+    >
+      <MatrixDetailPageInner />
+    </Suspense>
+  )
 }