🐛 fix: upgrade viewport for nextjs 14 (#436)

src/app/layout.tsx

@@ -1,3 +1,4 @@
+import { Viewport } from 'next';
 import { cookies } from 'next/headers';
 import { PropsWithChildren } from 'react';
 
@@ -42,3 +43,16 @@ const RootLayout = ({ children }: PropsWithChildren) => {
 export default RootLayout;
 
 export { default as metadata } from './metadata';
+
+export const viewport: Viewport = {
+  initialScale: 1,
+  maximumScale: 1,
+  minimumScale: 1,
+  themeColor: [
+    { color: '#f8f8f8', media: '(prefers-color-scheme: light)' },
+    { color: '#000', media: '(prefers-color-scheme: dark)' },
+  ],
+  userScalable: false,
+  viewportFit: 'cover',
+  width: 'device-width',
+};

src/app/metadata.ts

@@ -40,10 +40,7 @@ const metadata: Metadata = {
     type: 'website',
     url: homepage,
   },
-  themeColor: [
-    { color: '#f8f8f8', media: '(prefers-color-scheme: light)' },
-    { color: '#000', media: '(prefers-color-scheme: dark)' },
-  ],
+
   title: {
     default: title,
     template: '%s · LobeChat',
@@ -57,14 +54,6 @@ const metadata: Metadata = {
     ],
     title,
   },
-  viewport: {
-    initialScale: 1,
-    maximumScale: 1,
-    minimumScale: 1,
-    userScalable: false,
-    viewportFit: 'cover',
-    width: 'device-width',
-  },
 };
 
 export default metadata;