letsbe/pn-new-crm
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(mobile): set data-form-factor body attr from User-Agent in root layout

Browse Source
This commit is contained in:
Matt Ciaccio
2026-04-29 13:59:03 +02:00
parent 906127a292
commit 9f786fbcf3
3 changed files with 74 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/layout.tsx
View File

@@ -1,6 +1,8 @@
import type { Metadata, Viewport } from 'next';
import { headers } from 'next/headers';
import { Inter, JetBrains_Mono } from 'next/font/google';
import { Toaster } from 'sonner';
import { classifyFormFactor } from '@/lib/form-factor';
import './globals.css';
const inter = Inter({
@@ -42,10 +44,16 @@ export const metadata: Metadata = {
},
};
export default function RootLayout({ children }: { children: React.ReactNode }) {
export default async function RootLayout({ children }: { children: React.ReactNode }) {
const headerList = await headers();
const formFactor = classifyFormFactor(headerList.get('user-agent'));
return (
<html lang="en" suppressHydrationWarning>
<body className={`${inter.variable} ${jetbrainsMono.variable} font-sans antialiased`}>
<body
data-form-factor={formFactor}
className={`${inter.variable} ${jetbrainsMono.variable} font-sans antialiased`}
>
{children}
<Toaster richColors position="top-right" />
</body>