[refactor] Update PageHead component to use Partial type for props; [fix] Adjust SiteUrl and DefaultImage for better configuration handling

wangrunlin · wangrunlin · commit 9832b6ae2244 · 2025-05-22T11:20:24.000+08:00
diff --git a/components/PageHead.tsx b/components/PageHead.tsx
@@ -3,23 +3,20 @@ import type { FC, PropsWithChildren } from 'react';
 
 import { Name, SiteUrl, Summary } from '../models/configuration';
 
-export type PageHeadProps = PropsWithChildren<{
-  title?: string;
-  description?: string;
-  image?: string;
-  type?: string;
-  url?: string;
-}>;
+export type PageHeadProps = PropsWithChildren<
+  Partial<Record<'title' | 'description' | 'ogImage' | 'type' | 'url', string>>
+>;
 
 export const PageHead: FC<PageHeadProps> = ({
   title,
   description = Summary,
-  image = 'https://github.com/idea2app.png',
+  ogImage = 'https://github.com/idea2app.png',
   type = 'website',
   url = SiteUrl,
   children,
 }) => {
   const fullTitle = (title ? `${title} - ` : '') + Name;
+  const fullUrl = url.startsWith('/') ? `${SiteUrl}${url}` : url;
 
   return (
     <Head>
@@ -31,18 +28,18 @@ export const PageHead: FC<PageHeadProps> = ({
       <meta property="og:title" content={fullTitle} />
       <meta property="og:description" content={description} />
       <meta property="og:type" content={type} />
-      <meta property="og:image" content={image} />
-      <meta property="og:url" content={url} />
+      <meta property="og:image" content={ogImage} />
+      <meta property="og:url" content={fullUrl} />
       <meta property="og:site_name" content={Name} />
 
       {/* Twitter */}
       <meta name="twitter:card" content="summary_large_image" />
       <meta name="twitter:title" content={fullTitle} />
       <meta name="twitter:description" content={description} />
-      <meta name="twitter:image" content={image} />
+      <meta name="twitter:image" content={ogImage} />
 
       {/* 规范链接 */}
-      <link rel="canonical" href={url} />
+      <link rel="canonical" href={fullUrl} />
 
       {children}
     </Head>
diff --git a/models/configuration.ts b/models/configuration.ts
@@ -1,7 +1,7 @@
 export const Name = process.env.NEXT_PUBLIC_SITE_NAME,
   Summary = process.env.NEXT_PUBLIC_SITE_SUMMARY,
-  DefaultImage = process.env.NEXT_PUBLIC_LOGO || '/og.png',
-  SiteUrl = 'https://idea2.app';
+  DefaultImage = process.env.NEXT_PUBLIC_LOGO || '/idea2app.svg',
+  SiteUrl = `https://${process.env.VERCEL_URL || 'idea2.app'}`;
 
 export const isServer = () => typeof window === 'undefined';
 
diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -2,7 +2,7 @@ import InitColorSchemeScript from '@mui/material/InitColorSchemeScript';
 import Document, { DocumentContext, Head, Html, Main, NextScript } from 'next/document';
 import Script from 'next/script';
 
-import { DefaultImage, SiteUrl } from '../models/configuration';
+import { DefaultImage, Name, SiteUrl } from '../models/configuration';
 import { LanguageCode, parseSSRContext } from '../models/Translation';
 
 /**
@@ -12,14 +12,14 @@ import { LanguageCode, parseSSRContext } from '../models/Translation';
 const siteNameJsonLd = {
   '@context': 'https://schema.org',
   '@type': 'WebSite',
-  name: 'idea2app',
+  name: Name,
   url: SiteUrl,
 };
 
 const organizationJsonLd = {
   '@context': 'https://schema.org',
   '@type': 'Organization',
-  name: 'idea2app',
+  name: Name,
   url: SiteUrl,
   logo: DefaultImage,
   sameAs: ['https://github.com/idea2app'],
