Fix/native create button (#2487)

* fix: create button on native * fix: adjust create sheet on all platforms * fix: no manual snapping needed anymore * fix: optimize order of condition * fix: remove unused import * fix: broken edit profile view
showtime-xyz · Nov 1, 2023 · 568b87b · 568b87b
1 parent 8025b3e
commit 568b87b
Show file tree

Hide file tree

Showing 7 changed files with 26 additions and 34 deletions.
diff --git a/apps/expo/package.json b/apps/expo/package.json
@@ -47,7 +47,7 @@
     "@coinbase/wallet-mobile-sdk": "1.0.7",
     "@craftzdog/react-native-buffer": "^6.0.5",
     "@ethersproject/shims": "^5.7.0",
-    "@gorhom/bottom-sheet": "4.4.7",
+    "@gorhom/bottom-sheet": "4.5.1",
     "@hcaptcha/react-native-hcaptcha": "^1.5.1",
     "@hookform/resolvers": "^3.1.1",
     "@magic-ext/react-native-expo-oauth": "^8.1.0",

diff --git a/packages/app/components/drop/create-drop-steps/create-drop-steps.tsx b/packages/app/components/drop/create-drop-steps/create-drop-steps.tsx
@@ -28,7 +28,6 @@ import {
   ChevronRight,
   InformationCircle,
   Close,
-  Raffle,
   Spotify,
 } from "@showtime-xyz/universal.icon";
 import { Label } from "@showtime-xyz/universal.label";
@@ -39,7 +38,6 @@ import { PressableHover } from "@showtime-xyz/universal.pressable-hover";
 import { useSafeAreaInsets } from "@showtime-xyz/universal.safe-area";
 import { ScrollView } from "@showtime-xyz/universal.scroll-view";
 import Spinner from "@showtime-xyz/universal.spinner";
-import { Switch } from "@showtime-xyz/universal.switch";
 import { colors } from "@showtime-xyz/universal.tailwind";
 import { Text } from "@showtime-xyz/universal.text";
 import { View } from "@showtime-xyz/universal.view";
@@ -329,13 +327,12 @@ const CreateDropStepMedia = (
     handleNextStep,
   } = props;
   const { width: windowWidth } = useWindowDimensions();
-
   const mediaWidth = Math.min(340, windowWidth - 32);
 
   return (
     <Layout onBackPress={handlePrevStep} title="Create" closeIcon>
-      <View tw="px-4">
-        <Text tw="px-8 text-center text-xl font-medium text-gray-900 dark:text-gray-50">
+      <ScrollView tw="px-4">
+        <Text tw="px-8 text-center text-lg font-medium text-gray-900 dark:text-gray-50">
           Upload an image or video for your Pre-Save Airdrop
         </Text>
         <View tw="mt-8 self-center" style={{ maxWidth: mediaWidth }}>
@@ -358,7 +355,7 @@ const CreateDropStepMedia = (
             short video snippet promoting your upcoming release.
           </Text>
         </View>
-      </View>
+      </ScrollView>
       <View tw="mt-4 px-4">
         <Button
           size="regular"

diff --git a/packages/app/components/edit-profile.tsx b/packages/app/components/edit-profile.tsx
@@ -561,7 +561,7 @@ export const EditProfile = () => {
               {/* End Social */}
             </View>
           </BottomSheetScrollView>
-          <View tw="my-2.5 mb-4 px-4">
+          <View tw="ios:mb-4 p-4">
             <Button
               disabled={isSubmitting || !formIsValid || !isValid || isLoading}
               tw={
@@ -574,10 +574,14 @@ export const EditProfile = () => {
             >
               {isSubmitting ? "Submitting..." : "Save"}
             </Button>
-            <View tw="h-1" />
-            <Text tw="text-center text-sm text-red-500">
-              {errors.submitError?.message}
-            </Text>
+            {errors.submitError?.message ? (
+              <>
+                <View tw="h-1" />
+                <Text tw="text-center text-sm text-red-500">
+                  {errors.submitError?.message}
+                </Text>
+              </>
+            ) : null}
           </View>
         </View>
         <ModalSheet

diff --git a/packages/app/components/home/header.tsx b/packages/app/components/home/header.tsx
@@ -1,4 +1,4 @@
-import { memo, useContext, useCallback, useState } from "react";
+import { memo, useContext, useCallback } from "react";
 import { useWindowDimensions, Platform, Linking } from "react-native";
 
 import Animated, {
@@ -24,11 +24,6 @@ import {
 } from "app/constants/layout";
 import { UserContext } from "app/context/user-context";
 import { Carousel } from "app/lib/carousel";
-import {
-  getIsShowCreatorTokenIntroBanner,
-  setHideCreatorChannelIntro,
-  setHideShowCreatorTokenBanner,
-} from "app/lib/mmkv-keys";
 
 import { breakpoints } from "design-system/theme";
 

diff --git a/packages/app/navigation/bottom-tab-navigator.tsx b/packages/app/navigation/bottom-tab-navigator.tsx
@@ -23,6 +23,10 @@ const BottomTab = createBottomTabNavigator();
 export function BottomTabNavigator() {
   const { width } = useWindowDimensions();
   const user = useContext(UserContext);
+  const canCreateMusicDrop =
+    !!user?.user?.data.profile.bypass_track_ownership_validation ||
+    !!user?.user?.data.profile.spotify_artist_id ||
+    !!user?.user?.data.profile.apple_music_artist_id;
 
   return (
     <BottomTab.Navigator
@@ -46,7 +50,7 @@ export function BottomTabNavigator() {
           tabBarIcon: CreatorChannelsTabBarIcon,
         }}
       />
-      {width < 768 && (
+      {canCreateMusicDrop && width < 768 && (
         <BottomTab.Screen
           name="createTab"
           component={CreateNavigator}

diff --git a/packages/app/screens/drop.tsx b/packages/app/screens/drop.tsx
@@ -1,5 +1,3 @@
-import { Platform } from "react-native";
-
 import { withModalScreen } from "@showtime-xyz/universal.modal-screen";
 
 import { CreateDropSteps } from "app/components/drop/create-drop-steps/create-drop-steps";
@@ -8,14 +6,8 @@ export const DropScreen = withModalScreen(CreateDropSteps, {
   title: "Create",
   matchingPathname: "/drop",
   matchingQueryParam: "dropModal",
-  tw: "w-full",
-  snapPoints: [
-    Platform.select({
-      ios: 528,
-      default: 500,
-    }),
-    "100%",
-  ],
+  tw: "w-full min-h-[80vh]",
+  snapPoints: ["100%", "100%"],
   useNativeModal: false,
   headerShown: false,
   disableBackdropPress: true,

diff --git a/yarn.lock b/yarn.lock
@@ -3404,9 +3404,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@gorhom/bottom-sheet@npm:4.4.7":
-  version: 4.4.7
-  resolution: "@gorhom/bottom-sheet@npm:4.4.7"
+"@gorhom/bottom-sheet@npm:4.5.1":
+  version: 4.5.1
+  resolution: "@gorhom/bottom-sheet@npm:4.5.1"
   dependencies:
     "@gorhom/portal": 1.0.14
     invariant: ^2.2.4
@@ -3422,7 +3422,7 @@ __metadata:
       optional: true
     "@types/react-native":
       optional: true
-  checksum: ae330e7712fa58d78dc91e089e29f07b23c0c581e8a152b806c39dd831d64a7979e274f188868b086ebbb6f435ce8575fc32f2a1df6b8cf2d522a13b7182374c
+  checksum: dbfc900b7111f723ae1ef9e36facba8779b917427d3fc820172a9547dc94ccf359bf96f66c521aa838379d0371c30ed7933e8ed241929cb01b7a801ad8757f47
   languageName: node
   linkType: hard
 
@@ -6886,7 +6886,7 @@ __metadata:
     "@craftzdog/react-native-buffer": ^6.0.5
     "@ethersproject/shims": ^5.7.0
     "@expo/xcpretty": ^4.2.2
-    "@gorhom/bottom-sheet": 4.4.7
+    "@gorhom/bottom-sheet": 4.5.1
     "@hcaptcha/react-native-hcaptcha": ^1.5.1
     "@hookform/resolvers": ^3.1.1
     "@magic-ext/react-native-expo-oauth": ^8.1.0