更新 重定向页增加loading,使用英文

app/pay-redirect/page.tsx

@@ -1,9 +1,10 @@
 "use client";
 
 import React from "react";
+import { TailwindSpinner } from "@/components/common/GlobalLoad";
 
 export default function PayRedirectPage() {
-    const [status, setStatus] = React.useState<string>("等待安全收银台跳转...");
+    const [status, setStatus] = React.useState<string>("Waiting for secure checkout redirect...");
     const [error, setError] = React.useState<string>("");
 
     React.useEffect(() => {
@@ -12,21 +13,20 @@ export default function PayRedirectPage() {
                 if (event.origin !== window.location.origin) return;
                 const data = event.data || {};
                 if (data?.type === "redirect-to-payment" && typeof data?.url === "string") {
-                    setStatus("即将跳转到 Stripe 收银台...");
+                    setStatus("Redirecting to Stripe Checkout...");
                     window.location.href = data.url as string;
                 } else if (data?.type === "redirect-error") {
-                    setError(typeof data?.message === "string" ? data.message : "创建支付失败，请关闭此页重试");
+                    setError(typeof data?.message === "string" ? data.message : "Failed to create payment. Please close this page and try again.");
                 }
             } catch {
-                setError("处理跳转信息时发生错误，请关闭此页重试");
+                setError("An error occurred while processing redirect info. Please close this page and try again.");
             }
         };
 
         window.addEventListener("message", handleMessage);
-        // 超时兜底：若 15 秒内未收到跳转指令，提示用户
         const timeoutId = window.setTimeout(() => {
             setStatus("");
-            setError("未收到跳转指令，可能网络异常或页面被拦截。请返回重试。");
+            setError("No redirect instruction received. It may be a network issue or the page was blocked. Please go back and try again.");
         }, 15000);
 
         return () => {
@@ -38,11 +38,16 @@ export default function PayRedirectPage() {
     return (
         <div data-alt="pay-redirect-page" className="min-h-screen w-full flex items-center justify-center bg-black text-white">
             <div data-alt="pay-redirect-card" className="max-w-md w-full p-6 rounded-xl border border-white/10 bg-white/5 backdrop-blur">
-                <h1 className="text-lg font-semibold mb-2">正在准备跳转</h1>
+                <h1 className="text-lg font-semibold mb-2">Preparing to redirect</h1>
                 {status && <p className="text-sm text-white/80 mb-2">{status}</p>}
+                {!error && (
+                    <div data-alt="loading-indicator" className="flex items-center justify-center my-3">
+                        <TailwindSpinner diameter={40} />
+                    </div>
+                )}
                 {error && <p className="text-sm text-red-300">{error}</p>}
                 {!error && (
-                    <p className="text-xs text-white/60 mt-2">如长时间未跳转，请返回原页重试或检查网络。</p>
+                    <p className="text-xs text-white/60 mt-2">If it takes too long, please return to the previous page or check your network.</p>
                 )}
             </div>
         </div>

components/layout/top-bar.tsx

@@ -113,7 +113,7 @@ export function TopBar({ collapsed, isDesktop=true }: { collapsed: boolean, isDe
           type: "waiting-payment",
           paymentType: "token"
         }, "*");
-
+        sessionStorage.setItem('session_id', response.data.session_id);
         // 通过 postMessage 通知新页面进行重定向
         redirectWindow.postMessage({
           type: "redirect-to-payment",
@@ -407,7 +407,7 @@ export function TopBar({ collapsed, isDesktop=true }: { collapsed: boolean, isDe
                                   ? "Loading..."
                                   : `${credits} credits`}
                               </span>
-                              <button
+                              {/* <button
                                 type="button"
                                 onClick={() => window.open("/usage", "_blank")}
                                 className="ml-1 inline-flex items-center justify-center h-6 w-6 rounded-full bg-white/10 hover:bg-white/20 transition-colors"
@@ -415,7 +415,7 @@ export function TopBar({ collapsed, isDesktop=true }: { collapsed: boolean, isDe
                                 title="Usage"
                               >
                                 <Info className="h-4 w-4 text-white" />
-                              </button>
+                              </button> */}
                             </div>
                             
                             {/* Purchase Credits 按钮 */}