'use client';
import { FunctionComponent, PropsWithChildren } from 'react';
import { useTranslations } from 'next-intl';
import { Stack } from '@mui/material';
import { ErrorBoundary, RouteFadeIn } from '@/components';
import AppFrame from './AppFrame';

/**
 * Unauthenticated shell — the frame and nothing else. There is deliberately **no top bar**: the
 * only thing on a login screen is the login card, which carries its own `BrandMark`, and the
 * locale/theme controls that used to sit up here are settings, not front-door decisions (they now
 * live in each actor's settings hub). A second brand glyph in a strip above the card was competing
 * with the card's own.
 * @layout PublicLayout
 */
const PublicLayout: FunctionComponent<PropsWithChildren> = ({ children }) => {
  const tChrome = useTranslations('routeChrome');

  return (
    <AppFrame>
      <Stack sx={{ minHeight: '100%' }}>
        <ErrorBoundary
          name="Public"
          title={tChrome('error_title')}
          body={tChrome('error_body')}
          retryLabel={tChrome('error_retry')}
        >
          <RouteFadeIn fill>{children}</RouteFadeIn>
        </ErrorBoundary>
      </Stack>
    </AppFrame>
  );
};

export default PublicLayout;
