From 7d17e81f4ba29c0345f67814c134ded61ea2c29c Mon Sep 17 00:00:00 2001
From: hailin <hailin@gdzx.xyz>
Date: Fri, 14 Mar 2025 18:17:48 +0800
Subject: [PATCH] .

---
 .../auth/sign-up/[[...sign-up]]/page.tsx      |   4 +-
 .../[locale]/auth/sign-up/email-signup.tsx    |  27 +-
 .../app/[locale]/auth/sign-up/mix-signup.tsx  | 270 ++++++++++++++++++
 apps/blogai/app/[locale]/page.tsx             |  61 +---
 apps/blogai/locales/en/common.json            |   5 +-
 apps/blogai/locales/zh-CN/common.json         |   5 +-
 6 files changed, 291 insertions(+), 81 deletions(-)
 create mode 100644 apps/blogai/app/[locale]/auth/sign-up/mix-signup.tsx

diff --git a/apps/blogai/app/[locale]/auth/sign-up/[[...sign-up]]/page.tsx b/apps/blogai/app/[locale]/auth/sign-up/[[...sign-up]]/page.tsx
index 071e43e..758a99e 100644
--- a/apps/blogai/app/[locale]/auth/sign-up/[[...sign-up]]/page.tsx
+++ b/apps/blogai/app/[locale]/auth/sign-up/[[...sign-up]]/page.tsx
@@ -35,15 +35,15 @@ export default function AuthenticationPage() {
               </Link>
             </p> */}
           </div>
+
           <div className="grid gap-10 mt-4">
             <div className="relative">
 
             </div>
-            <EmailSignUp
+            <MixSignUp
               setError={setError}
               setVerification={setVerify}
 
-
               email={setEmail}
               password={setPassword}
               emailValue={email}
diff --git a/apps/blogai/app/[locale]/auth/sign-up/email-signup.tsx b/apps/blogai/app/[locale]/auth/sign-up/email-signup.tsx
index d54cfa7..7c14844 100644
--- a/apps/blogai/app/[locale]/auth/sign-up/email-signup.tsx
+++ b/apps/blogai/app/[locale]/auth/sign-up/email-signup.tsx
@@ -1,6 +1,5 @@
 "use client";
 
-// import { useSignUp } from "@clerk/nextjs";
 import * as React from "react";
 
 import { Loading } from "@/components/ui/loading";
@@ -14,12 +13,6 @@ import Image from 'next/image';
 import showImage from '@/components/images/show.png';
 import { useTranslation } from "react-i18next";
 
-// type Props = {
-// setError: (e: string | null) => void;
-// setVerification: (b: boolean) => void;
-// };
-
-// export const EmailSignUp: React.FC<Props> = ({ setError, setVerification, emailValue, passwordValue }) => {
 
 export function EmailSignUp(props: {
   setError: (e: string | null) => void;
@@ -30,7 +23,6 @@ export function EmailSignUp(props: {
   emailValue: string;
   passwordValue: string;
 }) {
-  // const { signUp, isLoaded: signUpLoaded, setActive } = useSignUp();
 
   const [isLoading, setIsLoading] = React.useState(false);
   const [showPassword, setShowPassword] = React.useState(false);
@@ -45,9 +37,11 @@ export function EmailSignUp(props: {
     const signUpFromParams = async () => {
       const ticket = new URL(window.location.href).searchParams.get("__clerk_ticket");
       const emailParam = new URL(window.location.href).searchParams.get("email");
+
       if (!ticket && !emailParam) {
         return;
       }
+
       if (ticket) {
         // await signUp
         //   ?.create({
@@ -185,7 +179,6 @@ export function EmailSignUp(props: {
           const email = new FormData(e.currentTarget).get("email");
 
           if (
-
             typeof email !== "string"
             // typeof first !== "string" ||
             // typeof last !== "string"
@@ -200,9 +193,11 @@ export function EmailSignUp(props: {
         }}>
           <div className="grid gap-4 mb-0">
             <div className="flex flex-col items-start gap-2">
+
               <label htmlFor="email" className="text-xs text-black/50">
                 {t("email")}
               </label>
+
               <Input
                 name="email"
                 placeholder={t("auth.email_address")}
@@ -214,6 +209,7 @@ export function EmailSignUp(props: {
                 required
                 className="h-10 text-black duration-500 bg-transparent focus:text-black border-black/20 focus:bg-white focus:border-black rounded hover:bg-white/20 hover:border-black/40 placeholder:black/20 "
               />
+
             </div>
           </div>
 
@@ -225,6 +221,7 @@ export function EmailSignUp(props: {
             {/* {isLoading ? <Loading className="w-4 h-4 animate-spin" /> : "Sign Up with Email"} */}
             {t("next")}
           </button>
+
         </form> : <form className="grid gap-2" onSubmit={async (e) => {
           e.preventDefault();
           const password = new FormData(e.currentTarget).get("password");
@@ -236,11 +233,7 @@ export function EmailSignUp(props: {
             toast.error("two passwords do not match")
             return
           }
-
           await signUpWithCode(props.emailValue, password)
-
-
-
           setGoPassword(false)
         }} >
 
@@ -268,11 +261,11 @@ export function EmailSignUp(props: {
           </div>
 
           <div className="grid gap-4 mb-4">
+
             <label htmlFor="password" className="text-xs text-black/50">
-
-
               {t("confirm_password")}
             </label>
+
             <div className="grid gap-1 relative">
               <Input
                 name="confirmPassword"
@@ -290,6 +283,7 @@ export function EmailSignUp(props: {
                 // toast.success('coming soon')
               }} />
             </div>
+
           </div>
 
           <button
@@ -302,9 +296,6 @@ export function EmailSignUp(props: {
           </button>
         </form>}
 
-
-
-
     </FadeInStagger>
   );
 };
diff --git a/apps/blogai/app/[locale]/auth/sign-up/mix-signup.tsx b/apps/blogai/app/[locale]/auth/sign-up/mix-signup.tsx
new file mode 100644
index 0000000..0dc6a4f
--- /dev/null
+++ b/apps/blogai/app/[locale]/auth/sign-up/mix-signup.tsx
@@ -0,0 +1,270 @@
+"use client";
+
+import * as React from "react";
+
+import { Loading } from "@/components/ui/loading";
+import { FadeInStagger } from "@/components/landing/fade-in";
+import { Input } from "@/components/ui/input";
+import { toast } from "@/components/ui/toaster";
+import { useRouter } from "next/navigation";
+import service from "@/lib/http/service";
+
+import Image from 'next/image';
+import showImage from '@/components/images/show.png';
+import { useTranslation } from "react-i18next";
+
+
+export function MixSignUp(props: {
+  setError: (e: string | null) => void;
+  setVerification: (b: boolean) => void;
+
+  email: (value: string) => void;
+  password: (value: string) => void;
+  emailValue: string;
+  passwordValue: string;
+}) {
+
+  const [isLoading, setIsLoading] = React.useState(false);
+  const [showPassword, setShowPassword] = React.useState(false);
+  const [showPassword2, setShowPassword2] = React.useState(false);
+
+  const [goPassword, setGoPassword] = React.useState(false);
+  const [_transferLoading, setTransferLoading] = React.useState(true);
+
+  const router = useRouter();
+  const { t } = useTranslation();
+  React.useEffect(() => {
+    const signUpFromParams = async () => {
+      const ticket = new URL(window.location.href).searchParams.get("__clerk_ticket");
+      const emailParam = new URL(window.location.href).searchParams.get("email");
+
+      if (!ticket && !emailParam) {
+        return;
+      }
+
+      if (ticket) {
+        // await signUp
+        //   ?.create({
+        //     strategy: "ticket",
+        //     ticket,
+        //   })
+        //   .then((result) => {
+        //     if (result.status === "complete" && result.createdSessionId) {
+        //       setActive({ session: result.createdSessionId }).then(() => {
+        //         router.push("/app/apis");
+        //       });
+        //     }
+        //   })
+        //   .catch((err) => {
+        //     setTransferLoading(false);
+        //     setError((err as Error).message);
+        //     console.error(err);
+        //   });
+      }
+
+      if (emailParam) {
+        // setVerification(true);
+        // await signUp
+        //   ?.create({
+        //     emailAddress: emailParam,
+        //   })
+        //   .then(async () => {
+        //     await signUp.prepareEmailAddressVerification();
+        //     // set verification to true so we can show the code input
+        //     setVerification(true);
+        //     setTransferLoading(false);
+        //   })
+        //   .catch((err) => {
+        //     setTransferLoading(false);
+        //     if (err.errors[0].code === "form_identifier_exists") {
+        //       toast.error("Sorry, it looks like you have an account. Please use sign in");
+        //     } else {
+        //       console.log("Supress error");
+        //     }
+        //   });
+      }
+    };
+    signUpFromParams();
+    setTransferLoading(false);
+  }, []);
+
+  const signUpWithCode = async (email: string, password: string) => {
+
+    console.log("-------------", email)
+
+    if (
+      isLoading ||
+      typeof email !== "string"
+    ) {
+      return null;
+    }
+
+    setIsLoading(true)
+
+    try {
+      await service.post('/api/v1/common/auth-code', {
+        user_name: email,
+        email: email,
+
+      }).then(function (result: any) {
+        setIsLoading(false);
+        console.log("result:", result)
+
+        if (result && result.header.code != 0) {
+
+          toast.error(result.header.message)
+          return
+        }
+
+        props.password(password)
+        toast.success(result.header.message)
+        props.setVerification(true);
+
+        // 自身方法
+        // localStorage.setItem("data", JSON.stringify(result.data));
+        // []方法
+        { {/* localStorage["name"]="bonly"; */ } }
+
+      }).catch((err: any) => {
+        setIsLoading(false);
+        console.log(err);
+        // if (err.errors[0].code === "form_identifier_not_found") {
+        //   props.setAccountNotFound(true);
+        //   props.email(email);
+        // } else {
+        //   props.setError("Sorry, We couldn't sign you in. Please try again later");
+        // }
+      });
+    } catch (error) {
+      setIsLoading(false);
+      console.error(error);
+    }
+  };
+
+  return (
+    <FadeInStagger>
+      {!goPassword ?
+        <form className="grid gap-2" onSubmit={(e) => {
+          e.preventDefault();
+          const regname = new FormData(e.currentTarget).get("regname");
+
+          if (
+            typeof regname !== "string"
+          ) {
+            return null;
+          }
+
+          console.log("------1", regname)
+          props.email(regname)
+
+          setGoPassword(true)
+        }}>
+        <div className="grid gap-4 mb-0">
+          <div className="flex flex-col items-start gap-2">
+
+            <label htmlFor="regname" className="text-xs text-black/50">
+              {t("mixaccount")}
+            </label>
+
+            <Input
+              name="regname"
+              placeholder={t("auth.mixplacehoder")}
+              type="text"
+              defaultValue={props.emailValue}
+              autoCapitalize="none"
+              autoComplete="on"
+              autoCorrect="off"
+              required
+              className="h-10 text-black duration-500 bg-transparent focus:text-black border-black/20 focus:bg-white focus:border-black rounded hover:bg-white/20 hover:border-black/40 placeholder:black/20 "
+            />
+
+          </div>
+        </div>
+
+          <button
+            type="submit"
+            className="flex items-center justify-center h-10 gap-2 px-4 mt-8 text-sm font-semibold text-white duration-200 bg-black border border-black rounded hover:border-black/30 hover:bg-black/80 hover:text-white"
+            disabled={isLoading}
+          >
+            {/* {isLoading ? <Loading className="w-4 h-4 animate-spin" /> : "Sign Up with Email"} */}
+            {t("next")}
+          </button>
+
+        </form> : <form className="grid gap-2" onSubmit={async (e) => {
+          e.preventDefault();
+          const password = new FormData(e.currentTarget).get("password");
+          const confirmPassword = new FormData(e.currentTarget).get("confirmPassword");
+
+          console.log("------1", props.emailValue, password, confirmPassword)
+
+          if (typeof password !== "string" || password != confirmPassword) {
+            toast.error("two passwords do not match")
+            return
+          }
+          await signUpWithCode(props.emailValue, password)
+          setGoPassword(false)
+        }} >
+
+        <div className="grid gap-4 mb-4">
+          <label htmlFor="password" className="text-xs text-black/50">
+            {t("password")}
+          </label>
+          <div className="grid gap-1 relative">
+            <Input
+              name="password"
+              placeholder={t("password")}
+              type={showPassword ? "text" : "password"}
+              // defaultValue={props.passwordValue}
+              autoCapitalize="none"
+              autoComplete="email"
+              autoCorrect="off"
+              required
+              className="h-10 rounded text-black duration-500 bg-transparent focus:text-black border-black/20 focus:bg-white focus:border-black hover:bg-white/20 hover:border-black/40 placeholder:black/20 "
+            />
+            <Image src={showImage} width={16} alt="show" className="absolute right-4 top-3" onClick={() => {
+              setShowPassword(!showPassword)
+              // toast.success('coming soon')
+            }} />
+          </div>
+        </div>
+
+        <div className="grid gap-4 mb-4">
+
+          <label htmlFor="password" className="text-xs text-black/50">
+            {t("confirm_password")}
+          </label>
+
+          <div className="grid gap-1 relative">
+            <Input
+              name="confirmPassword"
+              placeholder={t("confirm_password")}
+              type={showPassword2 ? "text" : "password"}
+              // defaultValue={props.passwordValue}
+              autoCapitalize="none"
+              autoComplete="password"
+              autoCorrect="off"
+              required
+              className="h-10 rounded text-black duration-500 bg-transparent focus:text-black border-black/20 focus:bg-white focus:border-black hover:bg-white/20 hover:border-black/40 placeholder:black/20 "
+            />
+            <Image src={showImage} width={16} alt="show" className="absolute right-4 top-3" onClick={() => {
+              setShowPassword2(!showPassword2)
+              // toast.success('coming soon')
+            }} />
+          </div>
+
+        </div>
+
+        <button
+          type="submit"
+          className="flex items-center justify-center h-10 gap-2 px-4 mt-8 text-sm font-semibold text-white duration-200 bg-black border border-black rounded hover:border-black/30 hover:bg-black/80 hover:text-white"
+          disabled={isLoading}
+        >
+          {/* {isLoading ? <Loading className="w-4 h-4 animate-spin" /> : "Sign Up with Email"} */}
+          {isLoading ? <Loading className="w-4 h-4 animate-spin" /> : "Next"}
+        </button>
+
+        </form>}
+
+    </FadeInStagger>
+  );
+};
diff --git a/apps/blogai/app/[locale]/page.tsx b/apps/blogai/app/[locale]/page.tsx
index e94e188..f48e573 100644
--- a/apps/blogai/app/[locale]/page.tsx
+++ b/apps/blogai/app/[locale]/page.tsx
@@ -131,7 +131,9 @@ export default async function ChatIndexPage({ params: { locale } }: { params: {
       <div className=' '>
         <Article />
       </div>
+
       <Footer />
+      
       {/* </Web3Provider> */}
     </>
 
@@ -140,62 +142,3 @@ export default async function ChatIndexPage({ params: { locale } }: { params: {
 }
 
 
-
-// function ChatIndexPage_bak({ params: { locale } }: { params: { locale: string } }) {
-//   const session = await auth()
-//   const avatarUrl = session?.user?.image
-//   const id = nanoid()
-
-//   return (
-//     <>
-//       {/* <Web3Provider> */}
-//       <Header />
-
-//       <div className=' '>
-//         {/* <Chat
-//           initialMessages={initialMessages}
-//           id={id}
-//           showLanding
-//           avatarUrl={avatarUrl}
-//         /> */}
-//         <div className='pt-[3rem] lg:pt-[5rem] pb-[2rem] lg:pb-[3rem]  w-11/12 sm:w-5/6 md:w-3/4 lg:w-2/3 xl:w-3/5 2xl:w-1/2  mx-auto'>
-//           <FadeIn className=''>
-//             {/* <LogoAI
-//               className='flex text-center m-auto'
-//             /> */}
-//             {/* <div className="space-y-4  py-[4rem]  w-5/6 lg:w-5/6 xl:w-4/5 2xl:w-3/4 m-auto">
-
-//               <ChatModel className='' position='relative lg:w-full' id={id} showLanding avatarUrl={avatarUrl} />
-//               {/* <PromptFormIndex
-//                 id={id}
-//               // onSubmit={value => {
-
-//               //   console.log('--value----', value)
-//               //   // await new Promise(r => setTimeout(r, 300));
-//               //   // await append(
-//               //   //   {
-//               //   //     id,
-//               //   //     content: value,
-//               //   //     role: 'user'
-//               //   //   },
-//               //   //   { functions: functionSchemas }
-//               //   // )
-//               // }}
-//               // input={input}
-//               // setInput={setInput}
-//               // isLoading={isLoading}
-//               /> }
-//             </div> */}
-//           </FadeIn>
-//         </div>
-
-//         <Article />
-//       </div>
-
-//       <Footer />
-//       {/* </Web3Provider> */}
-//     </>
-
-
-//   )
-// }
diff --git a/apps/blogai/locales/en/common.json b/apps/blogai/locales/en/common.json
index d51e16a..1e2a7b5 100644
--- a/apps/blogai/locales/en/common.json
+++ b/apps/blogai/locales/en/common.json
@@ -5,6 +5,8 @@
   "login": "Login",
   "username_placeholder": "John Doe",
   "email": "Email",
+  "regname": "User Name",
+  "mixaccount": "Phone/Email",
   "first_name": "First Name",
   "password": "Password",
   "confirm_password": "Confirm Password",
@@ -27,6 +29,7 @@
     "verification_code": "Six-digit verification code",
     "send_again": "Send Again",
     "email_address": "Email Address",
+    "mixplacehoder": "Enter your phone number or Email address",
     "creat_account": "Creat Account",
     "frogot_password": "Frogot password?",
     "account_not_found": "Account not found, did you mean to sign up?",
@@ -66,7 +69,7 @@
     "subscribe_success": "Subscription Successful",
     "placeholder_email": "Please provide your e-mail address.",
     "manage_subscriptions": "Manage my subscriptions",
-    "h3": "Let’s connect, Stay up to date with all things JellyAI.",
+    "h3": "Let’s connect, Stay up to date with all things Cradle.",
     "p_ok": "You have successfully subscribed.",
     "p": "By clicking the Subscribe button, you agree to the Privacy Policy."
   }
diff --git a/apps/blogai/locales/zh-CN/common.json b/apps/blogai/locales/zh-CN/common.json
index 13001d3..7d947e5 100644
--- a/apps/blogai/locales/zh-CN/common.json
+++ b/apps/blogai/locales/zh-CN/common.json
@@ -5,6 +5,8 @@
   "login": "登录",
   "username_placeholder": "李华",
   "email": "邮箱",
+  "regname": "用户名",
+  "mixaccount": "手机号/邮箱地址",
   "first_name": "昵称",
   "password": "密码",
   "confirm_password": "确认密码",
@@ -27,6 +29,7 @@
     "verification_code": "六位验证码",
     "send_again": "再次发送",
     "email_address": "电子邮件地址",
+    "mixplacehoder": "输入您的手机号或者邮箱地址",
     "creat_account": "创建帐户",
     "frogot_password": "忘记密码？",
     "account_not_found": "未找到帐户，您想注册吗?",
@@ -66,7 +69,7 @@
     "subscribe_success": "订阅成功",
     "placeholder_email": "请提供您的电子邮件地址",
     "manage_subscriptions": "管理我的订阅",
-    "h3": "让我们联系吧！ 随时了解 JellyAI 的最新动态.",
+    "h3": "让我们联系吧！ 随时了解 AI摇篮 的最新动态.",
     "p_ok": "您已经成功订阅.",
     "p": "单击“订阅”按钮即表示您同意隐私政策。"
   }