From 3546d7dd9489c630789b722c09c22d2c979aab10 Mon Sep 17 00:00:00 2001
From: Iuri Pereira <689440+iuricmp@users.noreply.github.com>
Date: Fri, 5 Jul 2024 08:02:27 +0100
Subject: [PATCH] refactor: consuming the api from redux

Signed-off-by: Iuri Pereira <689440+iuricmp@users.noreply.github.com>
---
 mobile/app/index.tsx                  |  6 ++----
 mobile/app/sign-up.tsx                |  3 +--
 mobile/redux/features/accountSlice.ts | 15 ++++++++++++---
 mobile/redux/redux-provider.tsx       |  6 +++++-
 4 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/mobile/app/index.tsx b/mobile/app/index.tsx
index 207a7d4f..39f22634 100644
--- 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
index 72ce4f79..00a4ef58 100644
--- 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
index b4c74c8c..bfdf8c22 100644
--- 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
index 9ebdb4f9..0bacac37 100644
--- 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();