From b01890e2cf37812a0c36e33c42c4c69fe606115b Mon Sep 17 00:00:00 2001
From: wood chen <wood@czl.net>
Date: Thu, 20 Feb 2025 02:30:46 +0800
Subject: [PATCH] refactor: Simplify Authorizing component and remove progress
 tracking

- Remove unnecessary progress bar and related state management
- Simplify authorization flow with direct async function in useEffect
- Remove unused useCallback and progress tracking logic
- Streamline loading state rendering
- Update loading message to be more concise
---
 src/components/auth/authorizing.tsx | 69 ++++++++++++-----------------
 1 file changed, 28 insertions(+), 41 deletions(-)

diff --git a/src/components/auth/authorizing.tsx b/src/components/auth/authorizing.tsx
index 4312ee9..071f3af 100644
--- a/src/components/auth/authorizing.tsx
+++ b/src/components/auth/authorizing.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useRouter } from "next/navigation";
 import { getDiscourseSSOUrl } from "@/actions/discourse-sso-url";
 
@@ -13,36 +13,26 @@ interface AuthorizingProps {
 export function Authorizing({ searchParams }: AuthorizingProps) {
   const router = useRouter();
   const [error, setError] = useState<unknown | null>(null);
-  const [progress, setProgress] = useState(0);
-
-  const signInCallback = useCallback(async () => {
-    try {
-      const url = await getDiscourseSSOUrl(
-        new URLSearchParams(searchParams).toString(),
-      );
-      router.push(url);
-    } catch (error) {
-      setError(error);
-    }
-  }, [searchParams, router]);
 
   useEffect(() => {
-    // 启动进度条动画
-    const progressTimer = setInterval(() => {
-      setProgress((prev) => Math.min(prev + 10, 90));
-    }, 500);
-
     // 立即开始授权
-    signInCallback();
-
-    return () => {
-      clearInterval(progressTimer);
+    const doAuth = async () => {
+      try {
+        const url = await getDiscourseSSOUrl(
+          new URLSearchParams(searchParams).toString(),
+        );
+        router.push(url);
+      } catch (error) {
+        setError(error);
+      }
     };
-  }, [signInCallback]);
 
-  return (
-    <div className="w-full max-w-md rounded-lg bg-white p-6 shadow-xl">
-      {error ? (
+    doAuth();
+  }, [searchParams, router]);
+
+  if (error) {
+    return (
+      <div className="w-full max-w-md rounded-lg bg-white p-6 shadow-xl">
         <div className="space-y-4 text-center">
           <div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-red-100">
             <svg
@@ -68,22 +58,19 @@ export function Authorizing({ searchParams }: AuthorizingProps) {
             重试
           </button>
         </div>
-      ) : (
-        <div className="space-y-4 text-center">
-          <div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-blue-100">
-            <div className="h-8 w-8 animate-spin rounded-full border-4 border-blue-600 border-t-transparent"></div>
-          </div>
-          <h3 className="text-xl font-semibold text-gray-900">正在授权</h3>
-          <p className="text-gray-500">获取授权信息中，请稍等...</p>
-          <div className="h-2.5 w-full rounded-full bg-gray-200">
-            <div
-              className="h-2.5 rounded-full bg-blue-600 transition-all duration-300 ease-out"
-              style={{ width: `${progress}%` }}
-            ></div>
-          </div>
-          <p className="text-sm text-gray-400">系统正在处理您的请求</p>
+      </div>
+    );
+  }
+
+  return (
+    <div className="w-full max-w-md rounded-lg bg-white p-6 shadow-xl">
+      <div className="space-y-4 text-center">
+        <div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-blue-100">
+          <div className="h-8 w-8 animate-spin rounded-full border-4 border-blue-600 border-t-transparent"></div>
         </div>
-      )}
+        <h3 className="text-xl font-semibold text-gray-900">正在授权</h3>
+        <p className="text-gray-500">请稍候...</p>
+      </div>
     </div>
   );
 }