From 46e573c5e1a051607e30d9f59b05f6e6fddaf485 Mon Sep 17 00:00:00 2001
From: Chrys <53332481+ChrAlpha@users.noreply.github.com>
Date: Sun, 23 Nov 2025 20:23:03 +0800
Subject: [PATCH] refactor: social media URL handling improvement (#165)

---
 .../gallery/MasonryHeaderMasonryItem.tsx      | 38 +++++++++++++++++--
 1 file changed, 34 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/modules/gallery/MasonryHeaderMasonryItem.tsx b/apps/web/src/modules/gallery/MasonryHeaderMasonryItem.tsx
index 419ed0ac..e7aa0ab8 100644
--- a/apps/web/src/modules/gallery/MasonryHeaderMasonryItem.tsx
+++ b/apps/web/src/modules/gallery/MasonryHeaderMasonryItem.tsx
@@ -8,10 +8,40 @@ import { usePhotos } from '~/hooks/usePhotoViewer'
 
 import { ActionGroup } from './ActionGroup'
 
+function resolveSocialUrl(
+  value: string,
+  { baseUrl, stripAt }: { baseUrl: string; stripAt?: boolean },
+): string | undefined {
+  const trimmed = value.trim()
+
+  if (!trimmed) {
+    return undefined
+  }
+
+  if (/^https?:\/\//i.test(trimmed)) {
+    return trimmed
+  }
+
+  const normalized = stripAt ? trimmed.replace(/^@/, '') : trimmed
+  if (!normalized) {
+    return undefined
+  }
+  return `${baseUrl}${normalized}`
+}
+
 export const MasonryHeaderMasonryItem = ({ style, className }: { style?: React.CSSProperties; className?: string }) => {
   const { t } = useTranslation()
   const { i18n } = useTranslation()
   const visiblePhotoCount = usePhotos().length
+  const githubUrl =
+    siteConfig.social && siteConfig.social.github
+      ? resolveSocialUrl(siteConfig.social.github, { baseUrl: 'https://github.com/' })
+      : undefined
+  const twitterUrl =
+    siteConfig.social && siteConfig.social.twitter
+      ? resolveSocialUrl(siteConfig.social.twitter, { baseUrl: 'https://twitter.com/', stripAt: true })
+      : undefined
+
   return (
     <div
       className={clsxm(
@@ -48,9 +78,9 @@ export const MasonryHeaderMasonryItem = ({ style, className }: { style?: React.C
         {/* Social media links */}
         {siteConfig.social && (
           <div className="mt-1 mb-3 flex items-center justify-center gap-3">
-            {siteConfig.social.github && (
+            {githubUrl && (
               <a
-                href={`https://github.com/${siteConfig.social.github}`}
+                href={githubUrl}
                 target="_blank"
                 rel="noreferrer"
                 className="text-text-secondary flex items-center justify-center p-2 duration-200 hover:text-[#E7E8E8]"
@@ -59,9 +89,9 @@ export const MasonryHeaderMasonryItem = ({ style, className }: { style?: React.C
                 <i className="i-mingcute-github-fill text-sm" />
               </a>
             )}
-            {siteConfig.social.twitter && (
+            {twitterUrl && (
               <a
-                href={`https://twitter.com/${siteConfig.social.twitter.replace('@', '')}`}
+                href={twitterUrl}
                 target="_blank"
                 rel="noreferrer"
                 className="text-text-secondary flex items-center justify-center p-2 duration-200 hover:text-[#1da1f2]"