All files / src/app/footer LocalizationDisplay.tsx

100% Statements 63/63
100% Branches 1/1
100% Functions 1/1
100% Lines 63/63

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 641x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x  
/**
 * @file LocalizationDisplay.tsx
 * @module app/footer/LocalizationDisplay
 *
 * @summary
 * Localization information display component.
 * Shows current language and region settings.
 *
 * @enterprise
 * - Language and region display
 * - i18n support for labels
 * - Compact display format
 * - Full TypeDoc coverage for localization display
 */
 
import { Box, Typography } from '@mui/material';
import { useTranslation } from 'react-i18next';
 
interface LocalizationDisplayProps {
  /** Current language code (e.g., "EN", "DE") */
  currentLanguage: string;
 
  /** Current region code (e.g., "DE") */
  region: string;
}
 
/**
 * Localization display component.
 *
 * Shows current language and region settings.
 * Isolated from other footer sections for independent testing.
 *
 * @param props - Component props
 * @returns JSX element rendering language and region information
 *
 * @example
 * ```tsx
 * <LocalizationDisplay currentLanguage="EN" region="DE" />
 * ```
 */
export default function LocalizationDisplay({
  currentLanguage,
  region,
}: LocalizationDisplayProps) {
  const { t } = useTranslation(['footer']);
 
  return (
    <Box sx={{ minWidth: 0 }}>
      <Typography
        variant="caption"
        sx={{ fontWeight: 600, display: 'block', mb: 0.25 }}
      >
        {t('footer:section.localization', 'Language & Region')}
      </Typography>
      <Typography variant="caption" color="text.secondary" display="block">
        {t('footer:locale.language', 'Language')}: {currentLanguage}
      </Typography>
      <Typography variant="caption" color="text.secondary" display="block">
        {t('footer:locale.region', 'Region')}: {region}
      </Typography>
    </Box>
  );
}