- Create NotificationPrompt component that appears 3 seconds after app loads - Add to main layout so it shows on all pages (for logged-in users) - Prompt only shows if permission not yet requested - Users can dismiss temporarily or permanently - Add slide-up animation for smooth appearance - Create simplified SETUP_PUSH_NOTIFICATIONS.md guide Users will now be automatically prompted to enable notifications instead of having to go to the profile page.
86 lines
2.8 KiB
TypeScript
86 lines
2.8 KiB
TypeScript
import type { Metadata, Viewport } from 'next'
|
|
import './globals.css'
|
|
import ServiceWorkerRegistration from '@/components/ServiceWorkerRegistration'
|
|
import OfflineIndicator from '@/components/OfflineIndicator'
|
|
import NotificationPrompt from '@/components/NotificationPrompt'
|
|
import { ToastProvider } from '@/components/ToastContainer'
|
|
import ErrorBoundary from '@/components/ErrorBoundary'
|
|
|
|
export const metadata: Metadata = {
|
|
title: 'Ultimate Lists',
|
|
description: 'The ultimate todo list app with advanced task management',
|
|
manifest: '/manifest.json',
|
|
appleWebApp: {
|
|
capable: true,
|
|
statusBarStyle: 'black-translucent',
|
|
title: 'Ultimate Lists',
|
|
},
|
|
applicationName: 'Ultimate Lists',
|
|
icons: {
|
|
icon: [
|
|
{ url: '/favicon.svg', type: 'image/svg+xml' },
|
|
{ url: '/icon-192.png', sizes: '192x192', type: 'image/png' },
|
|
{ url: '/icon-512.png', sizes: '512x512', type: 'image/png' },
|
|
],
|
|
apple: [
|
|
{ url: '/apple-touch-icon.png', sizes: '180x180', type: 'image/png' },
|
|
],
|
|
},
|
|
other: {
|
|
'mobile-web-app-capable': 'yes',
|
|
'apple-mobile-web-app-capable': 'yes',
|
|
},
|
|
}
|
|
|
|
export const viewport: Viewport = {
|
|
width: 'device-width',
|
|
initialScale: 1,
|
|
maximumScale: 5,
|
|
userScalable: true,
|
|
viewportFit: 'cover',
|
|
themeColor: '#3B82F6',
|
|
}
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode
|
|
}) {
|
|
return (
|
|
<html lang="en">
|
|
<head>
|
|
{/* Favicon */}
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png" />
|
|
|
|
{/* Apple Touch Icons */}
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
|
|
|
{/* Apple Web App Meta Tags */}
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<meta name="apple-mobile-web-app-title" content="Ultimate Lists" />
|
|
|
|
{/* PWA Meta Tags */}
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<meta name="theme-color" content="#3B82F6" />
|
|
<meta name="background-color" content="#ffffff" />
|
|
|
|
{/* iOS Performance Optimizations */}
|
|
<meta name="format-detection" content="telephone=no" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
</head>
|
|
<body className="bg-gray-50 min-h-screen">
|
|
<ErrorBoundary>
|
|
<ToastProvider>
|
|
<ServiceWorkerRegistration />
|
|
<OfflineIndicator />
|
|
<NotificationPrompt />
|
|
{children}
|
|
</ToastProvider>
|
|
</ErrorBoundary>
|
|
</body>
|
|
</html>
|
|
)
|
|
} |