fix(next): replaces default svg favicons with png

payloadcms · May 13, 2024 · a48043c · a48043c
1 parent 7e4f50a
commit a48043c
Show file tree

Hide file tree

Showing 13 changed files with 53 additions and 52 deletions.
diff --git a/packages/next/src/layouts/Root/index.tsx b/packages/next/src/layouts/Root/index.tsx
@@ -6,6 +6,7 @@ import { initI18n } from '@payloadcms/translations'
 import { RootProvider } from '@payloadcms/ui/providers/Root'
 import '@payloadcms/ui/scss/app.scss'
 import { buildComponentMap } from '@payloadcms/ui/utilities/buildComponentMap'
+import { Merriweather } from 'next/font/google'
 import { headers as getHeaders, cookies as nextCookies } from 'next/headers.js'
 import { parseCookies } from 'payload/auth'
 import { createClientConfig } from 'payload/config'
@@ -17,13 +18,6 @@ import { getRequestLanguage } from '../../utilities/getRequestLanguage.js'
 import { DefaultEditView } from '../../views/Edit/Default/index.js'
 import { DefaultListView } from '../../views/List/Default/index.js'
 
-export const metadata = {
-  description: 'Generated by Next.js',
-  title: 'Next.js',
-}
-
-import { Merriweather } from 'next/font/google'
-
 const merriweather = Merriweather({
   display: 'swap',
   style: ['normal', 'italic'],

diff --git a/packages/next/src/utilities/meta.ts b/packages/next/src/utilities/meta.ts
@@ -1,7 +1,7 @@
 import type { Metadata } from 'next'
 import type { SanitizedConfig } from 'payload/types'
 
-import { payloadFavicon, payloadOgImage } from '@payloadcms/ui/assets'
+import { payloadFaviconDark, payloadFaviconLight, payloadOgImage } from '@payloadcms/ui/assets'
 
 export const meta = async (args: {
   config: SanitizedConfig
@@ -12,17 +12,38 @@ export const meta = async (args: {
   const { config, description = '', keywords = 'CMS, Admin, Dashboard', title } = args
 
   const titleSuffix = config.admin.meta?.titleSuffix ?? '- Payload'
-  const favicon = config?.admin?.meta?.favicon ?? payloadFavicon?.src
+
+  const customFavicon = config.admin.meta?.favicon
+  const customFaviconFiletype = customFavicon?.split('.').pop()
+  const customFaviconMediaType = `image/${customFaviconFiletype}`
+
+  const favicon = customFavicon ?? payloadFaviconLight?.src
   const ogImage = config.admin?.meta?.ogImage ?? payloadOgImage?.src
 
-  return {
+  return Promise.resolve({
     description,
     icons: [
-      {
-        type: 'image/svg',
-        rel: 'icon',
-        url: favicon,
-      },
+      ...(customFavicon
+        ? [
+            {
+              type: customFaviconMediaType,
+              rel: 'icon',
+              url: favicon,
+            },
+          ]
+        : [
+            {
+              type: 'image/png',
+              rel: 'icon',
+              url: payloadFaviconDark?.src,
+            },
+            {
+              type: 'image/png',
+              media: '(prefers-color-scheme: dark)',
+              rel: 'icon',
+              url: payloadFaviconLight?.src,
+            },
+          ]),
     ],
     keywords,
     metadataBase: new URL(
@@ -44,5 +65,5 @@ export const meta = async (args: {
       title: `${title} ${titleSuffix}`,
     },
     title: `${title} ${titleSuffix}`,
-  }
+  })
 }
diff --git a/packages/next/src/views/API/meta.ts b/packages/next/src/views/API/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateEditViewMetadata } from '../Document/getMetaBySegment.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateMetadata: GenerateEditViewMetadata = async ({ config }) => {
-  return meta({
+export const generateMetadata: GenerateEditViewMetadata = async ({ config }) =>
+  meta({
     config,
     description: 'API',
     keywords: 'API',
     title: 'API',
   })
-}
diff --git a/packages/next/src/views/Account/meta.ts b/packages/next/src/views/Account/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateAccountMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) => {
-  return meta({
+export const generateAccountMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: `${t('authentication:accountOfCurrentUser')}`,
     keywords: `${t('authentication:account')}`,
     title: t('authentication:account'),
   })
-}
diff --git a/packages/next/src/views/CreateFirstUser/meta.ts b/packages/next/src/views/CreateFirstUser/meta.ts
@@ -5,11 +5,10 @@ import { meta } from '../../utilities/meta.js'
 export const generateCreateFirstUserMetadata: GenerateViewMetadata = async ({
   config,
   i18n: { t },
-}) => {
-  return meta({
+}) =>
+  meta({
     config,
     description: t('authentication:createFirstUser'),
     keywords: t('general:create'),
     title: t('authentication:createFirstUser'),
   })
-}
diff --git a/packages/next/src/views/Dashboard/meta.ts b/packages/next/src/views/Dashboard/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateDashboardMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) => {
-  return meta({
+export const generateDashboardMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: `${t('general:dashboard')} Payload`,
     keywords: `${t('general:dashboard')}, Payload`,
     title: t('general:dashboard'),
   })
-}
diff --git a/packages/next/src/views/ForgotPassword/meta.ts b/packages/next/src/views/ForgotPassword/meta.ts
@@ -5,11 +5,10 @@ import { meta } from '../../utilities/meta.js'
 export const generateForgotPasswordMetadata: GenerateViewMetadata = async ({
   config,
   i18n: { t },
-}) => {
-  return meta({
+}) =>
+  meta({
     config,
     description: t('authentication:forgotPassword'),
     keywords: t('authentication:forgotPassword'),
     title: t('authentication:forgotPassword'),
   })
-}
diff --git a/packages/next/src/views/Login/meta.ts b/packages/next/src/views/Login/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateLoginMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) => {
-  return meta({
+export const generateLoginMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: `${t('authentication:login')}`,
     keywords: `${t('authentication:login')}`,
     title: t('authentication:login'),
   })
-}
diff --git a/packages/next/src/views/Logout/meta.ts b/packages/next/src/views/Logout/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateLogoutMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) => {
-  return meta({
+export const generateLogoutMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: `${t('authentication:logoutUser')}`,
     keywords: `${t('authentication:logout')}`,
     title: t('authentication:logout'),
   })
-}
diff --git a/packages/next/src/views/NotFound/meta.ts b/packages/next/src/views/NotFound/meta.ts
@@ -10,11 +10,10 @@ export const generateNotFoundMeta = ({
 }: {
   config: SanitizedConfig
   i18n: I18n
-}): Promise<Metadata> => {
-  return meta({
+}): Promise<Metadata> =>
+  meta({
     config,
     description: i18n.t('general:pageNotFound'),
     keywords: `404 ${i18n.t('general:notFound')}`,
     title: i18n.t('general:notFound'),
   })
-}
diff --git a/packages/next/src/views/ResetPassword/meta.ts b/packages/next/src/views/ResetPassword/meta.ts
@@ -7,11 +7,10 @@ import { meta } from '../../utilities/meta.js'
 export const generateResetPasswordMetadata: GenerateViewMetadata = async ({
   config,
   i18n: { t },
-}): Promise<Metadata> => {
-  return meta({
+}): Promise<Metadata> =>
+  meta({
     config,
     description: t('authentication:resetPassword'),
     keywords: t('authentication:resetPassword'),
     title: t('authentication:resetPassword'),
   })
-}
diff --git a/packages/next/src/views/Unauthorized/meta.ts b/packages/next/src/views/Unauthorized/meta.ts
@@ -2,14 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateUnauthorizedMetadata: GenerateViewMetadata = async ({
-  config,
-  i18n: { t },
-}) => {
-  return meta({
+export const generateUnauthorizedMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: t('error:unauthorized'),
     keywords: t('error:unauthorized'),
     title: t('error:unauthorized'),
   })
-}
diff --git a/packages/next/src/views/Verify/meta.ts b/packages/next/src/views/Verify/meta.ts
@@ -2,11 +2,10 @@ import type { GenerateViewMetadata } from '../Root/index.js'
 
 import { meta } from '../../utilities/meta.js'
 
-export const generateVerifyMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) => {
-  return meta({
+export const generateVerifyMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>
+  meta({
     config,
     description: t('authentication:verifyUser'),
     keywords: t('authentication:verify'),
     title: t('authentication:verify'),
   })
-}