From f1830b4e48887014d3561ff359f323635a25bc71 Mon Sep 17 00:00:00 2001
From: Shravya Ramesh <shravs1208@gmail.com>
Date: Wed, 26 May 2021 17:44:05 -0700
Subject: Move dropdown to legacy

---
 src/components/suggestedPeople/BadgesDropdown.tsx  | 130 ---------------------
 src/components/suggestedPeople/index.ts            |   1 -
 .../suggestedPeople/legacy/BadgesDropdown.tsx      | 130 +++++++++++++++++++++
 3 files changed, 130 insertions(+), 131 deletions(-)
 delete mode 100644 src/components/suggestedPeople/BadgesDropdown.tsx
 create mode 100644 src/components/suggestedPeople/legacy/BadgesDropdown.tsx

(limited to 'src')

diff --git a/src/components/suggestedPeople/BadgesDropdown.tsx b/src/components/suggestedPeople/BadgesDropdown.tsx
deleted file mode 100644
index 7b35c61a..00000000
--- a/src/components/suggestedPeople/BadgesDropdown.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import React, {useEffect, useState} from 'react';
-import {ImageSourcePropType, StyleSheet} from 'react-native';
-import {TouchableOpacity} from 'react-native-gesture-handler';
-import Animated, {Easing} from 'react-native-reanimated';
-import {BadgeIcon, UniversityIcon} from '..';
-import {UniversityBadge, UniversityType} from '../../types';
-import {normalize} from '../../utils';
-import UniversityIconClicked from './UniversityIconClicked';
-
-interface BadgesDropdownProps {
-  university: UniversityType;
-  localBadges: {
-    badge: UniversityBadge;
-    img: ImageSourcePropType;
-  }[];
-}
-
-const BadgesDropdown: React.FC<BadgesDropdownProps> = ({
-  university,
-  localBadges,
-}) => {
-  // Used to toggle between dropdown being displayed and not
-  const [displayBadges, setDisplayBadges] = useState<boolean>(false);
-
-  // Determines the absolute position of the individual badges [0, i * 40]
-  let [top, setTop] = useState<Animated.Value<number>[]>([]);
-
-  useEffect(() => {
-    // Initialize position of badges to 0
-    const defineBadgePositions = () => {
-      let localTop: Animated.Value<number>[] = [];
-      localBadges.forEach(() => {
-        localTop.push(new Animated.Value(0));
-      });
-      setTop(localTop);
-    };
-    defineBadgePositions();
-  }, []);
-
-  // Displays badges dropdown by updating top [state] for every badge
-  const animate = () => {
-    for (let i = 0; i < localBadges?.length; i++) {
-      if (top) {
-        Animated.timing(top[i], {
-          toValue: i * 40 + 50,
-          duration: 150,
-          easing: Easing.linear,
-        }).start();
-      }
-    }
-  };
-
-  // Draws back displayed badges by setting top [state] to 0 for every badge
-  const animateBack = () => {
-    for (let i = 0; i < localBadges?.length; i++) {
-      if (top) {
-        Animated.timing(top[i], {
-          toValue: 0,
-          duration: 150,
-          easing: Easing.linear,
-        }).start();
-      }
-    }
-  };
-
-  return (
-    <Animated.View
-      style={[styles.badgesContainer, {height: 50 + 40 * localBadges.length}]}>
-      <TouchableOpacity
-        activeOpacity={1}
-        onPress={() => {
-          const updatedBadges = !displayBadges;
-          setDisplayBadges(updatedBadges);
-          if (updatedBadges) {
-            animate();
-          } else {
-            animateBack();
-          }
-        }}>
-        {displayBadges ? (
-          <UniversityIconClicked
-            university={university}
-            style={styles.universityIconContainer}
-            imageStyle={{width: normalize(31), height: normalize(38)}}
-          />
-        ) : (
-          <UniversityIcon
-            university={university}
-            style={styles.universityIconContainer}
-            imageStyle={{width: normalize(31), height: normalize(38)}}
-          />
-        )}
-      </TouchableOpacity>
-      {localBadges &&
-        localBadges.map(({badge, img}, index) => (
-          <Animated.View
-            key={badge.id}
-            style={[
-              styles.animatedBadgeView,
-              {
-                top: top[index],
-                zIndex: -1 * badge.id,
-              },
-            ]}>
-            <BadgeIcon badge={badge} img={img} />
-          </Animated.View>
-        ))}
-    </Animated.View>
-  );
-};
-
-const styles = StyleSheet.create({
-  badgesContainer: {
-    flexDirection: 'column',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    width: 38,
-    left: '5%',
-    paddingBottom: '2%',
-  },
-  animatedBadgeView: {
-    position: 'absolute',
-  },
-  universityIconContainer: {
-    width: normalize(31),
-    height: normalize(38),
-  },
-});
-
-export default BadgesDropdown;
diff --git a/src/components/suggestedPeople/index.ts b/src/components/suggestedPeople/index.ts
index 14c2eb71..34bb96d4 100644
--- a/src/components/suggestedPeople/index.ts
+++ b/src/components/suggestedPeople/index.ts
@@ -1,4 +1,3 @@
 export {default as MutualFriends} from './MutualFriends';
-export {default as BadgesDropdown} from './BadgesDropdown';
 export {default as SPTaggsBar} from './SPTaggsBar';
 export {default as BadgeIcon} from './BadgeIcon';
diff --git a/src/components/suggestedPeople/legacy/BadgesDropdown.tsx b/src/components/suggestedPeople/legacy/BadgesDropdown.tsx
new file mode 100644
index 00000000..267355f3
--- /dev/null
+++ b/src/components/suggestedPeople/legacy/BadgesDropdown.tsx
@@ -0,0 +1,130 @@
+import React, {useEffect, useState} from 'react';
+import {ImageSourcePropType, StyleSheet} from 'react-native';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import Animated, {Easing} from 'react-native-reanimated';
+import {BadgeIcon, UniversityIcon} from '../..';
+import {UniversityBadge, UniversityType} from '../../../types';
+import {normalize} from '../../../utils';
+import UniversityIconClicked from '../UniversityIconClicked';
+
+interface BadgesDropdownProps {
+  university: UniversityType;
+  localBadges: {
+    badge: UniversityBadge;
+    img: ImageSourcePropType;
+  }[];
+}
+
+const BadgesDropdown: React.FC<BadgesDropdownProps> = ({
+  university,
+  localBadges,
+}) => {
+  // Used to toggle between dropdown being displayed and not
+  const [displayBadges, setDisplayBadges] = useState<boolean>(false);
+
+  // Determines the absolute position of the individual badges [0, i * 40]
+  let [top, setTop] = useState<Animated.Value<number>[]>([]);
+
+  useEffect(() => {
+    // Initialize position of badges to 0
+    const defineBadgePositions = () => {
+      let localTop: Animated.Value<number>[] = [];
+      localBadges.forEach(() => {
+        localTop.push(new Animated.Value(0));
+      });
+      setTop(localTop);
+    };
+    defineBadgePositions();
+  }, []);
+
+  // Displays badges dropdown by updating top [state] for every badge
+  const animate = () => {
+    for (let i = 0; i < localBadges?.length; i++) {
+      if (top) {
+        Animated.timing(top[i], {
+          toValue: i * 40 + 50,
+          duration: 150,
+          easing: Easing.linear,
+        }).start();
+      }
+    }
+  };
+
+  // Draws back displayed badges by setting top [state] to 0 for every badge
+  const animateBack = () => {
+    for (let i = 0; i < localBadges?.length; i++) {
+      if (top) {
+        Animated.timing(top[i], {
+          toValue: 0,
+          duration: 150,
+          easing: Easing.linear,
+        }).start();
+      }
+    }
+  };
+
+  return (
+    <Animated.View
+      style={[styles.badgesContainer, {height: 50 + 40 * localBadges.length}]}>
+      <TouchableOpacity
+        activeOpacity={1}
+        onPress={() => {
+          const updatedBadges = !displayBadges;
+          setDisplayBadges(updatedBadges);
+          if (updatedBadges) {
+            animate();
+          } else {
+            animateBack();
+          }
+        }}>
+        {displayBadges ? (
+          <UniversityIconClicked
+            university={university}
+            style={styles.universityIconContainer}
+            imageStyle={{width: normalize(31), height: normalize(38)}}
+          />
+        ) : (
+          <UniversityIcon
+            university={university}
+            style={styles.universityIconContainer}
+            imageStyle={{width: normalize(31), height: normalize(38)}}
+          />
+        )}
+      </TouchableOpacity>
+      {localBadges &&
+        localBadges.map(({badge, img}, index) => (
+          <Animated.View
+            key={badge.id}
+            style={[
+              styles.animatedBadgeView,
+              {
+                top: top[index],
+                zIndex: -1 * badge.id,
+              },
+            ]}>
+            <BadgeIcon badge={badge} img={img} />
+          </Animated.View>
+        ))}
+    </Animated.View>
+  );
+};
+
+const styles = StyleSheet.create({
+  badgesContainer: {
+    flexDirection: 'column',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    width: 38,
+    left: '5%',
+    paddingBottom: '2%',
+  },
+  animatedBadgeView: {
+    position: 'absolute',
+  },
+  universityIconContainer: {
+    width: normalize(31),
+    height: normalize(38),
+  },
+});
+
+export default BadgesDropdown;
-- 
cgit v1.2.3-70-g09d2