From 015f04b76a8cf46fb472a6320f6c31ce00464f10 Mon Sep 17 00:00:00 2001
From: dotX12 <dev@shitposting.team>
Date: Sun, 26 Jan 2025 16:57:46 +0300
Subject: [PATCH] Update ErrorPage to use Suspense for consistent error
 handling.

Read: https://nextjs.org/docs/messages/missing-suspense-with-csr-bailout
---
 authentication/src/app/flow/error/page.tsx | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/authentication/src/app/flow/error/page.tsx b/authentication/src/app/flow/error/page.tsx
index fa87dc4..d218b5a 100644
--- a/authentication/src/app/flow/error/page.tsx
+++ b/authentication/src/app/flow/error/page.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useEffect, useState } from 'react';
+import React, {Suspense, useEffect, useState} from 'react';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import { FlowError } from '@ory/client';
 import { AxiosError } from 'axios';
@@ -9,7 +9,15 @@ import { useRouter, useSearchParams } from 'next/navigation';
 import Link from 'next/link';
 import { Button } from '@/components/ui/button';
 
-export default function Error() {
+export default function ErrorPage() {
+    return (
+        <Suspense>
+            <Error />
+        </Suspense>
+    )
+}
+
+function Error() {
 
     const [error, setError] = useState<FlowError>();
 
@@ -62,10 +70,10 @@ export default function Error() {
                 </CardContent>
             </Card>
             <Button asChild>
-                <Link href="/" className="inline-flex space-x-2" passHref>
+            <Link href="/" className="inline-flex space-x-2" passHref>
                     Go back
                 </Link>
             </Button>
         </>
     );
-}
+}
\ No newline at end of file