From 3ff297a55ade9efca359ae92339b4b326439b4d2 Mon Sep 17 00:00:00 2001
From: JOYCEQL <1449239013@qq.com>
Date: Sat, 15 Mar 2025 13:23:24 +0800
Subject: [PATCH] perf: update project link rendering and add fallback for
 empty links

---
 src/components/preview/ProjectSection.tsx | 58 +++++++++++++++--------
 src/lib/getChangelog.ts                   | 18 ++++---
 2 files changed, 48 insertions(+), 28 deletions(-)

diff --git a/src/components/preview/ProjectSection.tsx b/src/components/preview/ProjectSection.tsx
index fe78756..5ae4489 100644
--- a/src/components/preview/ProjectSection.tsx
+++ b/src/components/preview/ProjectSection.tsx
@@ -15,9 +15,6 @@ const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
   ({ project, globalSettings }, ref) => {
     const centerSubtitle = globalSettings?.centerSubtitle;
 
-    // 根据centerSubtitle判断网格布局为几列
-    const gridColumns = centerSubtitle ? 3 : 2;
-
     return (
       <motion.div
         style={{
@@ -25,7 +22,7 @@ const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
         }}
       >
         <motion.div
-          className={`grid grid-cols-${gridColumns} gap-2 items-center justify-items-start [&>*:last-child]:justify-self-end`}
+          className={`grid grid-cols-3 gap-2 items-center justify-items-start [&>*:last-child]:justify-self-end`}
         >
           <div className="flex items-center gap-2">
             <h3
@@ -36,22 +33,38 @@ const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
             >
               {project.name}
             </h3>
-            {project.link && !centerSubtitle && (
-              <a
-                href={
-                  project.link.startsWith("http")
-                    ? project.link
-                    : `https://${project.link}`
-                }
-                target="_blank"
-                rel="noopener noreferrer"
-                className="text-blue-500 hover:underline"
-              >
-                {project.link}
-              </a>
-            )}
           </div>
-          {globalSettings?.centerSubtitle && (
+
+          {project.link && !centerSubtitle && (
+            <a
+              href={
+                project.link.startsWith("http")
+                  ? project.link
+                  : `https://${project.link}`
+              }
+              target="_blank"
+              rel="noopener noreferrer"
+              className="underline"
+              title={project.link}
+            >
+              {(() => {
+                try {
+                  const url = new URL(
+                    project.link.startsWith("http")
+                      ? project.link
+                      : `https://${project.link}`
+                  );
+                  return url.hostname.replace(/^www\./, "");
+                } catch (e) {
+                  return project.link;
+                }
+              })()}
+            </a>
+          )}
+
+          {!project.link && !centerSubtitle && <div></div>}
+
+          {centerSubtitle && (
             <motion.div layout="position" className=" text-subtitleFont">
               {project.role}
             </motion.div>
@@ -72,12 +85,13 @@ const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
             }
             target="_blank"
             rel="noopener noreferrer"
-            className="text-blue-500 hover:underline"
+            className="underline"
+            title={project.link}
           >
             {project.link}
           </a>
         )}
-        {project.description && (
+        {project.description ? (
           <motion.div
             layout="position"
             className="mt-2 text-baseFont"
@@ -87,6 +101,8 @@ const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
             }}
             dangerouslySetInnerHTML={{ __html: project.description }}
           ></motion.div>
+        ) : (
+          <div></div>
         )}
       </motion.div>
     );
diff --git a/src/lib/getChangelog.ts b/src/lib/getChangelog.ts
index 6bebe32..bb2b0f0 100644
--- a/src/lib/getChangelog.ts
+++ b/src/lib/getChangelog.ts
@@ -13,22 +13,26 @@ export function getChangelog(): TimelineEntry[] {
       sections: [
         {
           title: "修复",
-          items: ["修复多余分割线引起的导出PDF 400 错误"],
+          items: ["修复多余分割线引起的导出PDF 400 错误"]
         },
-      ],
+        {
+          title: "优化",
+          items: ["项目链接过长时的样式"]
+        }
+      ]
     },
     {
       date: "2025-03-07",
       sections: [
         {
           title: "新增",
-          items: ["工作台 Dock 栏支持复制简历", "仪表盘简历模板支持预览大图"],
+          items: ["工作台 Dock 栏支持复制简历", "仪表盘简历模板支持预览大图"]
         },
         {
           title: "优化",
-          items: ["服务端导出PDF 速度优化"],
-        },
-      ],
-    },
+          items: ["服务端导出PDF 速度优化"]
+        }
+      ]
+    }
   ];
 }