Merge pull request #18 from phuongngo0320/api

Setup p9: API calls

package.json

@@ -21,6 +21,7 @@
     "@sentry/react-native": "~5.22.0",
     "expo": "^51.0.8",
     "expo-camera": "~15.0.9",
+    "expo-constants": "~16.0.1",
     "expo-device": "~6.0.2",
     "expo-font": "~12.0.5",
     "expo-image-picker": "~15.0.5",

src/Config/index.ts

@@ -1,3 +1,7 @@
+import * as Constants from 'expo-constants';
+
 export const Config = {
-  API_URL: "https://jsonplaceholder.typicode.com/",
+  API_URL: Constants.default.expoConfig?.hostUri
+  ? 'http://' + Constants.default.expoConfig.hostUri.split(':').shift()?.concat(':3000') + '/'
+  : 'finwise.n3.com',
 };

src/Screens/Test/TestContainer.tsx

@@ -1,11 +1,13 @@
+import { Loading } from "@/Components";
 import { InputAmount } from "@/Components/InputAmount";
 import { SelectCategory } from "@/Components/SelectCategory";
 import { SelectWallet } from "@/Components/SelectWallet";
 import { SelectWalletType } from "@/Components/SelectWalletType";
 import { Category } from "@/Config/category";
 import { WalletType } from "@/Config/wallet";
+import { useAddUserMutation, useGetAllUsersQuery, useGetUserByEmailQuery } from "@/Services";
 import React, { useState } from "react";
-import { View } from "react-native";
+import { ScrollView } from "react-native";
 import { Button, Portal, Text } from "react-native-paper";
 
 export const TestContainer = () => {
@@ -19,8 +21,46 @@ export const TestContainer = () => {
     const [walletTypeVisible, setWalletTypeVisible] = useState(false);
     const [amountVisible, setAmountVisible] = useState(false);
 
+    const {
+        data: users,
+        isLoading,
+        isSuccess,
+        isError,
+        error
+    } = useGetAllUsersQuery();
+
+    // const { data: users, isFetching, isSuccess } = useGetUserByEmailQuery("phuongngovan2003@gmail.com");
+
+    const [addUser] = useAddUserMutation();
+
+    let content;
+
+    if (isLoading) {
+      content = <Loading />;
+    } 
+    else if (isSuccess) {
+      content = users.map(user => <Text key={user.id}>{user.name}</Text>);
+    } 
+    else if (isError) {
+      content = <Text>{error.toString()}</Text>
+    }
+
+    async function onAddUser() {
+        try {
+            await addUser({
+                name: "Phuong",
+                email: "phuong@ngo.van",
+                password: "123"
+            }).unwrap()
+                .then((data) => console.log("fulfilled", data))
+                .catch((error) => console.error("rejected", error));
+        } catch (err) {
+            console.error("Failed: ", err);
+        }
+    }
+
     return (
-        <View>
+        <ScrollView>
             <Text>Hello</Text>
             <Text>Wallet: {walletId}</Text>
             <Text>Category: {category}</Text>
@@ -32,6 +72,10 @@ export const TestContainer = () => {
             <Button mode="contained" onPress={() => setWalletTypeVisible(true)}>Select Wallet Type Here</Button>
             <Button mode="contained" onPress={() => setAmountVisible(true)}>Input Amount Here</Button>
 
+            <Text>API Test:</Text>
+            {content}
+            <Button mode="contained" onPress={onAddUser}>Add user Phuong</Button>
+
             <Portal>
                 <SelectWallet 
                     visible={walletVisible} 
@@ -59,6 +103,6 @@ export const TestContainer = () => {
                     setAmount={setAmount}
                 />
             </Portal>
-        </View>
+        </ScrollView>
     )
 }

src/Services/users/index.ts

@@ -1,19 +1,38 @@
 import { API } from "../base";
 
 export interface User {
-    id: number,
-    username: string,
+    id?: number,
+    // username: string,
     password: string,
+    email: string,
     name: string
 }
 
 const userApi = API.injectEndpoints({
   endpoints: (build) => ({
     getUser: build.query<User, string>({
-      query: (id) => `users/${id}`,
+      query: (id) => `Users/${id}`,
     }),
+    getAllUsers: build.query<User[], void>({
+      query: () => `Users`,
+    }),
+    getUserByEmail: build.query<User[], string>({
+      query: (email) => `Users?email=${email}`
+    }),
+    addUser: build.mutation<User, User>({
+      query: user => ({
+        url: '/Users/new',
+        method: 'POST',
+        body: user
+      })
+    })
   }),
   overrideExisting: true,
 });
 
-export const { useLazyGetUserQuery } = userApi;
+export const { 
+  useLazyGetUserQuery,
+  useGetAllUsersQuery,
+  useGetUserByEmailQuery,
+  useAddUserMutation
+} = userApi;

yarn.lock

@@ -4501,7 +4501,7 @@ expo-camera@~15.0.9:
   dependencies:
     invariant "^2.2.4"
 
-expo-constants@~16.0.0:
+expo-constants@~16.0.0, expo-constants@~16.0.1:
   version "16.0.1"
   resolved "https://registry.yarnpkg.com/expo-constants/-/expo-constants-16.0.1.tgz#1285e29c85513c6e88e118289e2baab72596d3f7"
   integrity sha512-s6aTHtglp926EsugWtxN7KnpSsE9FCEjb7CgEjQQ78Gpu4btj4wB+IXot2tlqNwqv+x7xFe5veoPGfJDGF/kVg==