feat: add no request image and support us link

geeekgod · Oct 8, 2022 · 0c10c6d · 0c10c6d
1 parent 1d0a397
commit 0c10c6d
Show file tree

Hide file tree

Showing 6 changed files with 102 additions and 47 deletions.
diff --git a/app.json b/app.json
@@ -9,7 +9,7 @@
     "userInterfaceStyle": "light",
     "splash": {
       "image": "./assets/splash.png",
-      "resizeMode": "contain",
+      "resizeMode": "cover",
       "backgroundColor": "#ffffff"
     },
     "updates": {
@@ -39,7 +39,7 @@
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#FFFFFF"
       },
-      "versionCode": 3
+      "versionCode": 4
     },
     "web": {
       "favicon": "./assets/favicon.png"

diff --git a/app/assets/svg/home/home.svg b/app/assets/svg/home/home.svg
diff --git a/app/components/CustomDrawer/index.js b/app/components/CustomDrawer/index.js
@@ -1,5 +1,5 @@
 import React, { useContext } from "react";
-import { View, Text, TouchableOpacity, Image } from "react-native";
+import { View, Text, TouchableOpacity, Image, Linking } from "react-native";
 import {
   DrawerContentScrollView,
   DrawerItemList,
@@ -48,6 +48,27 @@ const CustomDrawer = (props) => {
         <View style={{ flex: 1, paddingTop: 10 }}>
           <DrawerItemList {...props} />
         </View>
+        <View style={{ paddingHorizontal: 30, paddingVertical: 10 }}>
+          <TouchableOpacity
+            activeOpacity={0.6}
+            onPress={() => Linking.openURL("https://www.buymeacoffee.com/thisisrishabh")}
+            style={{ paddingVertical: 10 }}
+          >
+            <View style={{ flexDirection: "row", alignItems: "center" }}>
+              <Ionicons name="heart-outline" size={22} color='#fff' />
+              <Text
+                style={{
+                  fontSize: 15,
+                  fontFamily: "Poppins-Regular",
+                  marginLeft: 20,
+                  color: "#fff"
+                }}
+              >
+                Support Us
+              </Text>
+            </View>
+          </TouchableOpacity>
+        </View>
       </DrawerContentScrollView>
       <View style={{ padding: 20, borderTopWidth: 1, borderTopColor: "#ccc" }}>
         <TouchableOpacity

diff --git a/app/components/CustomDrawerHeader/index.js b/app/components/CustomDrawerHeader/index.js
@@ -9,7 +9,7 @@ const CustomDrawerHeader = ({ navigation, title }) => {
     <Box background='#fff' py='4' px='6'>
       <HStack alignItems='center'>
         <IconButton
-          variant='solid'
+          variant='unstyled'
           rounded='full'
           _icon={{
             as: Ionicons,

diff --git a/app/screens/Home/index.js b/app/screens/Home/index.js
@@ -1,15 +1,33 @@
-import React, { useContext, useEffect } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { heightScreen, widthScreen } from '../../utils/layout';
 import { Box, Button, CloseIcon, HStack, Divider, Icon, IconButton, Text, VStack, FlatList } from 'native-base';
 import { DataContext } from '../../context/DataContext';
 import * as Linking from 'expo-linking'
+import Empty from "../../assets/svg/home/home.svg";
+import { AuthContext } from '../../context/AuthContext';
 
 
 
 const Home = () => {
 
-  const { requests } = useContext(DataContext)
+
+  const { requests, getRequest } = useContext(DataContext);
+  const { accessToken } = useContext(AuthContext)
+
+  const [refreshing, setRefreshing] = useState(false);
+
+  const loadRequest = async () => {
+    return new Promise(() => {
+      getRequest(accessToken)
+      setRefreshing(false)
+    })
+  }
+
+  const onRefresh = async () => {
+    setRefreshing(true)
+    await loadRequest()
+  }
 
   return (
     <View style={styles.container}>
@@ -19,46 +37,60 @@ const Home = () => {
           List of requests for donations
         </Text>
       </Box>
-      <FlatList w='full' contentContainerStyle={{ paddingVertical: 15 }} data={requests} renderItem={({ item }) => {
-        return (
-          <Box border="1" mt='3' mb='3' borderRadius="xl"
-            w='full'
-            borderColor='muted.300' borderWidth='1'>
-            <VStack space="2">
-              <Text fontFamily='body' fontWeight='600' fontSize='lg'
-                px="4" pt="4">
-                {item.name}
-              </Text>
-              <Box px="4">
-                {item.email}
-              </Box>
-              <Box px="4">
-                {item.address}
-              </Box>
-              <Box px="4">
-                {item.city}
-              </Box>
-              <Box px="4">
-                {item.pin}
-              </Box>
-              <Box px='4' pb="4">
-                <Button
-                  size='md'
-                  pl='6'
-                  pr='6'
-                  fontSize='xl'
-                  rounded='xl'
-                  onPress={() => {
-                    Linking.openURL(`https://maps.google.com/maps?q=${item.location.lat},${item.location.long}`)
-                  }}
-                >
-                  Donate
-                </Button>
-              </Box>
-            </VStack>
-          </Box>
-        )
-      }} />
+
+      {
+        requests && requests.length > 0 ?
+          <FlatList w='full'
+            refreshing={refreshing}
+            onRefresh={onRefresh}
+            contentContainerStyle={{ paddingVertical: 15 }} data={requests} renderItem={({ item }) => {
+              return (
+                <Box border="1" mt='3' mb='3' borderRadius="xl"
+                  w='full'
+                  borderColor='muted.300' borderWidth='1'>
+                  <VStack space="2">
+                    <Text fontFamily='body' fontWeight='600' fontSize='lg'
+                      px="4" pt="4">
+                      {item.name}
+                    </Text>
+                    <Box px="4">
+                      {item.email}
+                    </Box>
+                    <Box px="4">
+                      {item.address}
+                    </Box>
+                    <Box px="4">
+                      {item.city}
+                    </Box>
+                    <Box px="4">
+                      {item.pin}
+                    </Box>
+                    <Box px='4' pb="4">
+                      <Button
+                        size='md'
+                        pl='6'
+                        pr='6'
+                        fontSize='xl'
+                        rounded='xl'
+                        onPress={() => {
+                          Linking.openURL(`https://maps.google.com/maps?q=${item.location.lat},${item.location.long}`)
+                        }}
+                      >
+                        Donate
+                      </Button>
+                    </Box>
+                  </VStack>
+                </Box>
+              )
+            }} />
+          : (<Box justifyContent='center' h='full' alignItems='center'>
+            <Empty />
+            <Text fontFamily='body' fontWeight='600' fontSize='xl'
+              px="4" pt="4" mt='8' textAlign='center'>
+              Woohoo! There's no request for blood
+            </Text>
+          </Box>)
+      }
     </View>
   );
 }
@@ -71,7 +103,7 @@ const styles = StyleSheet.create({
     width: widthScreen,
     backgroundColor: "#fff",
     paddingHorizontal: heightScreen > 800 ? 32 : 26,
-    justifyContent: "center",
+    // justifyContent: "center",
     alignItems: "center",
     position: "relative",
   },

diff --git a/app/screens/Login/index.js b/app/screens/Login/index.js
@@ -28,6 +28,7 @@ const Login = () => {
       ios: undefined,
       android: makeRedirectUri({
         native: `com.geeekgod.bloodline.auth://`,
+        useProxy: true,
       }),
     }),
   });