Merge pull request #113 from gnolang/refactor/api-from-redux

refactor: consuming the api from redux
gnoverse · Jul 5, 2024 · 2734889 · 2734889
2 parents 88e48fa + 3546d7d
commit 2734889
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 10 deletions.
diff --git a/mobile/app/index.tsx b/mobile/app/index.tsx
@@ -54,8 +54,7 @@ export default function Root() {
         return;
       }
 
-      const bech32 = await gnonative.addressToBech32(keyInfo.address);
-      await dispatch(loggedIn({ keyInfo, bech32 }));
+      await dispatch(loggedIn({ keyInfo }));
       setTimeout(() => route.replace("/home"), 500);
     } catch (error: unknown | Error) {
       setLoading(error?.toString());
@@ -65,8 +64,7 @@ export default function Root() {
 
   const onCloseReenterPassword = async (sucess: boolean) => {
     if (sucess && reenterPassword) {
-      const bech32 = await gnonative.addressToBech32(reenterPassword.address);
-      await dispatch(loggedIn({ keyInfo: reenterPassword, bech32 }));
+      await dispatch(loggedIn({ keyInfo: reenterPassword }));
       setTimeout(() => route.replace("/home"), 500);
     }
     setReenterPassword(undefined);

diff --git a/mobile/app/sign-up.tsx b/mobile/app/sign-up.tsx
@@ -71,8 +71,7 @@ export default function Page() {
       await gnonative.selectAccount(name);
       await gnonative.setPassword(password);
       await onboarding.onboard(newAccount.name, newAccount.address);
-      const bech32 = await gnonative.addressToBech32(newAccount.address);
-      await dispatch(loggedIn({ keyInfo: newAccount, bech32 }));
+      await dispatch(loggedIn({ keyInfo: newAccount }));
       router.push("/home");
     } catch (error) {
       RNAlert.alert("Error", "" + error);

diff --git a/mobile/redux/features/accountSlice.ts b/mobile/redux/features/accountSlice.ts
@@ -1,6 +1,8 @@
-import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
+import { AsyncThunkOptions, createAsyncThunk, createSlice } from "@reduxjs/toolkit";
 import { User } from "@gno/types";
 import { KeyInfo } from "@buf/gnolang_gnonative.bufbuild_es/gnonativetypes_pb";
+import { GnoNativeApi } from "@gnolang/gnonative";
+import { ThunkExtra } from "redux/redux-provider";
 
 export interface CounterState {
   account?: User;
@@ -10,9 +12,16 @@ const initialState: CounterState = {
   account: undefined,
 };
 
-export const loggedIn = createAsyncThunk("user/loggedIn", async (param: { keyInfo: KeyInfo; bech32: string }, _) => {
-  const { keyInfo, bech32 } = param;
+interface LoginParam {
+  keyInfo: KeyInfo;
+}
+
+export const loggedIn = createAsyncThunk<User, LoginParam, ThunkExtra>("user/loggedIn", async (param, config) => {
+  const { keyInfo } = param;
+
+  const gnonative = config.extra.gnonative as GnoNativeApi;
 
+  const bech32 = await gnonative.addressToBech32(keyInfo.address);
   const user: User = { address: bech32, name: keyInfo.name };
 
   return user;

diff --git a/mobile/redux/redux-provider.tsx b/mobile/redux/redux-provider.tsx
@@ -2,12 +2,16 @@ import React from "react";
 import { Provider } from "react-redux";
 import { configureStore } from "@reduxjs/toolkit";
 import { accountSlice, profileSlice, replySlice } from "./features";
-import { useGnoNativeContext } from "@gnolang/gnonative";
+import { GnoNativeApi, useGnoNativeContext } from "@gnolang/gnonative";
 
 interface Props {
   children: React.ReactNode;
 }
 
+export interface ThunkExtra {
+  extra: { gnonative: GnoNativeApi };
+}
+
 const ReduxProvider: React.FC<Props> = ({ children }) => {
   // Exposing GnoNative API to reduxjs/toolkit
   const { gnonative } = useGnoNativeContext();