fix(fe): handle contest problems api error using error boundary (#2243)

fix(fe): add error boundary

apps/frontend/app/(client)/(main)/contest/[contestId]/@tabs/page.tsx

@@ -1,6 +1,7 @@
 import KatexContent from '@/components/KatexContent'
 import { auth } from '@/libs/auth'
 import { fetcherWithAuth } from '@/libs/utils'
+import { ErrorBoundary } from '@suspensive/react'
 import { Suspense } from 'react'
 import {
   GoToFirstProblemButton,
@@ -49,10 +50,11 @@ export default async function ContestTop({ params }: ContestTopProps) {
       {session && state !== 'Finished' && (
         <div className="mt-10 flex justify-center">
           {data.isRegistered ? (
-            // TODO: add error boundary
-            <Suspense fallback={<GoToFirstProblemButtonFallback />}>
-              <GoToFirstProblemButton contestId={Number(contestId)} />
-            </Suspense>
+            <ErrorBoundary fallback={null}>
+              <Suspense fallback={<GoToFirstProblemButtonFallback />}>
+                <GoToFirstProblemButton contestId={Number(contestId)} />
+              </Suspense>
+            </ErrorBoundary>
           ) : (
             <RegisterButton
               id={contestId}

apps/frontend/package.json

@@ -42,6 +42,7 @@
     "@radix-ui/react-toggle": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.3",
     "@sentry/nextjs": "^8.38.0",
+    "@suspensive/react": "^2.18.7",
     "@tailwindcss/typography": "^0.5.15",
     "@tanstack/react-query": "^5.59.20",
     "@tanstack/react-table": "^8.20.5",