website refactor

apps/website/app/error.tsx

@@ -1,10 +1,9 @@
 'use client';
 
-import { ErrorPageContainer } from '@/ui/ErrorPageContainer';
-import { ErrorActionButtons } from '@/ui/ErrorActionButtons';
-import { Text } from '@/ui/Text';
-import { routes } from '@/lib/routing/RouteConfig';
+import { useEffect } from 'react';
 import { useRouter } from 'next/navigation';
+import { routes } from '@/lib/routing/RouteConfig';
+import { ErrorScreen } from '@/components/errors/ErrorScreen';
 
 export default function ErrorPage({
   error,
@@ -14,22 +13,17 @@ export default function ErrorPage({
   reset: () => void;
 }) {
   const router = useRouter();
-  
+
+  useEffect(() => {
+    // Log the error to an error reporting service
+    console.error('Route Error Boundary:', error);
+  }, [error]);
+
   return (
-    <ErrorPageContainer
-      errorCode="Error"
-      description={error?.message || 'An unexpected error occurred.'}
-    >
-      {error?.digest && (
-        <Text size="xs" color="text-gray-500" font="mono">
-          Error ID: {error.digest}
-        </Text>
-      )}
-      <ErrorActionButtons
-        onRetry={reset}
-        onHomeClick={() => router.push(routes.public.home)}
-        showRetry={true}
-      />
-    </ErrorPageContainer>
+    <ErrorScreen
+      error={error}
+      reset={reset}
+      onHome={() => router.push(routes.public.home)}
+    />
   );
-}
+}