feat: 优化 URL => Slug 逻辑

frontend/src/components/HeaderBlock.tsx

@@ -5,7 +5,7 @@ import {
   Row,
   TextButton,
 } from "@sscreator/ui";
-import { MdOutlineArrowBack } from "react-icons/md";
+import { MdKeyboardArrowLeft } from "react-icons/md";
 import { useLocation } from "wouter-preact";
 import SearchModal from "./SearchModal";
 import icon from "/favicon-64.png";
@@ -30,7 +30,7 @@ export default function HeaderBlock({ pageName, isMainPage = false }: Props) {
         ) : (
           <TextButton
             colorScheme="secondary"
-            leftIcon={<MdOutlineArrowBack size={22} />}
+            leftIcon={<MdKeyboardArrowLeft size={22} />}
             onClick={() => setLocation("/")}
           />
         )}

frontend/src/pages/ArticleWordcloudGenerator.tsx

@@ -8,24 +8,17 @@ import {
 } from "@sscreator/ui";
 import SSWordcloud from "../components/charts/SSWordcloud";
 import type { GetWordFreqResponse } from "../models/articles";
+import { articleUrlToSlug } from "../utils/jianshuHelper";
 import { sendRequest } from "../utils/sendRequest";
 import { toastWarning } from "../utils/toastHelper";
 
 const articleUrl = signal("");
-const articleSlug = computed(() => {
-  const matchResult = articleUrl.value!.match(
-    "https://www.jianshu.com/p/(\\w{12})",
-  );
-  if (matchResult !== null && matchResult[1] !== undefined) {
-    return matchResult[1];
-  }
-  return undefined;
-});
+const articleSlug = computed(() => articleUrlToSlug(articleUrl.value));
 const isLoading = signal(false);
 const result = signal<GetWordFreqResponse | undefined>(undefined);
 
 function handleGenerate() {
-  if (articleSlug.value === undefined) {
+  if (!articleSlug.value) {
     toastWarning({ message: "请输入有效的文章链接" });
     return;
   }
@@ -57,9 +50,12 @@ export default function ArticleWordcloudGenerator() {
         label="文章链接"
         value={articleUrl}
         onEnter={handleGenerate}
+        errorMessage={
+          articleUrl.value && !articleSlug.value ? "链接无效" : undefined
+        }
       />
       <SolidButton onClick={handleGenerate} loading={isLoading.value} fullWidth>
-        查询
+        生成
       </SolidButton>
 
       {result.value !== undefined && (

frontend/src/pages/LPRecommendChecker.tsx

@@ -8,20 +8,13 @@ import {
   TextInput,
 } from "@sscreator/ui";
 import type { GetLPRecommendCheckResponse } from "../models/articles";
+import { articleUrlToSlug } from "../utils/jianshuHelper";
 import { sendRequest } from "../utils/sendRequest";
 import { getDatetime, parseTime } from "../utils/timeHelper";
 import { toastWarning } from "../utils/toastHelper";
 
 const articleUrl = signal("");
-const articleSlug = computed(() => {
-  const matchResult = articleUrl.value!.match(
-    "https://www.jianshu.com/p/(\\w{12})",
-  );
-  if (matchResult !== null && matchResult[1] !== undefined) {
-    return matchResult[1];
-  }
-  return undefined;
-});
+const articleSlug = computed(() => articleUrlToSlug(articleUrl.value));
 const isLoading = signal(false);
 const result = signal<GetLPRecommendCheckResponse | undefined>(undefined);
 

frontend/src/pages/LotteryRewardRecordViewer.tsx

@@ -19,20 +19,13 @@ import type {
   GetLotteryWinRecordsRequest,
   GetLotteryWinRecordsResponse,
 } from "../models/users";
+import { userUrlToSlug } from "../utils/jianshuHelper";
 import { sendRequest } from "../utils/sendRequest";
 import { getDatetime, parseTime } from "../utils/timeHelper";
 import { toastWarning } from "../utils/toastHelper";
 
 const userUrl = signal("");
-const userSlug = computed(() => {
-  const matchResult = userUrl.value.match(
-    "https://www.jianshu.com/u/(\\w{6,12})",
-  );
-  if (matchResult !== null && matchResult[1] !== undefined) {
-    return matchResult[1];
-  }
-  return undefined;
-});
+const userSlug = computed(() => userUrlToSlug(userUrl.value));
 const rewards = signal<string[] | undefined>(undefined);
 const excludedAwards = signal<string[]>([]);
 const isLoading = signal(false);

frontend/src/pages/OnRankArticleViewer.tsx

@@ -20,20 +20,13 @@ import type {
   GetOnArticleRankRecordsResponse,
   GetOnArticleRankSummaryResponse,
 } from "../models/users";
+import { userUrlToSlug } from "../utils/jianshuHelper";
 import { sendRequest } from "../utils/sendRequest";
 import { getDate, parseTime } from "../utils/timeHelper";
 import { toastWarning } from "../utils/toastHelper";
 
 const userUrlOrName = signal("");
-const userSlug = computed(() => {
-  const matchResult = userUrlOrName.value.match(
-    "https://www.jianshu.com/u/(\\w{6,12})",
-  );
-  if (matchResult !== null && matchResult[1] !== undefined) {
-    return matchResult[1];
-  }
-  return undefined;
-});
+const userSlug = computed(() => userUrlToSlug(userUrlOrName.value));
 const userName = computed(() =>
   userSlug.value === undefined && userUrlOrName.value.length !== 0
     ? userUrlOrName.value.trim()

frontend/src/pages/VIPInfoViewer.tsx

@@ -9,6 +9,7 @@ import {
   TextInput,
 } from "@sscreator/ui";
 import type { GetVIPInfoResponse } from "../models/users";
+import { userUrlToSlug } from "../utils/jianshuHelper";
 import { sendRequest } from "../utils/sendRequest";
 import {
   getDate,
@@ -22,15 +23,7 @@ import VIPBadgePlatinaURL from "/vip_badges/vip_badge_platina.png";
 import VIPBadgeSilverURL from "/vip_badges/vip_badge_silver.png";
 
 const userUrl = signal("");
-const userSlug = computed(() => {
-  const matchResult = userUrl.value.match(
-    "https://www.jianshu.com/u/(\\w{6,12})",
-  );
-  if (matchResult !== null && matchResult[1] !== undefined) {
-    return matchResult[1];
-  }
-  return undefined;
-});
+const userSlug = computed(() => userUrlToSlug(userUrl.value));
 const isLoading = signal(false);
 const result = signal<GetVIPInfoResponse | undefined>(undefined);
 

frontend/src/utils/jianshuHelper.ts

@@ -0,0 +1,15 @@
+export function articleUrlToSlug(articleUrl: string) {
+  const result = articleUrl.match("https://www.jianshu.com/p/(\\w{12})");
+  if (result !== null && result[1] !== undefined) {
+    return result[1];
+  }
+  return null;
+}
+
+export function userUrlToSlug(userUrl: string) {
+  const result = userUrl.match("https://www.jianshu.com/u/(\\w{6,12})");
+  if (result !== null && result[1] !== undefined) {
+    return result[1];
+  }
+  return null;
+}