fix: social auth and asi rebranding

packages/fetch-extension/src/pages-new/register/auth/index.tsx

@@ -24,7 +24,8 @@ import { Card } from "@components-v2/card";
 
 export const AuthIntro: FunctionComponent<{
   registerConfig: RegisterConfig;
-}> = observer(({ registerConfig }) => {
+  onClick?: () => void;
+}> = observer(({ registerConfig, onClick }) => {
   const { analyticsStore } = useStore();
 
   const [web3auth, setWeb3auth] = useState<Web3Auth | null>(null);
@@ -121,11 +122,13 @@ export const AuthIntro: FunctionComponent<{
               const data = await login();
               const privateKey = await getPrivateKey(data);
               if (!privateKey) return;
-              registerConfig.setType("auth");
               registerConfig.setPrivateKey(privateKey);
               const email = await getUserInfo();
               registerConfig.setEmail(email || "");
               await logout();
+              if (onClick) {
+                onClick();
+              }
             } catch (e) {
             } finally {
               analyticsStore.logEvent("Create/Import account started", {

packages/fetch-extension/src/pages-new/register/index.tsx

@@ -1,4 +1,5 @@
 // Shim ------------
+
 require("setimmediate");
 // Shim ------------
 import React, { FunctionComponent, useEffect } from "react";

packages/fetch-extension/src/pages-new/register/mnemonic/new-mnemonic.tsx

@@ -28,7 +28,7 @@ import {
 import { useStore } from "../../../stores";
 import { ButtonV2 } from "@components-v2/buttons/button";
 import { useNotification } from "@components/notification";
-import { AuthIntro } from "../auth";
+import { AuthIntro, AuthPage } from "../auth";
 import { Card } from "@components-v2/card";
 import keyIcon from "@assets/svg/wireframe/key-icon.png";
 import { TabsPanel } from "@components-v2/tabs/tabsPanel-2";
@@ -106,6 +106,37 @@ export const NewMnemonicPage: FunctionComponent<{
   const [isMainPage, setIsMainPage] = useState(true);
   const { analyticsStore } = useStore();
   const [continueClicked, setContinueClicked] = useState(false);
+  const [authClicked, setAuthClicked] = useState(false);
+
+  function decideView() {
+    if (authClicked) {
+      return <AuthPage registerConfig={registerConfig} />;
+    }
+
+    if (!isMainPage) {
+      if (newMnemonicConfig.mode === "generate") {
+        return (
+          <GenerateMnemonicModePage
+            registerConfig={registerConfig}
+            newMnemonicConfig={newMnemonicConfig}
+            bip44Option={bip44Option}
+            isMainPage={isMainPage}
+            continueClicked={continueClicked}
+            setContinueClicked={setContinueClicked}
+          />
+        );
+      } else if (newMnemonicConfig.mode === "verify") {
+        return (
+          <VerifyMnemonicModePage
+            registerConfig={registerConfig}
+            newMnemonicConfig={newMnemonicConfig}
+            bip44Option={bip44Option}
+            setContinueClicked={setContinueClicked}
+          />
+        );
+      }
+    }
+  }
 
   return (
     <React.Fragment>
@@ -120,7 +151,13 @@ export const NewMnemonicPage: FunctionComponent<{
           {/* <div className={style["newMnemonicText"]}>
             Enter your password to sign in
           </div> */}
-          <AuthIntro registerConfig={registerConfig} />
+          <AuthIntro
+            registerConfig={registerConfig}
+            onClick={() => {
+              setAuthClicked(true);
+              setIsMainPage(false);
+            }}
+          />
           <Card
             leftImageStyle={{ height: "32px", width: "32px" }}
             style={{
@@ -144,24 +181,7 @@ export const NewMnemonicPage: FunctionComponent<{
           <div onClick={() => setIsMainPage(false)} />
         </React.Fragment>
       )}
-      {!isMainPage && newMnemonicConfig.mode === "generate" ? (
-        <GenerateMnemonicModePage
-          registerConfig={registerConfig}
-          newMnemonicConfig={newMnemonicConfig}
-          bip44Option={bip44Option}
-          isMainPage={isMainPage}
-          continueClicked={continueClicked}
-          setContinueClicked={setContinueClicked}
-        />
-      ) : null}
-      {!isMainPage && newMnemonicConfig.mode === "verify" ? (
-        <VerifyMnemonicModePage
-          registerConfig={registerConfig}
-          newMnemonicConfig={newMnemonicConfig}
-          bip44Option={bip44Option}
-          setContinueClicked={setContinueClicked}
-        />
-      ) : null}
+      {decideView()}
     </React.Fragment>
   );
 });