From bf85e56a4f8e0f16a446ec7df8d7f4eba624c213 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Thu, 15 Apr 2021 16:53:28 -0400
Subject: moved TaggPopup to legacy

---
 src/components/common/TaggPopup.tsx         | 143 ----------------------------
 src/components/common/index.ts              |   1 -
 src/screens/onboarding/legacy/TaggPopup.tsx | 143 ++++++++++++++++++++++++++++
 3 files changed, 143 insertions(+), 144 deletions(-)
 delete mode 100644 src/components/common/TaggPopup.tsx
 create mode 100644 src/screens/onboarding/legacy/TaggPopup.tsx

(limited to 'src')

diff --git a/src/components/common/TaggPopup.tsx b/src/components/common/TaggPopup.tsx
deleted file mode 100644
index f9929580..00000000
--- a/src/components/common/TaggPopup.tsx
+++ /dev/null
@@ -1,143 +0,0 @@
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import * as React from 'react';
-import {Platform, Text, StyleSheet, TouchableOpacity} from 'react-native';
-import {Image, View} from 'react-native-animatable';
-import {ArrowButton} from '../onboarding';
-import {OnboardingStackParams} from '../../routes';
-import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
-import CloseIcon from '../../assets/ionicons/close-outline.svg';
-import {BlurView} from '@react-native-community/blur';
-
-type TaggPopupRouteProps = RouteProp<OnboardingStackParams, 'TaggPopup'>;
-type TaggPopupNavigationProps = StackNavigationProp<
-  OnboardingStackParams,
-  'TaggPopup'
->;
-
-interface TaggPopupProps {
-  route: TaggPopupRouteProps;
-  navigation: TaggPopupNavigationProps;
-}
-
-const TaggPopup: React.FC<TaggPopupProps> = ({route, navigation}) => {
-  /**
-   * Custom popup / Tutorial screen for Tagg
-   * Just like a  Singly Linked List, we have a next node
-   * if (next !== undefined)
-   *    Display the next button and navigate to next popup node on click
-   * else
-   *    Display close button, navigate back on close
-   */
-  const {messageHeader, messageBody, next} = route.params.popupProps;
-
-  return (
-    <BlurView blurType="light" blurAmount={2} style={styles.container}>
-      <TouchableOpacity
-        style={styles.container}
-        onPressOut={() => {
-          navigation.goBack();
-        }}>
-        <View style={styles.popup}>
-          <Image
-            style={styles.icon}
-            source={require('../../assets/icons/notificationPrompts/plus-logo.png')}
-          />
-          <View style={styles.textContainer}>
-            <Text style={styles.header}>{messageHeader}</Text>
-            <Text style={styles.subtext}>{messageBody}</Text>
-          </View>
-          {!next && (
-            <TouchableOpacity
-              style={styles.closeButton}
-              onPress={() => {
-                navigation.goBack();
-              }}>
-              <CloseIcon height={'50%'} width={'50%'} color={'white'} />
-            </TouchableOpacity>
-          )}
-        </View>
-        {next && (
-          <View style={styles.footer}>
-            <ArrowButton
-              direction="forward"
-              onPress={() => {
-                navigation.navigate('TaggPopup', {popupProps: next});
-              }}
-            />
-          </View>
-        )}
-      </TouchableOpacity>
-    </BlurView>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    flexDirection: 'column',
-    justifyContent: 'center',
-    alignItems: 'center',
-    width: '100%',
-    height: '100%',
-  },
-  whiteColor: {
-    color: 'white',
-  },
-  closeButton: {
-    position: 'relative',
-    height: '50%',
-    aspectRatio: 1,
-    left: '20%',
-  },
-  textContainer: {
-    flex: 1,
-    flexDirection: 'column',
-  },
-  icon: {
-    width: 40,
-    height: 40,
-    marginVertical: '1%',
-  },
-  header: {
-    color: '#fff',
-    fontSize: SCREEN_WIDTH / 25,
-    fontWeight: '600',
-    textAlign: 'justify',
-    marginBottom: '2%',
-    marginLeft: '4%',
-  },
-  subtext: {
-    color: '#fff',
-    fontSize: SCREEN_WIDTH / 30,
-    fontWeight: '600',
-    textAlign: 'justify',
-    marginBottom: '15%',
-    marginLeft: '3%',
-  },
-  popup: {
-    width: SCREEN_WIDTH * 0.8,
-    height: SCREEN_WIDTH * 0.24,
-    backgroundColor: 'black',
-    borderRadius: 8,
-    flexDirection: 'row',
-    alignSelf: 'auto',
-    flexWrap: 'wrap',
-    position: 'absolute',
-    bottom: SCREEN_HEIGHT * 0.7,
-    padding: SCREEN_WIDTH / 40,
-  },
-  footer: {
-    marginLeft: '50%',
-    flexDirection: 'column-reverse',
-    ...Platform.select({
-      ios: {
-        bottom: '20%',
-      },
-      android: {
-        bottom: '10%',
-      },
-    }),
-  },
-});
-export default TaggPopup;
diff --git a/src/components/common/index.ts b/src/components/common/index.ts
index b5fd0542..5a601f1d 100644
--- a/src/components/common/index.ts
+++ b/src/components/common/index.ts
@@ -17,7 +17,6 @@ export {default as TaggDatePicker} from './TaggDatePicker';
 export {default as BottomDrawer} from './BottomDrawer';
 export {default as TaggLoadingIndicator} from './TaggLoadingIndicator';
 export {default as GenericMoreInfoDrawer} from './GenericMoreInfoDrawer';
-export {default as TaggPopUp} from './TaggPopup';
 export {default as TaggPrompt} from './TaggPrompt';
 export {default as AcceptDeclineButtons} from './AcceptDeclineButtons';
 export {default as FriendsButton} from './FriendsButton';
diff --git a/src/screens/onboarding/legacy/TaggPopup.tsx b/src/screens/onboarding/legacy/TaggPopup.tsx
new file mode 100644
index 00000000..e71a4d2a
--- /dev/null
+++ b/src/screens/onboarding/legacy/TaggPopup.tsx
@@ -0,0 +1,143 @@
+import {BlurView} from '@react-native-community/blur';
+import {RouteProp} from '@react-navigation/native';
+import {StackNavigationProp} from '@react-navigation/stack';
+import * as React from 'react';
+import {Platform, StyleSheet, Text, TouchableOpacity} from 'react-native';
+import {Image, View} from 'react-native-animatable';
+import {ArrowButton} from '../../../components/onboarding';
+import {OnboardingStackParams} from '../../../routes';
+import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../../utils';
+import CloseIcon from '../../../assets/ionicons/close-outline.svg';
+
+type TaggPopupRouteProps = RouteProp<OnboardingStackParams, 'TaggPopup'>;
+type TaggPopupNavigationProps = StackNavigationProp<
+  OnboardingStackParams,
+  'TaggPopup'
+>;
+
+interface TaggPopupProps {
+  route: TaggPopupRouteProps;
+  navigation: TaggPopupNavigationProps;
+}
+
+const TaggPopup: React.FC<TaggPopupProps> = ({route, navigation}) => {
+  /**
+   * Custom popup / Tutorial screen for Tagg
+   * Just like a  Singly Linked List, we have a next node
+   * if (next !== undefined)
+   *    Display the next button and navigate to next popup node on click
+   * else
+   *    Display close button, navigate back on close
+   */
+  const {messageHeader, messageBody, next} = route.params.popupProps;
+
+  return (
+    <BlurView blurType="light" blurAmount={2} style={styles.container}>
+      <TouchableOpacity
+        style={styles.container}
+        onPressOut={() => {
+          navigation.goBack();
+        }}>
+        <View style={styles.popup}>
+          <Image
+            style={styles.icon}
+            source={require('../../../assets/icons/notificationPrompts/plus-logo.png')}
+          />
+          <View style={styles.textContainer}>
+            <Text style={styles.header}>{messageHeader}</Text>
+            <Text style={styles.subtext}>{messageBody}</Text>
+          </View>
+          {!next && (
+            <TouchableOpacity
+              style={styles.closeButton}
+              onPress={() => {
+                navigation.goBack();
+              }}>
+              <CloseIcon height={'50%'} width={'50%'} color={'white'} />
+            </TouchableOpacity>
+          )}
+        </View>
+        {next && (
+          <View style={styles.footer}>
+            <ArrowButton
+              direction="forward"
+              onPress={() => {
+                navigation.navigate('TaggPopup', {popupProps: next});
+              }}
+            />
+          </View>
+        )}
+      </TouchableOpacity>
+    </BlurView>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    flexDirection: 'column',
+    justifyContent: 'center',
+    alignItems: 'center',
+    width: '100%',
+    height: '100%',
+  },
+  whiteColor: {
+    color: 'white',
+  },
+  closeButton: {
+    position: 'relative',
+    height: '50%',
+    aspectRatio: 1,
+    left: '20%',
+  },
+  textContainer: {
+    flex: 1,
+    flexDirection: 'column',
+  },
+  icon: {
+    width: 40,
+    height: 40,
+    marginVertical: '1%',
+  },
+  header: {
+    color: '#fff',
+    fontSize: SCREEN_WIDTH / 25,
+    fontWeight: '600',
+    textAlign: 'justify',
+    marginBottom: '2%',
+    marginLeft: '4%',
+  },
+  subtext: {
+    color: '#fff',
+    fontSize: SCREEN_WIDTH / 30,
+    fontWeight: '600',
+    textAlign: 'justify',
+    marginBottom: '15%',
+    marginLeft: '3%',
+  },
+  popup: {
+    width: SCREEN_WIDTH * 0.8,
+    height: SCREEN_WIDTH * 0.24,
+    backgroundColor: 'black',
+    borderRadius: 8,
+    flexDirection: 'row',
+    alignSelf: 'auto',
+    flexWrap: 'wrap',
+    position: 'absolute',
+    bottom: SCREEN_HEIGHT * 0.7,
+    padding: SCREEN_WIDTH / 40,
+  },
+  footer: {
+    marginLeft: '50%',
+    flexDirection: 'column-reverse',
+    ...Platform.select({
+      ios: {
+        bottom: '20%',
+      },
+      android: {
+        bottom: '10%',
+      },
+    }),
+  },
+});
+export default TaggPopup;
-- 
cgit v1.2.3-70-g09d2