Adding vaccine link for India (looking for api to get official vaccin…

…e links)

Signed-off-by: sarthakpranesh <sarthakpranesh08@gmail.com>

android/app/build.gradle

@@ -138,7 +138,7 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         versionCode 3
-        versionName "3.1.1"
+        versionName "3.2.0"
     }
     splits {
         abi {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Covid19",
-  "version": "3.1.1",
+  "version": "3.2.0",
   "private": true,
   "scripts": {
     "android": "npx react-native run-android",

src/components/Svgs/Github.tsx

@@ -7,7 +7,7 @@ const SvgGithub = (props: SvgProps) => {
       width={24}
       height={24}
       fill="none"
-      stroke="currentColor"
+      stroke="black"
       strokeWidth={2}
       strokeLinecap="round"
       strokeLinejoin="round"

src/components/Svgs/Vaccine.tsx

@@ -0,0 +1,28 @@
+import * as React from 'react'
+import Svg, { SvgProps, G, Path, Defs, ClipPath } from 'react-native-svg'
+
+const SvgVaccine = (props: SvgProps) => {
+  return (
+    <Svg
+      width={24}
+      height={24}
+      fill="none"
+      stroke="black"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...props}
+    >
+      <G clipPath="url(#prefix__clip0)" fill="#000">
+        <Path d="M21.79 15.816h-.492c.28-.453.443-.986.443-1.557v-.753a.703.703 0 00-.703-.703h-3.5c-.908 0-1.713.545-2.05 1.389l-.937 2.34-7.774-.6a40.118 40.118 0 00-2.358-.11v-.056a.703.703 0 00-.703-.704H.703a.703.703 0 00-.703.704v7.53c0 .39.315.704.703.704h3.013a.703.703 0 00.703-.703v-.057a40.211 40.211 0 002.359-.11l8.1-.624a7.881 7.881 0 003.325.74h3.588c1.218 0 2.209-.99 2.209-2.208v-3.013a2.21 2.21 0 00-2.21-2.21zM3.014 22.594H1.406v-6.125h1.607v6.125zm19.58-1.556c0 .442-.36.803-.802.803h-3.588a6.464 6.464 0 01-2.876-.68.703.703 0 00-.368-.071l-8.29.637c-.746.057-1.5.093-2.25.107v-4.606a38.8 38.8 0 012.25.107l8.29.638a.704.704 0 00.706-.44l1.128-2.819a.799.799 0 01.746-.505h2.795v.05c0 .858-.698 1.556-1.556 1.557-.933.037-.932 1.37 0 1.406h3.013c.452 0 .803.369.803.803v3.013z" />
+        <Path d="M7.602 14.37L9.8 12.172a2.962 2.962 0 003.633-.438l4.179-4.179.413.414a.703.703 0 00.995-.995l-2.011-2.01 1.668-1.67 1.1 1.101a.703.703 0 00.995-.994L17.577.206a.703.703 0 00-.995.994l1.1 1.1-1.668 1.669-2.01-2.01a.703.703 0 00-.995.993l.413.414-4.179 4.178c-.97.97-1.14 2.48-.437 3.633l-2.199 2.199a.703.703 0 10.995.994zm6.815-10.01l2.2 2.201-.216.217h-4.402l2.418-2.418zm-4.18 4.179l.355-.355h4.402L12.44 10.74a1.556 1.556 0 11-2.201-2.201z" />
+      </G>
+      <Defs>
+        <ClipPath id="prefix__clip0">
+          <Path fill="#fff" d="M0 0h24v24H0z" />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  )
+}
+
+export default SvgVaccine

src/components/Svgs/index.tsx

@@ -1 +1,2 @@
 export { default as Github } from './Github'
+export { default as Vaccine } from './Vaccine'

src/rawVaccine.ts

@@ -0,0 +1,8 @@
+export type VaccineDataObject = {
+  [key: string]: any
+}
+const vaccineData: VaccineDataObject = {
+  india: 'https://www.cowin.gov.in/home'
+}
+
+export default vaccineData

src/screens/HomeScreen.tsx

@@ -13,7 +13,7 @@ import {
 import { View as MotiView } from 'moti'
 
 // importing components
-import { Github } from '../components/Svgs/index'
+import { Github, Vaccine } from '../components/Svgs/index'
 import SafeAreaView from '../components/SafeAreaView'
 import Country from '../components/Country'
 import CandleCharts from '../components/CandleCharts'
@@ -24,6 +24,9 @@ import { updateData } from '../reducers/DataReducer'
 // importing API functions
 import getCovidData from '../API/functions/getCovidData'
 
+// importing raw vaccine site data
+import vaccineData from '../rawVaccine'
+
 // import common style
 import Styles from '../Styles'
 
@@ -42,25 +45,57 @@ const HomeScreen = (props: any) => {
 
   return (
     <SafeAreaView>
-      <TouchableOpacity
-        style={{
-          position: 'absolute',
-          top: 10,
-          right: 10,
-          backgroundColor: 'white',
-          borderRadius: 8,
-          elevation: 8,
-          zIndex: 999
+      <MotiView
+        style={styles.topIconsContainer}
+        from={{
+          opacity: 0
+        }}
+        animate={{
+          opacity: 1
+        }}
+        transition={{
+          type: 'timing',
+          duration: 200,
+          delay: 400
         }}
-        onPress={() => Linking.openURL('https://github.com/sarthakpranesh/Covid19')}
       >
-        <Github
+        <TouchableOpacity
           style={{
-            margin: 8
+            backgroundColor: 'white',
+            borderRadius: 8,
+            elevation: 8,
+            marginRight: 6
           }}
-          color="black"
-        />
-      </TouchableOpacity>
+          onPress={() => Linking.openURL('https://github.com/sarthakpranesh/Covid19')}
+        >
+          <Github
+            style={{
+              margin: 8
+            }}
+            color="black"
+          />
+        </TouchableOpacity>
+        {
+          Object.keys(vaccineData).includes(country.toLowerCase()) ? (
+            <TouchableOpacity
+              style={{
+                backgroundColor: 'white',
+                borderRadius: 8,
+                elevation: 8,
+                marginRight: 6
+              }}
+              onPress={() => Linking.openURL(vaccineData[country.toLowerCase()])}
+            >
+              <Vaccine
+                style={{
+                  margin: 8
+                }}
+                color="black"
+              />
+            </TouchableOpacity>
+          ) : null
+        }
+      </MotiView>
       <ScrollView
         style={Styles.scrollView}
         contentContainerStyle={Styles.scrollViewContentContainer}
@@ -139,6 +174,16 @@ const HomeScreen = (props: any) => {
 }
 
 const styles = StyleSheet.create({
+  topIconsContainer: {
+    position: 'absolute',
+    top: 10,
+    right: 10,
+    zIndex: 999,
+    display: 'flex',
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
   mainHeaderImage: {
     width: 200,
     height: 40,