[GSW-2040] social login wallet

.yarnrc.yml

@@ -3,3 +3,8 @@ compressionLevel: mixed
 enableGlobalCache: false
 
 yarnPath: .yarn/releases/yarn-4.1.0.cjs
+
+packageExtensions:
+  "@gnolang/tm2-js-client@*":
+    dependencies:
+      "@bufbuild/protobuf": "*"

packages/web/.env.example

@@ -34,4 +34,12 @@ NEXT_PUBLIC_UMAMI_SCRIPT_URL=""
 NEXT_PUBLIC_UMAMI_WEBSITE_ID=""
 
 # I18N Config
-I18NEXUS_API_KEY=""
+I18NEXUS_API_KEY=""
+
+# Social Wallet Config
+NEXT_PUBLIC_SOCIAL_WALLET_WEB3AUTH_CLIENT_ID=""
+NEXT_PUBLIC_SOCIAL_WALLET_AUTH_CLIENT_ID=""
+NEXT_PUBLIC_SOCIAL_WALLET_AUTH_DOMAIN=""
+NEXT_PUBLIC_SOCIAL_WALLET_GOOGLE_VERIFIER=""
+NEXT_PUBLIC_SOCIAL_WALLET_TWITTER_VERIFIER=""
+NEXT_PUBLIC_SOCIAL_WALLET_EMAIL_VERIFIER=""

packages/web/package.json

@@ -15,11 +15,14 @@
     "build-storybook": "build-storybook"
   },
   "dependencies": {
+    "@adena-wallet/sdk": "^0.0.6",
+    "@bufbuild/protobuf": "^2.2.3",
     "@emotion/css": "11.10.6",
     "@emotion/react": "11.10.6",
     "@emotion/styled": "11.10.6",
     "@floating-ui/react": "0.21.1",
-    "@gnolang/gno-js-client": "1.3.0",
+    "@gnolang/gno-js-client": "1.3.2",
+    "@gnolang/tm2-js-client": "1.2.4",
     "@hookform/resolvers": "3.3.2",
     "@tanstack/react-query": "4.26.1",
     "axios": "1.3.4",

packages/web/pages/_app.tsx

@@ -23,6 +23,7 @@ import GnoswapModalProvider from "@providers/gnoswap-modal-provider/GnoswapModal
 import GnoswapServiceProvider from "@providers/gnoswap-service-provider/GnoswapServiceProvider";
 import GnoswapThemeProvider from "@providers/gnoswap-theme-provider/GnoswapThemeProvider";
 import SnackbarProvider from "@providers/snackbar-provider/SnackbarProvider";
+import SocialWalletProvider from "@providers/social-wallet-provider";
 
 import nextI18nextConfig from "next-i18next.config";
 import Custom500 from "./500";
@@ -60,20 +61,22 @@ function App({ Component, pageProps }: AppProps) {
       <Hydrate state={pageProps.dehydratedState}>
         <JotaiProvider>
           <GnoswapServiceProvider>
-            <GnoswapThemeProvider>
-              <BackgroundContainer>
-                <SnackbarProvider>
-                  <ScrollTopWrapper>
-                    <ErrorBoundary fallback={<Custom500 />}>
-                      <Component {...pageProps} />
-                    </ErrorBoundary>
-                  </ScrollTopWrapper>
-                  <GnoswapModalProvider selector={"portal-root"}>
-                    <ModalContainer />
-                  </GnoswapModalProvider>
-                </SnackbarProvider>
-              </BackgroundContainer>
-            </GnoswapThemeProvider>
+            <SocialWalletProvider>
+              <GnoswapThemeProvider>
+                <BackgroundContainer>
+                  <SnackbarProvider>
+                    <ScrollTopWrapper>
+                      <ErrorBoundary fallback={<Custom500 />}>
+                        <Component {...pageProps} />
+                      </ErrorBoundary>
+                    </ScrollTopWrapper>
+                    <GnoswapModalProvider selector={"portal-root"}>
+                      <ModalContainer />
+                    </GnoswapModalProvider>
+                  </SnackbarProvider>
+                </BackgroundContainer>
+              </GnoswapThemeProvider>
+            </SocialWalletProvider>
           </GnoswapServiceProvider>
         </JotaiProvider>
       </Hydrate>

packages/web/src/common/clients/wallet-client/adena/adena-client.ts

@@ -1,5 +1,6 @@
 import { createTimeout } from "@common/utils/client-util";
 import { DEFAULT_GAS_WANTED } from "@common/values";
+import { WalletType } from "src/types/wallet.types";
 import {
   AccountInfo,
   SendTransactionRequestParam,
@@ -40,6 +41,10 @@ export class AdenaClient implements WalletClient {
     return this.adena !== null;
   };
 
+  public getWalletType(): WalletType {
+    return "ADENA";
+  }
+
   public async getAddress(): Promise<string | null> {
     if (!this.address) {
       return this.getAccount().then(account => account.data?.address || null);
@@ -115,4 +120,9 @@ export class AdenaClient implements WalletClient {
   public addNetwork = (network: AddNetworkRequestParam): Promise<WalletResponse<AddNetworkResponse>> => {
     return createTimeout(this.getAdena().AddNetwork(network));
   };
+
+  public async disconnect(): Promise<void> {
+    this.adena = null;
+    this.address = null;
+  }
 }

packages/web/src/common/clients/wallet-client/protocols/wallet-account.ts

@@ -15,4 +15,18 @@ export interface AccountInfo {
   accountNumber: number;
   sequence: number;
   chainId: string;
+  email?: string;
 }
+
+export const DEFAULT_ACCOUNT_INFO: AccountInfo = {
+  address: "",
+  coins: "0ugnot",
+  chainId: "",
+  status: "IN_ACTIVE",
+  publicKey: {
+    "@type": "",
+    value: "",
+  },
+  accountNumber: 0,
+  sequence: 0,
+};

packages/web/src/common/clients/wallet-client/social/config.ts

@@ -0,0 +1,56 @@
+import { SocialEmailPasswordlessConfigure, SocialGoogleConfigure, SocialTwitterConfigure } from "@adena-wallet/sdk";
+
+import {
+  DEFAULT_CHAIN_ID,
+  DEFAULT_CHAIN_RPC_URL,
+  SOCIAL_WALLET_AUTH_CLIENT_ID,
+  SOCIAL_WALLET_AUTH_DOMAIN,
+  SOCIAL_WALLET_EMAIL_VERIFIER,
+  SOCIAL_WALLET_GOOGLE_CLIENT_ID,
+  SOCIAL_WALLET_GOOGLE_VERIFIER,
+  SOCIAL_WALLET_TWITTER_VERIFIER,
+  SOCIAL_WALLET_WEB3AUTH_CLIENT_ID,
+} from "@constants/environment.constant";
+import { SocialLoginType } from "src/types/wallet.types";
+
+const baseConfig = {
+  chainId: DEFAULT_CHAIN_ID,
+  name: "Adena Wallet",
+  rpcTarget: DEFAULT_CHAIN_RPC_URL,
+  network: "testnet" as const,
+  clientId: SOCIAL_WALLET_WEB3AUTH_CLIENT_ID,
+  authClientId: SOCIAL_WALLET_AUTH_CLIENT_ID,
+  addressPrefix: "g",
+};
+
+export const getSocialWalletConfig = (
+  type: SocialLoginType,
+  email?: string,
+): SocialGoogleConfigure | SocialTwitterConfigure | SocialEmailPasswordlessConfigure => {
+  switch (type) {
+    case "google":
+      return {
+        ...baseConfig,
+        storageKey: "session",
+        verifier: SOCIAL_WALLET_GOOGLE_VERIFIER,
+        googleClientId: SOCIAL_WALLET_GOOGLE_CLIENT_ID,
+      };
+    case "email":
+      return {
+        ...baseConfig,
+        email: email?.toLowerCase() || "",
+        storageKey: "session",
+        verifier: SOCIAL_WALLET_EMAIL_VERIFIER,
+        domain: SOCIAL_WALLET_AUTH_DOMAIN,
+      };
+    case "twitter":
+      return {
+        ...baseConfig,
+        storageKey: "session",
+        verifier: SOCIAL_WALLET_TWITTER_VERIFIER,
+        domain: SOCIAL_WALLET_AUTH_DOMAIN,
+      };
+    default:
+      throw new Error("Unsupported social login type");
+  }
+};