All files / web/src/providers app-providers.tsx

77.41% Statements 48/62
100% Branches 1/1
50% Functions 1/2
77.41% Lines 48/62

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80    1x   1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x                   1x 3x 3x 3x 3x                                     3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x   3x  
'use client';
 
import { ErrorBoundary } from '@web/components/error-boundary';
import type { ReactElement, ReactNode } from 'react';
import { AgentsProvider } from './agents';
import { AIProvidersProvider } from './ai-providers';
import { LogsProvider } from './logs';
import { ModelsProvider } from './models';
import { NavigationProvider } from './navigation';
import { ReactQueryProvider } from './query-client';
import { SkillEventsProvider } from './skill-events';
import { SkillOptimizationArmsProvider } from './skill-optimization-arms';
import { SkillOptimizationClustersProvider } from './skill-optimization-clusters';
import { SkillOptimizationEvaluationRunsProvider } from './skill-optimization-evaluation-runs';
import { SkillOptimizationEvaluationsProvider } from './skill-optimization-evaluations';
import { SkillsProvider } from './skills';
import { SSEProvider } from './sse';
import { SystemSettingsProvider } from './system-settings';
 
interface AppProvidersProps {
  children: ReactNode;
}
 
/**
 * Composed providers component to reduce nesting in layout files.
 * Wraps all application-level providers in the correct order.
 */
export function AppProviders({ children }: AppProvidersProps): ReactElement {
  return (
    <ReactQueryProvider>
      <ErrorBoundary
        fallback={(error) => (
          <div className="flex items-center justify-center h-screen">
            <div className="text-center">
              <h1 className="text-2xl font-bold text-destructive mb-2">
                Application Error
              </h1>
              <p className="text-muted-foreground">
                Failed to initialize application providers
              </p>
              <details className="mt-4 text-sm">
                <summary className="cursor-pointer">Error details</summary>
                <pre className="mt-2 p-2 bg-muted rounded text-left">
                  {error.message}
                </pre>
              </details>
            </div>
          </div>
        )}
      >
        <SSEProvider>
          <NavigationProvider>
            <AIProvidersProvider>
              <ModelsProvider>
                <SystemSettingsProvider>
                  <AgentsProvider>
                    <SkillsProvider>
                      <SkillEventsProvider>
                        <SkillOptimizationClustersProvider>
                          <SkillOptimizationArmsProvider>
                            <SkillOptimizationEvaluationRunsProvider>
                              <SkillOptimizationEvaluationsProvider>
                                <LogsProvider>{children}</LogsProvider>
                              </SkillOptimizationEvaluationsProvider>
                            </SkillOptimizationEvaluationRunsProvider>
                          </SkillOptimizationArmsProvider>
                        </SkillOptimizationClustersProvider>
                      </SkillEventsProvider>
                    </SkillsProvider>
                  </AgentsProvider>
                </SystemSettingsProvider>
              </ModelsProvider>
            </AIProvidersProvider>
          </NavigationProvider>
        </SSEProvider>
      </ErrorBoundary>
    </ReactQueryProvider>
  );
}