Files
OpenMAIC/app/layout.tsx
T
Nguyễn Lê TrườngandClaude Opus 5 36d6c14a3d fix(i18n): load every Inter subset so non-Latin text keeps the UI font (#1026)
`app/layout.tsx` pointed next/font at a single subset file,
`inter-latin-wght-normal.woff2`. Only the stylesheets shipped by
@fontsource carry the per-subset `unicode-range` declarations, so nothing
requested the other subsets and every character outside Latin fell back
to an arbitrary OS font — rendering in a different typeface, weight and
metrics from the surrounding text, often mid-word.

This already affects a shipped locale: `ru-RU` is Cyrillic, and
`inter-cyrillic-wght-normal.woff2` was never loaded. `pt-BR` and `es-MX`
lose the accented characters that live in `latin-ext`.

Declaring the remaining subset files as sibling faces of the same family
does not fix it. Faces with identical descriptors and no `unicode-range`
are not tried per glyph — the browser picks one — and next/font/local has
no way to express `unicode-range`. Importing the @fontsource stylesheet
does, so that is what this switches to.

`--font-sans` moves to `globals.css` because the family no longer comes
from next/font's generated class. The typeface is unchanged: still Inter,
now with all seven subsets it already shipped in node_modules.

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-08-03 05:46:15 -04:00

62 lines
2.4 KiB
TypeScript

import type { Metadata } from 'next';
import { GeistSans } from 'geist/font/sans';
import { GeistMono } from 'geist/font/mono';
import './globals.css';
import '@openmaic/renderer/fonts.css';
import 'animate.css';
import 'katex/dist/katex.min.css';
import { ThemeProvider } from '@/lib/hooks/use-theme';
import { I18nProvider } from '@/lib/hooks/use-i18n';
import { Toaster } from '@/components/ui/sonner';
import { ServerProvidersInit } from '@/components/server-providers-init';
import { StorageHealthNotice } from '@/components/storage-health-notice';
import { AccessCodeGuard } from '@/components/access-code-guard';
// The UI font is loaded from @fontsource's stylesheet rather than next/font,
// because only the stylesheet carries the per-subset `unicode-range`
// declarations. Pointing next/font at `inter-latin-wght-normal.woff2` loaded
// exactly one subset, so every character outside Latin — Cyrillic for ru-RU,
// tone-marked letters for vi-VN — fell back to an arbitrary OS font and
// rendered in a different typeface mid-word.
//
// Declaring the other subset files as sibling faces of the same family does not
// fix it either: faces with identical descriptors and no `unicode-range` do not
// fall through per glyph, so the browser simply picks one.
//
// `--font-sans` moves to globals.css since the family no longer comes from
// next/font's generated class.
import '@fontsource-variable/inter';
export const metadata: Metadata = {
title: 'OpenMAIC',
description:
'The open-source AI interactive classroom. Upload a PDF to instantly generate an immersive, multi-agent learning experience.',
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en" suppressHydrationWarning>
<body
className={`${GeistSans.variable} ${GeistMono.variable} antialiased`}
suppressHydrationWarning
>
<ThemeProvider>
<I18nProvider>
<ServerProvidersInit />
<AccessCodeGuard>{children}</AccessCodeGuard>
<Toaster position="top-center" />
{/* After the Toaster: this one raises a toast on mount when
persistence is already broken, and a toast raised before its
host exists has nowhere to go. */}
<StorageHealthNotice />
</I18nProvider>
</ThemeProvider>
</body>
</html>
);
}