Merge branch 'khanhTDT/fix-UI' into 'master'

config blacklist whitelist to persist

See merge request !11

src/api/listProduct.ts

@@ -2,9 +2,10 @@ import axios from 'axios'
 import config from '../configs'
 import { store } from '../redux/store'
 
-const token = store.getState().auth.token
-export function getListProducts() {
 
+export function getListProducts() {
+    const token = store.getState().auth.token
+console.log('API:  ', token)
     const body = {
         "drug_barcode": "",
         "drug_name": "",

src/components/ItemCartProduct/index.style.ts

@@ -21,7 +21,7 @@ const styles = StyleSheet.create({
     fontWeight: 'bold'
   },
   textInfo: {
-    fontSize: 16,
+    fontSize: 14,
   }
 });
 

src/redux/actions/auth.ts

 type Data = {
     
 }
-export function loginSuccess(token: string) {
+export function loginSuccess(token: string | null) {
     return {
         type: 'LOGIN_SUCCESS',
         payload: token

src/redux/reducers/auth.ts

@@ -3,36 +3,33 @@ import Types from "../types";
 
 type ActionType = {
   type: string
-  payload: AnyAction
+  payload: string| null
 };
 
-export interface InitStateAuth {
-  username: string
-  password: string
+export type InitStateAuth = {
+  // username: string
+  // password: string
   token: string | null
 }
 
 const initialState : InitStateAuth = {
-  username: "",
-  password: "",
+  // username: "",
+  // password: "",
   token: null
 }
 
-
-function productReducer(state = initialState, action: ActionType) {
+function authReducer(state = initialState, action: ActionType) {
   const payload = action.payload
   switch (action.type) {
     case Types.LOGIN_SUCCESS: 
       return  {
         ...state, 
-        auth: payload,
+        token: payload,
       };
     default:
       return state
       
   }
 }
-
-
 // export default authReducer
-export default productReducer
+export default authReducer

src/redux/reducers/index.ts

@@ -6,6 +6,7 @@ import invoice, { InitStateInvoice } from './invoice'
 import cart from './cart'
 import { Cart } from "../../model/cart";
 import product, { InitStateProduct } from "./product";
+import { authPersistedReducer } from "../store";
 
 export type RootState = {
   auth: InitStateAuth,
@@ -14,6 +15,7 @@ export type RootState = {
   product: InitStateProduct
 }
 
+
 const rootReducer = combineReducers({
   auth,
   invoice,

src/redux/reducers/product.ts

@@ -68,7 +68,7 @@ const initState: InitStateProduct = {
   data: []
 }
 
-function invoiceReducer(state: InitStateProduct = initState, action: AnyAction) {
+function productReducer(state: InitStateProduct = initState, action: AnyAction) {
   const payload = action.payload
   
   switch (action.type) {
@@ -88,4 +88,4 @@ function invoiceReducer(state: InitStateProduct = initState, action: AnyAction)
 
 
 // export default authReducer
-export default invoiceReducer
+export default productReducer
\ No newline at end of file

src/redux/store/index.ts

@@ -5,15 +5,41 @@ import logger from 'redux-logger';
 import createSagaMiddleware from 'redux-saga';
 import rootSaga from '../sagas'
 import { persistStore, persistReducer } from 'redux-persist'
-// import storage from 'redux-persist/lib/storage' // defaults to localStorage
 import AsyncStorage from '@react-native-async-storage/async-storage';
+import authReducer from '../reducers/auth';
+import productReducer from '../reducers/product';
+import cartReducer from '../reducers/cart';
+import invoiceReducer from '../reducers/invoice';
 
 const sagaMiddleware = createSagaMiddleware()
 
 const persistConfig = {
   key: 'root',
-  storage: AsyncStorage
+  storage: AsyncStorage,
+  whitelist: ['auth', 'invoice', 'cart', 'product']
 }
+const authPersistConfig = {
+  key: 'auth',
+  storage: AsyncStorage,
+  whitelist: ['token']
+}
+const productPersistConfig = {
+  key: 'product',
+  storage: AsyncStorage,
+}
+const cartPersistConfig = {
+  key: 'cart',
+  storage: AsyncStorage,
+}
+const invoicePersistConfig = {
+  key: 'invoice',
+  storage: AsyncStorage,
+}
+export const authPersistedReducer = persistReducer(authPersistConfig, authReducer)
+export const productPersistedReducer = persistReducer(productPersistConfig, productReducer)
+export const cartPersistedReducer = persistReducer(cartPersistConfig, cartReducer)
+export const invoicePersistedReducer = persistReducer(invoicePersistConfig, invoiceReducer)
+
 const persistedReducer = persistReducer(persistConfig, rootReducer)
 // const middleware = logger, sagaMiddleware);
 const store = createStore(

src/screens/AuthFlash/index.tsx

@@ -6,10 +6,11 @@ import {
   Image
 } from 'react-native';
 import styles from './index.style';
+import { RootState } from '../../redux/reducers';
 
 const App = () => {
   const navigation = useNavigation()
-  const token = useSelector(state => state.auth.token)
+  const token = useSelector((state:RootState) => state.auth.token)
   console.log('Flat: ', token, '\n')
   if(token == null) navigation.navigate('AuthLogin')
   else navigation.navigate('Main')

src/screens/Home/index.tsx

@@ -27,7 +27,7 @@ const App = () => {
   //------------------------------------------------------
 
   //------------------------------------------------------------------------------------
-  const token = useSelector((state:RootState) => state.auth.token)
+  const token = useSelector((state: RootState) => state.auth.token)
 
   console.log('Home:Ahihi ', token, '\n')
   //------------------------------------------------------------------------------------
@@ -131,7 +131,7 @@ const App = () => {
     )
   }
   const _renderButtonBill = () => {
-    
+
     return (
       <View style={styles.billButtonContainer}>
         <TouchableOpacity style={styles.billButton}

src/screens/HomeCreateBill/index.style.ts

@@ -8,6 +8,7 @@ const styles = StyleSheet.create({
     height: 40,
   },
   container: {
+    height: '80%',
     marginBottom: 60,
   },
   buttonAdd: {

src/screens/HomeCreateBill/index.tsx

@@ -112,12 +112,13 @@ const App = () => {
     );
   };
   //----------------------------------------------------------------------------------------
-  const [amount, setAmount] = useState(35264)
+  const [amount, setAmount] = useState(28598)
   const [amountPaid, setAmountPaid] = useState('0')
   const [amountVat, setAmountVat] = useState('')
   const [discount, setDiscount] = useState(0)
   const [note, setNote] = useState('')
   const [currentPaid, setCurrentPaid] = useState(0)
+  
   const _renderBillDate = () => (
     <View style={styles.billDateContainer}>
       <View style={styles.lineContainer}>
@@ -130,7 +131,7 @@ const App = () => {
       </View>
       <View style={styles.lineContainer}>
         <Text>Tổng tiền</Text>
-        <Text>{`35264 VNĐ`}</Text>
+        <Text>{`${amount} VNĐ`}</Text>
       </View>
       <View style={styles.lineContainer}>
         <Text>VAT</Text>
@@ -235,7 +236,8 @@ const App = () => {
   return (
     <SafeAreaView >
       {_renderHeader()}
-      <ScrollView style={styles.container}>
+      <ScrollView style={styles.container}
+      >
         {_renderButtonAdd()}
         <FlatList
           data={cartProducts}
@@ -248,9 +250,7 @@ const App = () => {
         {_renderNote()}
         <Button onPress={() => submit()} title='SEND'></Button>
       </ScrollView>
-      <TouchableOpacity style={styles.buttonSend} onPress={() => submit()}>
-        <Text>SENDDDDDDDDDDDDDDDDDD</Text>
-      </TouchableOpacity>
+      
     </SafeAreaView>
   );
 };

src/screens/HomeProductCreate/index.style.ts

@@ -9,8 +9,7 @@ const styles = StyleSheet.create({
     color: 'white',
   },
   container: {
-    alignItems: 'center', 
-    justifyContent: 'center'
+
   },
   containerInput: {
     backgroundColor: 'white',

src/screens/HomeProductCreate/index.tsx

@@ -21,6 +21,7 @@ import { Cart, Product } from "../../model/cart";
 import { Data } from '../../model/product';
 import { RootState } from '../../redux/reducers';
 import IconBack from '../../components/IconBack';
+import { RefreshControl } from 'react-native';
 
 const App = () => {
 
@@ -123,18 +124,34 @@ const App = () => {
     return () => { }
   }, [])
 
+
+  const wait = (timeout: number) => {
+    return new Promise(resolve => setTimeout(resolve, timeout));
+  }
+  const [refreshing, setRefreshing] = React.useState(false);
+  const onRefresh = React.useCallback(() => {
+    setRefreshing(true);
+    wait(500).then(() => setRefreshing(false));
+  }, []);
+
   //------------------------------------------------------------
   return (
     <SafeAreaView>
       {_renderHeader()}
-      <View >
+      <ScrollView style={styles.container}
+        refreshControl={
+          <RefreshControl
+            refreshing={refreshing}
+            onRefresh={onRefresh}
+          />
+        }>
         <FlatList
           data={products}
           ItemSeparatorComponent={ItemSeparatorView}
           renderItem={({ item }) => _renderListProduct(item)}
         />
         {/* {_renderButtonSubmit()} */}
-      </View>
+      </ScrollView>
     </SafeAreaView>
   );
 }

src/screens/HomeRepository/index.tsx

@@ -7,7 +7,6 @@ import {
 
 import styles from './index.style';
 import Header from '../../components/Header';
-import IconMedlink from '../../components/IconMedlink';
 import HeaderTitle from '../../components/HeaderTitle';
 import HomeRepositoryItem from '../../components/HomeRepositoryItem'
 import { useNavigation } from '@react-navigation/core';

src/screens/Profile/index.tsx

@@ -35,7 +35,7 @@ const App = () => {
   const dispatch = useDispatch()
   const navigation = useNavigation()
   const logOut = () => {
-    const token = ''
+    const token = null
     dispatch(loginSuccess(token))
     navigation.navigate('AuthLogin')
   }