diff --git a/packages/mobile/src/components/fields/PasswordField.tsx b/packages/mobile/src/components/fields/PasswordField.tsx index 893e5ec8f57..b6aff4aa617 100644 --- a/packages/mobile/src/components/fields/PasswordField.tsx +++ b/packages/mobile/src/components/fields/PasswordField.tsx @@ -22,7 +22,6 @@ export const PasswordField = (props: PasswordFieldProps) => { { if (clearErrorOnChange) { setError(undefined) diff --git a/packages/mobile/src/harmony-native/components/CoverPhoto/CoverPhoto.tsx b/packages/mobile/src/harmony-native/components/CoverPhoto/CoverPhoto.tsx index f1bb31ed5e3..b73b1125c9f 100644 --- a/packages/mobile/src/harmony-native/components/CoverPhoto/CoverPhoto.tsx +++ b/packages/mobile/src/harmony-native/components/CoverPhoto/CoverPhoto.tsx @@ -17,9 +17,11 @@ import type { CornerRadiusOptions } from '@audius/harmony-native' import { useTheme } from '../../foundations/theme' +type CoverPhotoImage = Image | ImageSourcePropType | null | undefined + export type CoverPhotoProps = { - profilePicture?: Image | ImageSourcePropType | null | undefined - coverPhoto?: Image | ImageSourcePropType | null | undefined + profilePicture?: CoverPhotoImage + coverPhoto?: CoverPhotoImage style?: StyleProp children?: ReactNode topCornerRadius?: CornerRadiusOptions @@ -51,20 +53,38 @@ export const CoverPhoto = (props: CoverPhotoProps) => { const fullHeightStyle = css({ height: '100%' }) const getSource = () => { - // Having .url means its a useable image source - if (coverPhoto && !isEmpty(coverPhoto)) { - return { source: coverPhoto } + let source: Exclude = { + uri: undefined + } + let usingProfilePicture = false + if (typeof source === 'number') { + return { source, usingProfilePicture } } if (profilePicture && !isEmpty(profilePicture)) { - return { source: profilePicture, usingProfilePicture: true } + source = profilePicture as Exclude + usingProfilePicture = true + } + if (coverPhoto && !isEmpty(coverPhoto)) { + source = coverPhoto as Exclude + usingProfilePicture = false + } + + // Android upload format does not quite match the expected format, so we have to drill into 'file' to workaround for android + if (source && 'file' in source && !('uri' in source)) { + return { source: source.file, usingProfilePicture } + } else { + return { source, usingProfilePicture } } - return { source: { uri: undefined } } } const { source, usingProfilePicture } = getSource() return ( - + {!profilePicture && !coverPhoto ? ( {startAdornmentText && shouldShowAdornments ? ( - + {startAdornmentText} ) : null} @@ -352,12 +346,7 @@ export const TextInput = forwardRef( {...other} /> {endAdornmentText && shouldShowAdornments ? ( - + {endAdornmentText} ) : null} diff --git a/packages/mobile/src/screens/root-screen/RootScreen.tsx b/packages/mobile/src/screens/root-screen/RootScreen.tsx index 4f95b2d5b60..0b946bb55cf 100644 --- a/packages/mobile/src/screens/root-screen/RootScreen.tsx +++ b/packages/mobile/src/screens/root-screen/RootScreen.tsx @@ -16,6 +16,7 @@ import { useDispatch, useSelector } from 'react-redux' import useAppState from 'app/hooks/useAppState' import { useDrawer } from 'app/hooks/useDrawer' +import { useNavigation } from 'app/hooks/useNavigation' import { useFeatureFlag } from 'app/hooks/useRemoteConfig' import { useUpdateRequired } from 'app/hooks/useUpdateRequired' import { useSyncCodePush } from 'app/screens/root-screen/useSyncCodePush' @@ -66,6 +67,7 @@ export const RootScreen = () => { const { isEnabled: isSignUpRedesignEnabled } = useFeatureFlag( FeatureFlags.SIGN_UP_REDESIGN ) + const { navigate } = useNavigation() const { onOpen: openWelcomeDrawer } = useDrawer('Welcome') @@ -107,6 +109,10 @@ export const RootScreen = () => { if (showHomeStack && startedSignUp && !welcomeModalShown) { openWelcomeDrawer() setWelcomeModalShown(true) + // On iOS this will auto-navigate when we un-render sign up but on Android we have to navigate intentionally + if (navigate) { + navigate('HomeStack') + } } } }, [ @@ -114,7 +120,8 @@ export const RootScreen = () => { openWelcomeDrawer, showHomeStack, startedSignUp, - welcomeModalShown + welcomeModalShown, + navigate ]) return ( diff --git a/packages/mobile/src/screens/sign-on-screen/components/layout.tsx b/packages/mobile/src/screens/sign-on-screen/components/layout.tsx index 5da24565c57..511b8b2d459 100644 --- a/packages/mobile/src/screens/sign-on-screen/components/layout.tsx +++ b/packages/mobile/src/screens/sign-on-screen/components/layout.tsx @@ -47,6 +47,8 @@ export const Page = (props: PageProps) => { style={[ css({ zIndex: 1, + minHeight: + Dimensions.get('window').height - insets.top - insets.bottom, paddingBottom: insets.bottom }), style diff --git a/packages/mobile/src/screens/sign-on-screen/screens/CreatePasswordScreen.tsx b/packages/mobile/src/screens/sign-on-screen/screens/CreatePasswordScreen.tsx index bb66a45effa..4de7524e492 100644 --- a/packages/mobile/src/screens/sign-on-screen/screens/CreatePasswordScreen.tsx +++ b/packages/mobile/src/screens/sign-on-screen/screens/CreatePasswordScreen.tsx @@ -1,4 +1,4 @@ -import { useCallback, useState } from 'react' +import { useCallback } from 'react' import { createPasswordPageMessages } from '@audius/common/messages' import { passwordSchema } from '@audius/common/schemas' @@ -8,7 +8,6 @@ import { useDispatch } from 'react-redux' import { toFormikValidationSchema } from 'zod-formik-adapter' import { Flex } from '@audius/harmony-native' -import { KeyboardAvoidingView } from 'app/components/core' import { PasswordField } from 'app/components/fields' import { useNavigation } from 'app/hooks/useNavigation' @@ -49,50 +48,36 @@ export const CreatePasswordScreen = () => { [dispatch, navigation] ) - const [keyboardOffset, setKeyboardOffset] = useState(0) - return ( - - - + + + + + - { - e.currentTarget.measureInWindow((x, y, w, h) => { - setKeyboardOffset(y) - }) - }} - > - - - - - - } /> - - + + + } /> + ) } diff --git a/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/FollowArtistCard.tsx b/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/FollowArtistCard.tsx index 754f2a01837..599320c85c4 100644 --- a/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/FollowArtistCard.tsx +++ b/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/FollowArtistCard.tsx @@ -160,7 +160,7 @@ export const FollowArtistCard = (props: FollowArtistCardProps) => { - + diff --git a/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/SelectArtistsScreen.tsx b/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/SelectArtistsScreen.tsx index dd94c109479..8cb6500d282 100644 --- a/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/SelectArtistsScreen.tsx +++ b/packages/mobile/src/screens/sign-on-screen/screens/SelectArtistScreen/SelectArtistsScreen.tsx @@ -1,7 +1,11 @@ import { useCallback } from 'react' import { selectArtistsPageMessages } from '@audius/common/messages' -import { finishSignUp } from 'audius-client/src/common/store/pages/signon/actions' +import { + addFollowArtists, + finishSignUp, + completeFollowArtists +} from 'audius-client/src/common/store/pages/signon/actions' import { EditingStatus } from 'audius-client/src/common/store/pages/signon/types' import { getFollowIds, @@ -55,12 +59,15 @@ export const SelectArtistsScreen = () => { ) const handleSubmit = useCallback(() => { + // Follow selected artists + dispatch(addFollowArtists(selectedArtists)) + dispatch(completeFollowArtists()) // This call is what eventually triggers the RootScreen to redirect to the home page (via conditional rendering) dispatch(finishSignUp()) if (accountCreationStatus === EditingStatus.LOADING) { navigation.navigate('AccountLoading') } - }, [accountCreationStatus, dispatch, navigation]) + }, [accountCreationStatus, dispatch, navigation, selectedArtists]) return ( diff --git a/packages/web/src/common/store/pages/signon/sagas.ts b/packages/web/src/common/store/pages/signon/sagas.ts index 25d44238f16..c038240ed5a 100644 --- a/packages/web/src/common/store/pages/signon/sagas.ts +++ b/packages/web/src/common/store/pages/signon/sagas.ts @@ -514,8 +514,10 @@ function* signUp() { FeatureFlags.SIGN_UP_REDESIGN ) - if (isNativeMobile && !isSignUpRedesignEnabled) { - yield* put(requestPushNotificationPermissions()) + if (isNativeMobile) { + if (!isSignUpRedesignEnabled) { + yield* put(requestPushNotificationPermissions()) + } } else { // Set the has request browser permission to true as the signon provider will open it setHasRequestedBrowserPermission()