redesigned tagg loading indicator, added indicator to image upload

1 files changed, 19 insertions, 6 deletions

diff --git a/src/components/common/TaggLoadingIndicator.tsx b/src/components/common/TaggLoadingIndicator.tsx
index c3c44bf9..d9143bd6 100644
--- a/src/components/common/TaggLoadingIndicator.tsx
+++ b/src/components/common/TaggLoadingIndicator.tsx
@@ -1,11 +1,23 @@
 import * as React from 'react';
-import {Image, StyleSheet, View} from 'react-native';
+import {Image, Modal, StyleSheet, View} from 'react-native';
 
-type TaggLoadingIndicatorProps = {
-  color: string;
-};
-const TaggLoadingIndicator: React.FC<TaggLoadingIndicatorProps> = ({color}) => {
-  return (
+interface TaggLoadingIndicatorProps {
+  fullscreen: boolean;
+}
+
+const TaggLoadingIndicator: React.FC<TaggLoadingIndicatorProps> = ({
+  fullscreen = false,
+}) => {
+  return fullscreen ? (
+    <Modal transparent>
+      <View style={[styles.container, styles.horizontal]}>
+        <Image
+          source={require('../../assets/gifs/loading-animation.gif')}
+          style={styles.icon}
+        />
+      </View>
+    </Modal>
+  ) : (
     <View style={[styles.container, styles.horizontal]}>
       <Image
         source={require('../../assets/gifs/loading-animation.gif')}
@@ -19,6 +31,7 @@ const styles = StyleSheet.create({
   container: {
     flex: 1,
     justifyContent: 'center',
+    backgroundColor: 'rgba(0,0,0,0.3)',
   },
   horizontal: {
     flexDirection: 'row',