first commit

.buckconfig

@@ -0,0 +1,6 @@
+
+[android]
+  target = Google Inc.:Google APIs:23
+
+[maven_repositories]
+  central = https://repo1.maven.org/maven2

.bundle/config

@@ -0,0 +1,2 @@
+BUNDLE_PATH: "vendor/bundle"
+BUNDLE_FORCE_RUBY_PLATFORM: 1

.eslintrc.js

@@ -0,0 +1,4 @@
+module.exports = {
+  root: true,
+  extends: '@react-native-community',
+};

.flowconfig

@@ -0,0 +1,67 @@
+[ignore]
+; We fork some components by platform
+.*/*[.]android.js
+
+; Ignore "BUCK" generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+; Ignore polyfills
+node_modules/react-native/Libraries/polyfills/.*
+
+; Flow doesn't support platforms
+.*/Libraries/Utilities/LoadingView.js
+
+.*/node_modules/resolve/test/resolver/malformed_package_json/package\.json$
+
+[untyped]
+.*/node_modules/@react-native-community/cli/.*/.*
+
+[include]
+
+[libs]
+node_modules/react-native/interface.js
+node_modules/react-native/flow/
+
+[options]
+emoji=true
+
+exact_by_default=true
+
+format.bracket_spacing=false
+
+module.file_ext=.js
+module.file_ext=.json
+module.file_ext=.ios.js
+
+munge_underscores=true
+
+module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
+module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FlowFixMeProps
+suppress_type=$FlowFixMeState
+
+[lints]
+sketchy-null-number=warn
+sketchy-null-mixed=warn
+sketchy-number=warn
+untyped-type-import=warn
+nonstrict-import=warn
+deprecated-type=warn
+unsafe-getters-setters=warn
+unnecessary-invariant=warn
+signature-verification-failure=warn
+
+[strict]
+deprecated-type
+nonstrict-import
+sketchy-null
+unclear-type
+unsafe-getters-setters
+untyped-import
+untyped-type-import
+
+[version]
+^0.170.0

.gitignore

@@ -0,0 +1,61 @@
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
+# screenshots whenever they are needed.
+# For more information about the recommended setup visit:
+# https://docs.fastlane.tools/best-practices/source-control/
+
+*/fastlane/report.xml
+*/fastlane/Preview.html
+*/fastlane/screenshots
+
+# Bundle artifact
+*.jsbundle
+
+# Ruby / CocoaPods
+/ios/Pods/
+/vendor/bundle/

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
+  bracketSpacing: false,
+  singleQuote: true,
+  trailingComma: 'all',
+};

.ruby-version

@@ -0,0 +1 @@
+2.7.4

.watchmanconfig

@@ -0,0 +1 @@
+{}

App.js

@@ -0,0 +1,103 @@
+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ * @flow strict-local
+ */
+
+ import React, { useEffect } from 'react';
+ import moment from 'moment';
+ import AsyncStorage from '@react-native-community/async-storage';
+ import { StyleSheet, ScrollView, View, Text, StatusBar } from 'react-native';
+ import { SafeAreaProvider } from 'react-native-safe-area-context';
+ import Router from './router';
+ import { configure } from "mobx"
+ import { Provider } from 'mobx-react';
+ import Store from './src/stores/index';
+ import { colors } from './src/assets/styles/colors-theme';
+ import { NavigationContainer, useFocusEffect } from '@react-navigation/native';
+ import { createStackNavigator, HeaderBackButton } from '@react-navigation/stack';
+ import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs';
+ import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+ import {
+   Header,
+   LearnMoreLinks,
+   Colors,
+   DebugInstructions,
+   ReloadInstructions,
+ } from 'react-native/Libraries/NewAppScreen';
+ import Icon from 'react-native-vector-icons/dist/MaterialCommunityIcons';
+ 
+ Icon.loadFont();
+ console.disableYellowBox = true;
+ const Stack = createStackNavigator();
+ const BottomTab = createBottomTabNavigator();
+ 
+ const App: () => React$Node = () => {
+   configure({
+     enforceActions: "never",
+   })
+   return (
+     <>
+       <Provider {...Store}>
+ 
+         <SafeAreaProvider>
+           <StatusBar
+             animated={true}
+             barStyle={'light-content'}
+             backgroundColor={'black'}
+             translucent={true}
+           />
+           <NavigationContainer
+             onStateChange={state => Store.appStore.setRouterState(state)}
+             ref={navigatorRef => Store.appStore.setRouterRef(navigatorRef)}>
+             <Router />
+           </NavigationContainer>
+         </SafeAreaProvider>
+       </Provider>
+     </>
+   );
+ };
+ 
+ const styles = StyleSheet.create({
+   scrollView: {
+     backgroundColor: Colors.lighter,
+   },
+   engine: {
+     position: 'absolute',
+     right: 0,
+   },
+   body: {
+     backgroundColor: colors.bgc,
+   },
+   sectionContainer: {
+     marginTop: 32,
+     paddingHorizontal: 24,
+   },
+   sectionTitle: {
+     fontSize: 24,
+     fontWeight: '600',
+     color: Colors.black,
+   },
+   sectionDescription: {
+     marginTop: 8,
+     fontSize: 18,
+     fontWeight: '400',
+     color: Colors.dark,
+   },
+   highlight: {
+     fontWeight: '700',
+   },
+   footer: {
+     color: Colors.dark,
+     fontSize: 12,
+     fontWeight: '600',
+     padding: 4,
+     paddingRight: 12,
+     textAlign: 'right',
+   },
+ });
+ 
+ export default App;
+ 

Gemfile

@@ -0,0 +1,6 @@
+source 'https://rubygems.org'
+
+# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
+ruby '2.7.4'
+
+gem 'cocoapods', '~> 1.11', '>= 1.11.2'

Gemfile.lock

@@ -0,0 +1,100 @@
+GEM
+  remote: https://rubygems.org/
+  specs:
+    CFPropertyList (3.0.5)
+      rexml
+    activesupport (6.1.5.1)
+      concurrent-ruby (~> 1.0, >= 1.0.2)
+      i18n (>= 1.6, < 2)
+      minitest (>= 5.1)
+      tzinfo (~> 2.0)
+      zeitwerk (~> 2.3)
+    addressable (2.8.0)
+      public_suffix (>= 2.0.2, < 5.0)
+    algoliasearch (1.27.5)
+      httpclient (~> 2.8, >= 2.8.3)
+      json (>= 1.5.1)
+    atomos (0.1.3)
+    claide (1.1.0)
+    cocoapods (1.11.3)
+      addressable (~> 2.8)
+      claide (>= 1.0.2, < 2.0)
+      cocoapods-core (= 1.11.3)
+      cocoapods-deintegrate (>= 1.0.3, < 2.0)
+      cocoapods-downloader (>= 1.4.0, < 2.0)
+      cocoapods-plugins (>= 1.0.0, < 2.0)
+      cocoapods-search (>= 1.0.0, < 2.0)
+      cocoapods-trunk (>= 1.4.0, < 2.0)
+      cocoapods-try (>= 1.1.0, < 2.0)
+      colored2 (~> 3.1)
+      escape (~> 0.0.4)
+      fourflusher (>= 2.3.0, < 3.0)
+      gh_inspector (~> 1.0)
+      molinillo (~> 0.8.0)
+      nap (~> 1.0)
+      ruby-macho (>= 1.0, < 3.0)
+      xcodeproj (>= 1.21.0, < 2.0)
+    cocoapods-core (1.11.3)
+      activesupport (>= 5.0, < 7)
+      addressable (~> 2.8)
+      algoliasearch (~> 1.0)
+      concurrent-ruby (~> 1.1)
+      fuzzy_match (~> 2.0.4)
+      nap (~> 1.0)
+      netrc (~> 0.11)
+      public_suffix (~> 4.0)
+      typhoeus (~> 1.0)
+    cocoapods-deintegrate (1.0.5)
+    cocoapods-downloader (1.6.3)
+    cocoapods-plugins (1.0.0)
+      nap
+    cocoapods-search (1.0.1)
+    cocoapods-trunk (1.6.0)
+      nap (>= 0.8, < 2.0)
+      netrc (~> 0.11)
+    cocoapods-try (1.2.0)
+    colored2 (3.1.2)
+    concurrent-ruby (1.1.10)
+    escape (0.0.4)
+    ethon (0.15.0)
+      ffi (>= 1.15.0)
+    ffi (1.15.5)
+    fourflusher (2.3.1)
+    fuzzy_match (2.0.4)
+    gh_inspector (1.1.3)
+    httpclient (2.8.3)
+    i18n (1.10.0)
+      concurrent-ruby (~> 1.0)
+    json (2.6.1)
+    minitest (5.15.0)
+    molinillo (0.8.0)
+    nanaimo (0.3.0)
+    nap (1.1.0)
+    netrc (0.11.0)
+    public_suffix (4.0.7)
+    rexml (3.2.5)
+    ruby-macho (2.5.1)
+    typhoeus (1.4.0)
+      ethon (>= 0.9.0)
+    tzinfo (2.0.4)
+      concurrent-ruby (~> 1.0)
+    xcodeproj (1.21.0)
+      CFPropertyList (>= 2.3.3, < 4.0)
+      atomos (~> 0.1.3)
+      claide (>= 1.0.2, < 2.0)
+      colored2 (~> 3.1)
+      nanaimo (~> 0.3.0)
+      rexml (~> 3.2.4)
+    zeitwerk (2.5.4)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  cocoapods (~> 1.11, >= 1.11.2)
+
+RUBY VERSION
+   ruby 2.7.4p191
+
+BUNDLED WITH
+   2.2.27

MyTabBar.js

@@ -0,0 +1,145 @@
+import React from 'react';
+import {
+  SafeAreaView,
+  Text,
+  View,
+  TouchableOpacity,
+  Image,
+  TextInput,
+  Keyboard,
+} from 'react-native';
+import { inject, observer } from 'mobx-react';
+import Icon from 'react-native-vector-icons/dist/MaterialCommunityIcons';
+import { observable } from 'mobx';
+import { colors } from './src/assets/styles/colors-theme';
+import { images } from './src/assets/images/index';
+
+Icon.loadFont();
+
+const MyTabBar = inject("appStore")(observer(class MyTabBar extends React.Component {
+  constructor(props) {
+    super(props);
+    this.store = props.appStore;
+  }
+
+
+
+  render() {
+    var { state, descriptors, navigation, logined } = this.props;
+    return (
+      <View style={{ backgroundColor: colors.MAIN }}>
+        <View style={{
+          flexDirection: 'row', backgroundColor: 'black', height: 66,
+          borderTopLeftRadius: 20,
+          borderTopRightRadius: 20,
+        }}>
+          {state.routes.map((route, index) => {
+            const { options } = descriptors[route.key];
+            const label =
+              options.tabBarLabel !== undefined
+                ? options.tabBarLabel
+                : options.title !== undefined
+                  ? options.title
+                  : route.name;
+            let iconName;
+            let focus
+            switch (route.name) {
+              case 'Main':
+                iconName = 'home';
+                focus = 'home';
+                break;
+              case 'Category':
+                iconName = images.ICON_LIST;
+                focus = images.ICON_LIST_FOCUS;
+                break;
+              // case 'Favourite':
+              //   iconName = images.NAV_FAV;
+              //   focus = images.NAV_FAV_FOCUS;
+              //   break;
+              case 'Cart':
+                iconName = images.NAV_CART;
+                focus = images.NAV_CART_FOCUS;
+                break;
+              case 'Setting':
+                iconName = images.NAV_PROFILE;
+                focus = images.NAV_PROFILE_FOCUS;
+                break;
+            }
+
+            const isFocused = state.index === index;
+
+            const onPress = () => {
+              const event = navigation.emit({
+                type: 'tabPress',
+                target: route.key,
+              });
+
+              if (!isFocused && !event.defaultPrevented) {
+                console.log(route.name);
+                if (route.name == 'Setting' && !this.store.logined) {
+                  navigation.navigate('Login');
+                } else {
+                  navigation.navigate(route.name);
+                }
+              }
+            };
+
+            const onLongPress = () => {
+              navigation.emit({
+                type: 'tabLongPress',
+                target: route.key,
+              });
+            };
+
+            return (
+              <TouchableOpacity
+                accessibilityRole="button"
+                accessibilityStates={isFocused ? ['selected'] : []}
+                accessibilityLabel={options.tabBarAccessibilityLabel}
+                testID={options.tabBarTestID}
+                onPress={onPress}
+                onLongPress={onLongPress}
+                style={{
+                  flex: 1,
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  marginTop: 5,
+                  marginBottom: 15,
+                }}>
+                {route.name == 'Main' ? (<Icon name={iconName} color={isFocused ? colors.MAIN : 'white'} size={28} />) : (<Image style={{ width: 25, height: 25, resizeMode: "contain", }} source={isFocused ? focus : iconName} />)}
+
+
+                {label == 'Cart' ? (
+                  <View
+                    style={{
+                      justifyContent: 'center',
+                      alignItems: 'center',
+                      position: 'absolute',
+                      top: 5,
+                      right: 25,
+                    }}>
+                    <Icon name="circle" color={'red'} size={18} />
+                    <Text
+                      style={{
+                        position: 'absolute',
+                        top: 4,
+                        fontWeight: '800',
+                        fontSize: 8,
+                        color: 'white',
+                      }}>
+                      {this.store.shoppingCart.length}
+                    </Text>
+                  </View>
+                ) : (
+                    <View />
+                  )}
+              </TouchableOpacity>
+            );
+          })}
+        </View>
+      </View>
+    );
+  }
+}))
+
+export default MyTabBar

README.md

@@ -0,0 +1,91 @@
+## AnnchoiYeanaan
+
+## Description
+The mobile application is a shopping platform that includes features such as online payment, notifications, coupons, and membership points.
+
+### Screenshot
+<img src="./src/assets/screenshot/1.png" width="40%" height="40%">
+<img src="./src/assets/screenshot/2.png" width="40%" height="40%">
+<img src="./src/assets/screenshot/3.png" width="40%" height="40%">
+<img src="./src/assets/screenshot/4.png" width="40%" height="40%">
+<img src="./src/assets/screenshot/banner.png" >
+
+This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).
+
+# Getting Started
+
+>**Note**: Make sure you have completed the [React Native - Environment Setup](https://reactnative.dev/docs/environment-setup) instructions till "Creating a new application" step, before proceeding.
+
+## Step 1: Start the Metro Server
+
+First, you will need to start **Metro**, the JavaScript _bundler_ that ships _with_ React Native.
+
+To start Metro, run the following command from the _root_ of your React Native project:
+
+```bash
+# using npm
+npm start
+
+# OR using Yarn
+yarn start
+```
+
+## Step 2: Start your Application
+
+Let Metro Bundler run in its _own_ terminal. Open a _new_ terminal from the _root_ of your React Native project. Run the following command to start your _Android_ or _iOS_ app:
+
+### For Android
+
+```bash
+# using npm
+npm run android
+
+# OR using Yarn
+yarn android
+```
+
+### For iOS
+
+```bash
+# using npm
+npm run ios
+
+# OR using Yarn
+yarn ios
+```
+
+If everything is set up _correctly_, you should see your new app running in your _Android Emulator_ or _iOS Simulator_ shortly provided you have set up your emulator/simulator correctly.
+
+This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.
+
+## Step 3: Modifying your App
+
+Now that you have successfully run the app, let's modify it.
+
+1. Open `App.tsx` in your text editor of choice and edit some lines.
+2. For **Android**: Press the <kbd>R</kbd> key twice or select **"Reload"** from the **Developer Menu** (<kbd>Ctrl</kbd> + <kbd>M</kbd> (on Window and Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (on macOS)) to see your changes!
+
+   For **iOS**: Hit <kbd>Cmd ⌘</kbd> + <kbd>R</kbd> in your iOS Simulator to reload the app and see your changes!
+
+## Congratulations! :tada:
+
+You've successfully run and modified your React Native App. :partying_face:
+
+### Now what?
+
+- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).
+- If you're curious to learn more about React Native, check out the [Introduction to React Native](https://reactnative.dev/docs/getting-started).
+
+# Troubleshooting
+
+If you can't get this to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.
+
+# Learn More
+
+To learn more about React Native, take a look at the following resources:
+
+- [React Native Website](https://reactnative.dev) - learn more about React Native.
+- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.
+- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.
+- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.
+- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.

__tests__/App-test.js

@@ -0,0 +1,14 @@
+/**
+ * @format
+ */
+
+import 'react-native';
+import React from 'react';
+import App from '../App';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  renderer.create(<App />);
+});

app.json

@@ -0,0 +1,4 @@
+{
+  "name": "annchoi",
+  "displayName": "annchoi"
+}

babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+};

index.js

@@ -0,0 +1,14 @@
+/**
+ * @format
+ */
+ import React from 'react';
+ import { AppRegistry, Platform } from 'react-native';
+ import App from './App';
+ import { name as appName } from './app.json';
+ import moment from 'moment';
+ import AsyncStorage from '@react-native-community/async-storage';
+ 
+ 
+ 
+ AppRegistry.registerComponent(appName, () => App);
+ 

metro.config.js

@@ -0,0 +1,17 @@
+/**
+ * Metro configuration for React Native
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ */
+
+module.exports = {
+  transformer: {
+    getTransformOptions: async () => ({
+      transform: {
+        experimentalImportSupport: false,
+        inlineRequires: true,
+      },
+    }),
+  },
+};

package.json

@@ -0,0 +1,65 @@
+{
+  "name": "annchoi",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "android": "react-native run-android",
+    "ios": "react-native run-ios",
+    "start": "react-native start",
+    "test": "jest",
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "@react-native-community/async-storage": "^1.12.1",
+    "@react-native-community/checkbox": "^0.5.14",
+    "@react-native-community/masked-view": "^0.1.11",
+    "@react-navigation/bottom-tabs": "^6.4.0",
+    "@react-navigation/material-bottom-tabs": "^6.2.4",
+    "@react-navigation/native": "^6.0.13",
+    "@react-navigation/stack": "^6.3.4",
+    "axios": "^1.1.3",
+    "lodash": "^4.17.21",
+    "lottie-react-native": "^5.1.4",
+    "mobx": "^6.6.2",
+    "mobx-react": "^7.5.3",
+    "moment": "^2.29.4",
+    "react": "17.0.2",
+    "react-native": "0.68.2",
+    "react-native-codegen": "^0.72.0",
+    "react-native-easy-grid": "^0.2.2",
+    "react-native-easy-toast": "^2.0.0",
+    "react-native-fast-image": "^8.6.3",
+    "react-native-gesture-handler": "^2.8.0",
+    "react-native-htmlview": "^0.16.0",
+    "react-native-i18n": "^2.0.15",
+    "react-native-image-picker": "^4.10.0",
+    "react-native-keyboard-aware-scroll-view": "^0.9.5",
+    "react-native-paper": "^4.12.5",
+    "react-native-popup-menu": "^0.16.1",
+    "react-native-reanimated": "^2.12.0",
+    "react-native-safe-area-context": "^4.4.1",
+    "react-native-safe-area-view": "^1.1.1",
+    "react-native-screens": "^3.18.2",
+    "react-native-size-matters": "^0.4.0",
+    "react-native-snap-carousel": "^3.9.1",
+    "react-native-status-bar-height": "^2.6.0",
+    "react-native-uuid": "^2.0.1",
+    "react-native-vector-icons": "^9.2.0",
+    "react-native-webview": "^11.23.1",
+    "react-native-youtube-iframe": "^2.2.2",
+    "react-theme-provider": "^0.1.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.2",
+    "@babel/runtime": "^7.20.1",
+    "@react-native-community/eslint-config": "^3.2.0",
+    "babel-jest": "^29.3.1",
+    "eslint": "^8.27.0",
+    "jest": "^29.3.1",
+    "metro-react-native-babel-preset": "^0.73.3",
+    "react-test-renderer": "17.0.2"
+  },
+  "jest": {
+    "preset": "react-native"
+  }
+}

router.js

@@ -0,0 +1,291 @@
+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ * @flow strict-local
+ */
+
+
+import React, { useEffect } from 'react';
+
+import { colors } from './src/assets/styles/colors-theme';
+import {
+  StyleSheet,
+  ScrollView,
+  View,
+  Text,
+  StatusBar,
+  TouchableOpacity,
+} from 'react-native';
+import SafeAreaView from 'react-native-safe-area-view';
+import { Provider, inject, observer } from 'mobx-react';
+import Store from './src/stores/index';
+import { NavigationContainer, useFocusEffect } from '@react-navigation/native';
+import { createStackNavigator, HeaderBackButton, CardStyleInterpolators } from '@react-navigation/stack';
+import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import {
+  Header,
+  LearnMoreLinks,
+  Colors,
+  DebugInstructions,
+  ReloadInstructions,
+} from 'react-native/Libraries/NewAppScreen';
+import MyTabBar from './MyTabBar';
+import Icon from 'react-native-vector-icons/dist/MaterialCommunityIcons';
+import SplashScreen from './src/pages/splash/splashScreen';
+import Main from './src/pages/main/main';
+import Category from './src/pages/category/category'
+import Favourite from './src/pages/favorite/favorite'
+import Cart from './src/pages/cart/cart'
+import Setting from './src/pages/setting/setting'
+import ProductsDetails from './src/pages/products/productsDetails'
+import Login from './src/pages/login/login'
+import ForgotPassword from './src/pages/login/forgotPassword'
+import Signup from './src/pages/signup/signup'
+import SignupSuccess from './src/pages/signup/signupSuccess'
+import Profile from './src/pages/setting/profile'
+import MyWallet from './src/pages/setting/myWallet'
+import History from './src/pages/history/history'
+import CategoryGrid from './src/pages/category/categoryGrid'
+import Search from './src/pages/search/search'
+import Test from './src/pages/main/test'
+import Shipping from './src/pages/order/shipping'
+import PaymentMethod from './src/pages/order/paymentMethod'
+import ConfirmPayment from './src/pages/order/confirmPayment'
+import OrderConfirmed from './src/pages/order/orderConfirmed'
+import StripePayment from './src/pages/order/stripePayment'
+import ShowQrcode from './src/pages/order/showQrcode'
+import HistoryList from './src/pages/history/historyList'
+import Redeem from './src/pages/redeem/redeem'
+Icon.loadFont();
+
+const Stack = createStackNavigator();
+const BottomTab = createBottomTabNavigator();
+
+const config = {
+  animation: 'mass',
+  config: {
+    stiffness: 1000,
+    damping: 500,
+    mass: 3,
+    overshootClamping: true,
+    restDisplacementThreshold: 0.01,
+    restSpeedThreshold: 0.01,
+  },
+};
+
+
+const Router = inject("appStore")(observer(class Router extends React.Component {
+
+  constructor(props) {
+    super(props);
+    this.store = props.appStore;
+  }
+
+  BottomTabScreen = () => {
+    return (
+      <BottomTab.Navigator
+        screenOptions={{
+          gestureEnabled: false,
+          cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
+        }}
+        tabBar={props => <MyTabBar {...props} />}>
+        <Stack.Screen
+          name="Main"
+          component={Main}
+
+          options={{
+            tabBarLabel: 'Main', headerShown: false,
+          }}
+        />
+        <Stack.Screen
+          name="Category"
+          component={Category}
+          options={{ tabBarLabel: 'Category', headerShown: false }}
+        />
+        {/* <Stack.Screen
+          name="Favourite"
+          component={Favourite}
+          options={{ tabBarLabel: 'Favourite', headerShown: false }}
+        /> */}
+
+        <Stack.Screen
+          name="Cart"
+          component={Cart}
+          options={{ tabBarLabel: 'Cart', headerShown: false }}
+        />
+        <Stack.Screen
+          name="Setting"
+          component={Setting}
+          options={{ tabBarLabel: 'Setting', headerShown: false }}
+        />
+      </BottomTab.Navigator>
+    );
+  };
+
+  render() {
+    return (
+      <View style={{ flex: 1, }}>
+
+        <Stack.Navigator initialRouteName="splash"
+        >
+          {!this.store.splash ? (
+            <>
+              <Stack.Screen
+                name="SplashScreen"
+                component={SplashScreen}
+                options={{ headerShown: false }}
+              />
+
+            </>
+          ) : (<>
+            <Stack.Screen
+              name="BottomTabScreen"
+              component={this.BottomTabScreen}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="ProductsDetails"
+              component={ProductsDetails}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Login"
+              component={Login}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="ForgotPassword"
+              component={ForgotPassword}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Signup"
+              component={Signup}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="SignupSuccess"
+              component={SignupSuccess}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Profile"
+              component={Profile}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="MyWallet"
+              component={MyWallet}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="History"
+              component={History}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="CategoryGrid"
+              component={CategoryGrid}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Search"
+              component={Search}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Test"
+              component={Test}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="Shipping"
+              component={Shipping}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="PaymentMethod"
+              component={PaymentMethod}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="ConfirmPayment"
+              component={ConfirmPayment}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="OrderConfirmed"
+              component={OrderConfirmed}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="StripePayment"
+              component={StripePayment}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="ShowQrcode"
+              component={ShowQrcode}
+              options={{ headerShown: false }}
+            />
+            <Stack.Screen
+              name="HistoryList"
+              component={HistoryList}
+              options={{ headerShown: false }}
+            />
+              <Stack.Screen
+              name="Redeem"
+              component={Redeem}
+              options={{ headerShown: false }}
+            />
+          </>)}
+        </Stack.Navigator>
+
+      </View>
+    );
+  }
+}))
+
+const styles = StyleSheet.create({
+  scrollView: {
+    backgroundColor: Colors.lighter,
+  },
+  engine: {
+    position: 'absolute',
+    right: 0,
+  },
+  body: {
+    backgroundColor: Colors.white,
+  },
+  sectionContainer: {
+    marginTop: 32,
+    paddingHorizontal: 24,
+  },
+  sectionTitle: {
+    fontSize: 24,
+    fontWeight: '600',
+    color: Colors.black,
+  },
+  sectionDescription: {
+    marginTop: 8,
+    fontSize: 18,
+    fontWeight: '400',
+    color: Colors.dark,
+  },
+  highlight: {
+    fontWeight: '700',
+  },
+  footer: {
+    color: Colors.dark,
+    fontSize: 12,
+    fontWeight: '600',
+    padding: 4,
+    paddingRight: 12,
+    textAlign: 'right',
+  },
+});
+
+export default Router;