Merge pull request #8 from Mehul2410/features/vallabh

Features/vallabh

package.json

@@ -13,6 +13,8 @@
         "prepare": "husky install"
     },
     "dependencies": {
+        "@react-native-community/checkbox": "^0.5.8",
+        "@react-navigation/bottom-tabs": "^6.0.9",
         "@react-navigation/native": "^6.0.2",
         "@react-navigation/native-stack": "^6.1.0",
         "@react-navigation/stack": "^6.0.7",
@@ -23,6 +25,7 @@
         "react": "16.13.1",
         "react-dom": "16.13.1",
         "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",
+        "react-native-elements": "^3.4.2",
         "react-native-gesture-handler": "^1.10.3",
         "react-native-safe-area-context": "3.2.0",
         "react-native-screens": "~3.4.0",

src/components/background/Background.tsx

@@ -1,6 +1,7 @@
 import { StatusBar } from "expo-status-bar";
 import React, { ReactElement, ReactNode } from "react";
 import { SafeAreaView, StyleSheet } from "react-native";
+import { ScrollView } from "react-native-gesture-handler";
 
 type background = {
     children: ReactNode;

src/config/Navigator.tsx

@@ -1,25 +1,48 @@
 import React, { ReactElement } from "react";
 import { NavigationContainer } from "@react-navigation/native";
 import { createStackNavigator } from "@react-navigation/stack";
-import { Getstarted, Language, Register } from "@screens";
+import {
+    Home,
+    Getstarted,
+    Language,
+    Register,
+    PoliceSignin,
+    PoliceSignup,
+    PoliceDetail,
+    DetailFilled,
+    CitizenSignin,
+    CitizenSignup,
+    Profile
+} from "@screens";
+
 import { StackNavigatorParams } from "@types";
 
 const Stack = createStackNavigator<StackNavigatorParams>();
 
 export default function Navigator(): ReactElement {
     return (
-        <NavigationContainer>
-            <Stack.Navigator
-                initialRouteName="Register"
-                screenOptions={{
-                    headerMode: "screen",
-                    headerShown: false
-                }}
-            >
-                <Stack.Screen name="Getstarted" component={Getstarted} />
-                <Stack.Screen name="Language" component={Language} />
-                <Stack.Screen name="Register" component={Register} />
-            </Stack.Navigator>
-        </NavigationContainer>
+        <>
+            <NavigationContainer>
+                <Stack.Navigator
+                    initialRouteName="Home"
+                    screenOptions={{
+                        headerMode: "screen",
+                        headerShown: false
+                    }}
+                >
+                    <Stack.Screen name="Home" component={Home} />
+                    <Stack.Screen name="Profile" component={Profile} />
+                    <Stack.Screen name="Getstarted" component={Getstarted} />
+                    <Stack.Screen name="Language" component={Language} />
+                    <Stack.Screen name="Register" component={Register} />
+                    <Stack.Screen name="PoliceSignin" component={PoliceSignin} />
+                    <Stack.Screen name="PoliceSignup" component={PoliceSignup} />
+                    <Stack.Screen name="CitizenSignin" component={CitizenSignin} />
+                    <Stack.Screen name="CitizenSignup" component={CitizenSignup} />
+                    <Stack.Screen name="PoliceDetail" component={PoliceDetail} />
+                    <Stack.Screen name="DetailFilled" component={DetailFilled} />
+                </Stack.Navigator>
+            </NavigationContainer>
+        </>
     );
 }

src/config/index.ts

@@ -1 +1,2 @@
 export { default as Navigator } from "./navigator";
+export { default as Tab } from "./tabnavigator/Tab";

src/config/tabnavigator/Tab.tsx

@@ -0,0 +1,88 @@
+import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
+import React from "react";
+import { Home, Profile } from "@screens";
+import { View, Image, TouchableOpacity } from "react-native";
+import { Text } from "@components";
+
+const Tab = createBottomTabNavigator();
+
+const Tabs = () => {
+    return (
+        <Tab.Navigator
+            screenOptions={{
+                headerShown: false,
+                tabBarShowLabel: false,
+                tabBarStyle: {
+                    position: "absolute",
+                    bottom: 25,
+                    left: 20,
+                    right: 20,
+                    elevation: 0,
+                    borderRadius: 10,
+                    height: 80,
+                    backgroundColor: "#389FFE"
+                }
+            }}
+        >
+            <Tab.Screen
+                name="Home"
+                component={Home}
+                options={{
+                    tabBarIcon: ({ focused }) => (
+                        <View style={{ alignItems: "center", justifyContent: "center" }}>
+                            <Image
+                                source={require("@assets/homeicon.png")}
+                                resizeMode="contain"
+                                style={{
+                                    height: 25,
+                                    width: 25,
+                                    marginBottom: 5,
+                                    tintColor: focused ? "#1C32F3" : "#FFF"
+                                }}
+                            />
+                            <Text
+                                weight="200"
+                                style={{
+                                    color: focused ? "#1C32F3" : "#FFF",
+                                    fontFamily: "Chillax-Medium"
+                                }}
+                            >
+                                HOME
+                            </Text>
+                        </View>
+                    )
+                }}
+            />
+            <Tab.Screen
+                name="Profile"
+                component={Profile}
+                options={{
+                    tabBarIcon: ({ focused }) => (
+                        <View style={{ alignItems: "center", justifyContent: "center" }}>
+                            <Image
+                                source={require("@assets/profileicon.png")}
+                                resizeMode="contain"
+                                style={{
+                                    height: 25,
+                                    width: 25,
+                                    marginBottom: 5,
+                                    tintColor: focused ? "#1C32F3" : "#FFF"
+                                }}
+                            />
+                            <Text
+                                weight="200"
+                                style={{
+                                    color: focused ? "#1C32F3" : "#FFF",
+                                    fontFamily: "Chillax-Medium"
+                                }}
+                            >
+                                PROFILE
+                            </Text>
+                        </View>
+                    )
+                }}
+            />
+        </Tab.Navigator>
+    );
+};
+export default Tabs;

src/index.tsx

@@ -1,10 +1,22 @@
 import React, { ReactElement } from "react";
 import { AppBootstrap } from "@components";
 import Navigator from "@config/Navigator";
+import Tabs from "@config/tabnavigator/Tab";
+import { NavigationContainer } from "@react-navigation/native";
+import { useState } from "react";
 
 export default function App(): ReactElement {
+    const [login, setLogin] = useState(true);
+
     return (
         <AppBootstrap>
+            {/* {login ? (
+                <NavigationContainer>
+                    <Tabs />
+                </NavigationContainer>
+            ) : (
+                <Navigator />
+            )} */}
             <Navigator />
         </AppBootstrap>
     );

src/screens/homescreen/Home.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+import { View, Image } from "react-native";
+import { Background, Text } from "@components";
+import { StyleSheet } from "react-native";
+import { LanguageNavigationProps } from "@types";
+
+export function Home({ navigation }: LanguageNavigationProps<"Home">) {
+    return (
+        <Background>
+            <View style={styles.view}>
+                <Text style={styles.text} onPress={() => navigation.navigate("Profile")}>
+                    {" "}
+                    Complaints
+                </Text>
+                <Image source={require("@assets/home.png")} />
+            </View>
+        </Background>
+    );
+}
+
+const styles = StyleSheet.create({
+    view: {
+        alignItems: "center",
+        justifyContent: "center",
+        height: "100%"
+    },
+    text: {
+        color: "#fff",
+
+        marginBottom: 60
+    }
+});

src/screens/index.ts

@@ -1,3 +1,11 @@
-export { Getstarted } from "./home/Getstarted";
+export { Getstarted } from "./splashscreen/Getstarted";
 export { Language } from "./language/Language";
 export { default as Register } from "./register/Register";
+export { PoliceSignin } from "./register/police/signin/PoliceSignin";
+export { PoliceSignup } from "./register/police/signup/PoliceSignup";
+export { CitizenSignin } from "./register/citizen/signin/CitizenSignin";
+export { CitizenSignup } from "./register/citizen/signup/CitizenSignup";
+export { PoliceDetail } from "./register/police/detail/PoliceDetail";
+export { DetailFilled } from "./register/police/detailfilled/DetailFilled";
+export { Home } from "./homescreen/Home";
+export { Profile } from "./profile/Profile";

src/screens/language/Language.tsx

@@ -14,12 +14,24 @@ export function Language({ navigation }: LanguageNavigationProps<"Language">) {
                 </View>
                 <View style={styles.container2}>
                     <ScrollView contentContainerStyle={styles.scroll}>
-                        <Text style={styles.button}>English</Text>
-                        <Text style={styles.button}>हिंदी</Text>
-                        <Text style={styles.button}>मराठी</Text>
-                        <Text style={styles.button}>English</Text>
-                        <Text style={styles.button}>हिंदी</Text>
-                        <Text style={styles.button}>मराठी</Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            English
+                        </Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            हिंदी
+                        </Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            मराठी
+                        </Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            English
+                        </Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            हिंदी
+                        </Text>
+                        <Text style={styles.button} onPress={() => navigation.navigate("Register")}>
+                            मराठी
+                        </Text>
                     </ScrollView>
                 </View>
             </View>