aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorIvan Chen <ivan@tagg.id>2021-04-02 19:01:22 -0400
committerIvan Chen <ivan@tagg.id>2021-04-02 19:01:22 -0400
commit7b061c35948609a1f7f3ef3cef8b5e5be964d4c2 (patch)
tree9b767436ec88912b02ee38d3d99d2e7c7c2287a0
parent69613af86a9364f72dc2ce5f24722a3eb4b94ed2 (diff)
commented out all the old reanimated stuff, added TODOs for leon
-rw-r--r--src/components/common/BottomDrawer.tsx13
-rw-r--r--src/components/search/SearchBar.tsx20
-rw-r--r--src/components/search/SearchResultsBackground.tsx20
-rw-r--r--src/components/taggs/TaggsBar.tsx41
-rw-r--r--src/routes/main/MainStackScreen.tsx18
5 files changed, 63 insertions, 49 deletions
diff --git a/src/components/common/BottomDrawer.tsx b/src/components/common/BottomDrawer.tsx
index bef9434a..173823b1 100644
--- a/src/components/common/BottomDrawer.tsx
+++ b/src/components/common/BottomDrawer.tsx
@@ -78,12 +78,13 @@ const BottomDrawer: React.FC<BottomDrawerProps> = (props) => {
<Animated.View
style={[
styles.backgroundView,
- {
- backgroundColor: Animated.interpolateColors(bgAlpha, {
- inputRange: [0, 1],
- outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'],
- }),
- },
+ // TODO: (Leon) use reanimated v2
+ // {
+ // backgroundColor: Animated.interpolateColors(bgAlpha, {
+ // inputRange: [0, 1],
+ // outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'],
+ // }),
+ // },
]}
/>
</TouchableWithoutFeedback>
diff --git a/src/components/search/SearchBar.tsx b/src/components/search/SearchBar.tsx
index 4824b56f..7b833406 100644
--- a/src/components/search/SearchBar.tsx
+++ b/src/components/search/SearchBar.tsx
@@ -109,14 +109,18 @@ const SearchBar: React.FC<SearchBarProps> = ({
/*
* Animated nodes used in search bar activation animation.
*/
- const marginRight: Animated.Node<number> = interpolate(top, {
- inputRange: [-SCREEN_HEIGHT, 0],
- outputRange: [0, 58],
- });
- const opacity: Animated.Node<number> = interpolate(top, {
- inputRange: [-SCREEN_HEIGHT, 0],
- outputRange: [0, 1],
- });
+ // TODO: (Leon) use reanimated v2
+ const marginRight = 0;
+ // const marginRight: Animated.Node<number> = interpolate(top, {
+ // inputRange: [-SCREEN_HEIGHT, 0],
+ // outputRange: [0, 58],
+ // });
+ // TODO: (Leon) use reanimated v2
+ const opacity = 0;
+ // const opacity: Animated.Node<number> = interpolate(top, {
+ // inputRange: [-SCREEN_HEIGHT, 0],
+ // outputRange: [0, 1],
+ // });
return (
<View style={styles.container}>
diff --git a/src/components/search/SearchResultsBackground.tsx b/src/components/search/SearchResultsBackground.tsx
index 2833553d..3d7fab4e 100644
--- a/src/components/search/SearchResultsBackground.tsx
+++ b/src/components/search/SearchResultsBackground.tsx
@@ -10,14 +10,18 @@ const SearchResultsBackground: React.FC<SearchResultsBackgroundProps> = ({
top,
children,
}) => {
- const opacityBackground: Animated.Node<number> = interpolate(top, {
- inputRange: [-SCREEN_HEIGHT, 0],
- outputRange: [0, 1],
- });
- const opacityContent: Animated.Node<number> = interpolate(top, {
- inputRange: [-SCREEN_HEIGHT / 40, 0],
- outputRange: [0, 1],
- });
+ // TODO: (Leon) use reanimated v2
+ const opacityBackground = 0;
+ // const opacityBackground: Animated.Node<number> = interpolate(top, {
+ // inputRange: [-SCREEN_HEIGHT, 0],
+ // outputRange: [0, 1],
+ // });
+ // TODO: (Leon) use reanimated v2
+ const opacityContent = 0;
+ // const opacityContent: Animated.Node<number> = interpolate(top, {
+ // inputRange: [-SCREEN_HEIGHT / 40, 0],
+ // outputRange: [0, 1],
+ // });
return (
<Animated.View
style={[styles.container, {opacity: opacityBackground, top}]}>
diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx
index 567b58de..a87da3e2 100644
--- a/src/components/taggs/TaggsBar.tsx
+++ b/src/components/taggs/TaggsBar.tsx
@@ -112,25 +112,28 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
loadData();
}
}, [taggsNeedUpdate, user]);
-
- 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: [
- PROFILE_CUTOUT_BOTTOM_Y +
- profileBodyHeight -
- (useSafeAreaInsets().top + 10),
- PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight,
- ],
- outputRange: [10, useSafeAreaInsets().top],
- extrapolate: Extrapolate.CLAMP,
- });
+// TODO: (Leon) use reanimated v2
+ const shadowOpacity = 0;
+ // 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,
+ // });
+ // TODO: (Leon) use reanimated v2
+ const paddingTop = 0;
+ // const paddingTop: Animated.Node<number> = interpolate(y, {
+ // inputRange: [
+ // PROFILE_CUTOUT_BOTTOM_Y +
+ // profileBodyHeight -
+ // (useSafeAreaInsets().top + 10),
+ // PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight,
+ // ],
+ // outputRange: [10, useSafeAreaInsets().top],
+ // extrapolate: Extrapolate.CLAMP,
+ // });
return taggs.length > 0 ? (
<View
diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index 8068b893..b72ab779 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -98,10 +98,11 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
cardOverlayEnabled: true,
cardStyleInterpolator: ({current: {progress}}) => ({
cardStyle: {
- opacity: progress.interpolate({
- inputRange: [0, 0.5, 0.9, 1],
- outputRange: [0, 0.25, 0.7, 1],
- }),
+ // TODO: (Leon) use reanimated v2
+ // opacity: progress.interpolate({
+ // inputRange: [0, 0.5, 0.9, 1],
+ // outputRange: [0, 0.25, 0.7, 1],
+ // }),
},
}),
};
@@ -348,10 +349,11 @@ export const modalStyle: StackNavigationOptions = {
cardOverlayEnabled: true,
cardStyleInterpolator: ({current: {progress}}) => ({
cardStyle: {
- opacity: progress.interpolate({
- inputRange: [0, 0.5, 0.9, 1],
- outputRange: [0, 0.25, 0.7, 1],
- }),
+ // TODO: (Leon) use reanimated v2
+ // opacity: progress.interpolate({
+ // inputRange: [0, 0.5, 0.9, 1],
+ // outputRange: [0, 0.25, 0.7, 1],
+ // }),
},
}),
};