Files
f6f35630ad feat(#599): Add custom favicon icon in document link (#608)
* add custome favicon in link

* update migration file

* feat: limit accepted file types

* fix: upload meta favicon separately from meta image

* fix: head tag overwrite for favicon

---------

Co-authored-by: Marc Seitz <[email protected]>
2024-10-04 13:59:45 +09:00

82 lines
2.0 KiB
TypeScript

import Head from "next/head";
const CustomMetaTag = ({
enableBranding,
title,
description,
imageUrl,
url,
favicon,
}: {
enableBranding: boolean;
title: string | null;
description: string | null;
imageUrl: string | null;
favicon: string | null;
url: string | null;
}) => {
return (
<Head>
{/* meta URL */}
{url && (
<>
<link rel="canonical" href={url} key="canonical" />
<meta property="og:url" content={url} key="og-url" />
</>
)}
{favicon && (
<>
<link rel="icon" type="image/x-icon" href={favicon} key="favicon" />
{favicon.endsWith(".ico") && (
<link rel="icon" type="image/x-icon" href={favicon} />
)}
{favicon.endsWith(".png") && (
<link rel="icon" type="image/png" href={favicon} sizes="32x32" />
)}
{favicon.endsWith(".svg") && (
<link rel="icon" type="image/svg+xml" href={favicon} />
)}
<link rel="apple-touch-icon" href={favicon} />
</>
)}
{/* meta title */}
{enableBranding && title && (
<>
<title>{title}</title>
<meta property="og:title" content={title} key="og-title" />
<meta name="twitter:title" content={title} key="tw-title" />
</>
)}
{/* meta description */}
{enableBranding && description && (
<>
<meta name="description" content={description} key="description" />
<meta
property="og:description"
content={description}
key="og-description"
/>
<meta
name="twitter:description"
content={description}
key="tw-description"
/>
</>
)}
{/* meta image */}
{enableBranding && imageUrl && (
<>
<meta property="og:image" content={imageUrl} key="og-image" />
<meta name="twitter:image" content={imageUrl} key="tw-image" />
</>
)}
</Head>
);
};
export default CustomMetaTag;