website refactor

apps/website/app/500/ServerErrorPageClient.test.tsx

@@ -0,0 +1,50 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import { ServerErrorPageClient } from './ServerErrorPageClient';
+import { useRouter } from 'next/navigation';
+
+vi.mock('next/navigation', () => ({
+  useRouter: vi.fn(),
+}));
+
+describe('ServerErrorPageClient', () => {
+  it('renders the server error page with correct content', () => {
+    const push = vi.fn();
+    (useRouter as any).mockReturnValue({ push });
+
+    render(<ServerErrorPageClient />);
+
+    expect(screen.getByText('CRITICAL_SYSTEM_FAILURE')).toBeDefined();
+    expect(screen.getByText(/The application engine encountered an unrecoverable state/)).toBeDefined();
+    expect(screen.getByText(/Internal Server Error/)).toBeDefined();
+  });
+
+  it('handles home navigation', () => {
+    const push = vi.fn();
+    (useRouter as any).mockReturnValue({ push });
+
+    render(<ServerErrorPageClient />);
+
+    const homeButton = screen.getByText('Return to Pits');
+    fireEvent.click(homeButton);
+
+    expect(push).toHaveBeenCalledWith('/');
+  });
+
+  it('handles retry via page reload', () => {
+    const push = vi.fn();
+    (useRouter as any).mockReturnValue({ push });
+    
+    const reloadFn = vi.fn();
+    vi.stubGlobal('location', { reload: reloadFn });
+
+    render(<ServerErrorPageClient />);
+
+    const retryButton = screen.getByText('Retry Session');
+    fireEvent.click(retryButton);
+
+    expect(reloadFn).toHaveBeenCalled();
+    
+    vi.unstubAllGlobals();
+  });
+});

apps/website/app/500/ServerErrorPageClient.tsx

@@ -0,0 +1,40 @@
+'use client';
+
+import React from 'react';
+import { useRouter } from 'next/navigation';
+import { routes } from '@/lib/routing/RouteConfig';
+import { ServerErrorTemplate, type ServerErrorViewData } from '@/templates/ServerErrorTemplate';
+
+/**
+ * ServerErrorPageClient
+ * 
+ * Client-side entry point for the 500 page.
+ * Manages navigation and retry logic and wires it to the template.
+ */
+export function ServerErrorPageClient() {
+  const router = useRouter();
+  
+  const handleHome = () => {
+    router.push(routes.public.home);
+  };
+
+  const handleRetry = () => {
+    window.location.reload();
+  };
+
+  const error = new Error('Internal Server Error') as Error & { digest?: string };
+  error.digest = 'HTTP_500';
+
+  const viewData: ServerErrorViewData = {
+    error,
+    incidentId: error.digest
+  };
+
+  return (
+    <ServerErrorTemplate 
+      viewData={viewData} 
+      onRetry={handleRetry} 
+      onHome={handleHome} 
+    />
+  );
+}

apps/website/app/500/page.tsx

@@ -1,22 +1,11 @@
-'use client';
-
-import { ErrorPageContainer } from '@/ui/ErrorPageContainer';
-import { ErrorActionButtons } from '@/ui/ErrorActionButtons';
-import { routes } from '@/lib/routing/RouteConfig';
-import { useRouter } from 'next/navigation';
+import { ServerErrorPageClient } from './ServerErrorPageClient';
 
+/**
+ * Custom500Page
+ * 
+ * Entry point for the /500 route.
+ * Orchestrates the 500 page rendering.
+ */
 export default function Custom500Page() {
-  const router = useRouter();
-  
-  return (
-    <ErrorPageContainer
-      errorCode="500"
-      description="Something went wrong."
-    >
-      <ErrorActionButtons 
-        onHomeClick={() => router.push(routes.public.home)}
-        homeLabel="Drive home"
-      />
-    </ErrorPageContainer>
-  );
-}
+  return <ServerErrorPageClient />;
+}