diff --git a/src/app/auth/error/page.tsx b/src/app/auth/error/page.tsx
index acbce09..3e4861b 100644
--- a/src/app/auth/error/page.tsx
+++ b/src/app/auth/error/page.tsx
@@ -4,11 +4,18 @@ import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import Link from "next/link"
 import { useSearchParams } from "next/navigation"
+import { Suspense } from "react"
 
-export default function AuthErrorPage() {
+function Search() {
   const searchParams = useSearchParams()
   const errorMessage = searchParams.get('error')
 
+  return (<div className="text-center p-3 bg-background rounded-lg">
+    {errorMessage}
+  </div>)
+}
+
+export default function AuthErrorPage() {
   return (
     <div className="min-h-screen flex items-center justify-center bg-background p-4">
       <Card className="w-full max-w-md bg-red-400 dark:bg-red-600">
@@ -16,9 +23,9 @@ export default function AuthErrorPage() {
           <CardTitle className="text-2xl font-bold">Error</CardTitle>
         </CardHeader>
         <CardContent className="space-y-4">
-          <div className="text-center p-3 bg-background rounded-lg">
-            {errorMessage}
-          </div>
+          <Suspense>
+            <Search />
+          </Suspense>
           <div className="flex flex-row">
             <Button variant="secondary" asChild>
               <Link href="/">Go back to Homepage</Link>