[TMA-186] Instagram Taggs - Frontend (#45)

* Renamed Moments(Bar) to Taggs(Bar)

* created initial navigation and empty social media taggs screen

* made more progress for the header styling

* Finished social media taggs screen, organized code structure

* linted stuff D:

* moved bar height utility function to utils

* moved color constants to constants

* moved avatar title

* updated comments for social media taggs

* NOW the file is there

1 files changed, 0 insertions, 75 deletions

diff --git a/src/components/profile/MomentsBar.tsx b/src/components/profile/MomentsBar.tsx
deleted file mode 100644
index dcc88d89..00000000
--- a/src/components/profile/MomentsBar.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-// @refresh react
-import React from 'react';
-import {StyleSheet} from 'react-native';
-import Animated from 'react-native-reanimated';
-import Moment from './Moment';
-import {PROFILE_CUTOUT_BOTTOM_Y} from '../../constants';
-import {StatusBarHeight} from '../../utils';
-
-const {View, ScrollView, interpolate, Extrapolate} = Animated;
-interface MomentsBarProps {
-  y: Animated.Value<number>;
-  profileBodyHeight: number;
-}
-const MomentsBar: React.FC<MomentsBarProps> = ({y, profileBodyHeight}) => {
-  const moments: Array<JSX.Element> = [];
-  for (let i = 0; i < 10; i++) {
-    moments.push(<Moment key={i} style={styles.moment} />);
-  }
-  const shadowOpacity: Animated.Node<number> = interpolate(y, {
-    inputRange: [
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight,
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight + 20,
-    ],
-    outputRange: [0, 0.2],
-    extrapolate: Extrapolate.CLAMP,
-  });
-  const paddingTop: Animated.Node<number> = interpolate(y, {
-    inputRange: [
-      0,
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight - 30,
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight,
-    ],
-    outputRange: [20, 20, StatusBarHeight],
-    extrapolate: Extrapolate.CLAMP,
-  });
-  const paddingBottom: Animated.Node<number> = interpolate(y, {
-    inputRange: [
-      0,
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight - 30,
-      PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight,
-    ],
-    outputRange: [30, 30, 15],
-    extrapolate: Extrapolate.CLAMP,
-  });
-  return (
-    <View style={[styles.container, {shadowOpacity}]}>
-      <ScrollView
-        horizontal
-        showsHorizontalScrollIndicator={false}
-        style={{paddingTop, paddingBottom}}
-        contentContainerStyle={styles.contentContainer}>
-        {moments}
-      </ScrollView>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    backgroundColor: 'white',
-    shadowColor: '#000',
-    shadowRadius: 10,
-    shadowOffset: {width: 0, height: 2},
-    zIndex: 1,
-  },
-  contentContainer: {
-    alignItems: 'center',
-    paddingHorizontal: 15,
-  },
-  moment: {
-    marginHorizontal: 14,
-  },
-});
-
-export default MomentsBar;