chore: add viewport / favicon metadata (#18177)

* fix favicon name

* add viewport metadata for PageWrapperAppDir

* fix

* fix

* refactor

apps/web/app/maintenance/page.tsx

@@ -6,16 +6,10 @@ import { APP_NAME } from "@calcom/lib/constants";
 import LegacyPage from "~/maintenance/maintenance-view";
 
 export const generateMetadata = async () => {
-  const metadata = await _generateMetadata(
+  return await _generateMetadata(
     (t) => t("under_maintenance"),
     (t) => t("under_maintenance_description", { appName: APP_NAME })
   );
-  return {
-    ...metadata,
-    icons: {
-      icon: "/favicon.ico",
-    },
-  };
 };
 
 export default WithLayout({ getLayout: null, Page: LegacyPage })<"P">;

apps/web/lib/metadata.ts

@@ -20,7 +20,7 @@ export type PageMetadataRecipe = Readonly<{
 
 export const prepareRootMetadata = (recipe: RootMetadataRecipe): Metadata => ({
   icons: {
-    icon: "/favicon.icon",
+    icon: "/favicon.ico",
     apple: "/api/logo?type=apple-touch-icon",
     other: [
       {
@@ -41,7 +41,13 @@ export const prepareRootMetadata = (recipe: RootMetadataRecipe): Metadata => ({
     ],
   },
   manifest: "/site.webmanifest",
-  viewport: "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0",
+  viewport: {
+    width: "device-width",
+    initialScale: 1.0,
+    maximumScale: 1.0,
+    userScalable: false,
+    viewportFit: "cover",
+  },
   robots: recipe.robots,
   other: {
     "application-TileColor": "#ff0000",