chore: update auth buttons

src/routes/login/MetamaskLoginButton.tsx

@@ -7,12 +7,15 @@ import { StyledSocialButton } from "./styled";
 import Onboarding from "@metamask/onboarding";
 import { LoginCredential } from "../../types/auth";
 import { useTranslation } from "react-i18next";
+import { AuthType } from "../../types/common";
 // import toast from "react-hot-toast";
 
 export default function MetamaskLoginButton({
-  login
+  login,
+  type = "login"
 }: {
   login: (params: LoginCredential) => void;
+  type?: AuthType
 }) {
   const { t } = useTranslation("auth");
   const [requesting, setRequesting] = useState(false);
@@ -93,7 +96,7 @@ export default function MetamaskLoginButton({
   return (
     <StyledSocialButton disabled={requesting} onClick={handleMetamaskLogin}>
       <img className="icon" src={metamaskSvg} alt="meta mask icon" />
-      {t("login.metamask")}
+      {type == "login" ? t("login.metamask") : t("reg.metamask")}
     </StyledSocialButton>
   );
 }

src/routes/login/OidcLoginButton.tsx

@@ -8,6 +8,7 @@ import StyledButton from "../../common/component/styled/Button";
 import OidcLoginEntry from "./OidcLoginEntry";
 import { OIDCConfig } from "../../types/auth";
 import { useTranslation } from "react-i18next";
+import { AuthType } from "../../types/common";
 
 const StyledOidcLoginModal = styled(StyledModal)`
   text-align: center;
@@ -30,8 +31,9 @@ const StyledOidcLoginModal = styled(StyledModal)`
 `;
 interface IProps {
   issuers?: OIDCConfig[];
+  type?: AuthType
 }
-const OidcLoginButton: FC<IProps> = ({ issuers }) => {
+const OidcLoginButton: FC<IProps> = ({ issuers, type = "login" }) => {
   const { t } = useTranslation("auth");
   const [modal, setModal] = useState(false);
   if (!issuers) return null;
@@ -42,7 +44,7 @@ const OidcLoginButton: FC<IProps> = ({ issuers }) => {
           setModal(true);
         }}
       >
-        {t("login.oidc")}
+        {type == "login" ? t("login.oidc") : t("reg.oidc")}
       </StyledSocialButton>
       {modal && (
         <Modal id="modal-modal">

src/routes/login/SocialLoginButtons.tsx

@@ -9,10 +9,13 @@ import MetamaskLoginButton from "./MetamaskLoginButton";
 import OidcLoginButton from "./OidcLoginButton";
 import { useLoginMutation } from '../../app/services/auth';
 import { LoginConfig } from '../../types/server';
+import { AuthType } from '../../types/common';
 
-// type Props = {}
+type Props = {
+    type?: AuthType
+}
 
-const SocialLoginButtons = () => {
+const SocialLoginButtons = ({ type = "login" }: Props) => {
     const [login, { isSuccess }] = useLoginMutation();
     const { config: githubAuthConfig } = useGithubAuthConfig();
     const { data: loginConfig, isSuccess: loginConfigSuccess } = useGetLoginConfigQuery();
@@ -34,12 +37,12 @@ const SocialLoginButtons = () => {
     const googleLogin = enableGoogleLogin && !!clientId;
     return (
         <>
-            {googleLogin && <GoogleLoginButton type="register" clientId={clientId} />}
+            {googleLogin && <GoogleLoginButton type={type} clientId={clientId} />}
             {enableGithubLogin && (
-                <GithubLoginButton type="register" client_id={githubAuthConfig?.client_id} />
+                <GithubLoginButton type={type} client_id={githubAuthConfig?.client_id} />
             )}
-            {enableMetamaskLogin && <MetamaskLoginButton login={login} />}
-            {oidc.length > 0 && <OidcLoginButton issuers={oidc} />}
+            {enableMetamaskLogin && <MetamaskLoginButton type={type} login={login} />}
+            {oidc.length > 0 && <OidcLoginButton type={type} issuers={oidc} />}
         </>
     );
 };

src/routes/reg/Register.tsx

@@ -147,7 +147,7 @@ export default function Reg() {
       </form>
       <hr className="or" />
       <div className="flex flex-col gap-3 py-3">
-        <SocialLoginButtons />
+        <SocialLoginButtons type="register" />
       </div>
       <SignInLink token={magicToken} />
     </>