Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[C-3689] Fix follow artists not happening if you wait too long on sign up (web) #7257

Merged
merged 1 commit into from
Jan 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 13 additions & 2 deletions packages/web/src/common/store/pages/signon/actions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import {
TikTokProfile,
Image
} from '@audius/common'
import { createCustomAction } from 'typesafe-actions'

import { UiErrorCode } from 'store/errors/actions'

Expand Down Expand Up @@ -77,6 +78,7 @@ export const FETCH_FOLLOW_ARTISTS_FAILED = 'SIGN_ON/FETCH_FOLLOW_ARTISTS_FAILED'
export const SET_FOLLOW_ARTIST_CATEGORY = 'SIGN_ON/SET_FOLLOW_ARTIST_CATEGORY'
export const ADD_FOLLOW_ARTISTS = 'SIGN_ON/ADD_FOLLOW_ARTISTS'
export const REMOVE_FOLLOW_ARTISTS = 'SIGN_ON/REMOVE_FOLLOW_ARTISTS'
export const COMPLETE_FOLLOW_ARTISTS = 'SIGN_ON/COMPLETE_FOLLOW_ARTISTS'

export const SEND_WELCOME_EMAIL = 'SIGN_ON/SEND_WELCOME_EMAIL'

Expand Down Expand Up @@ -375,8 +377,11 @@ export function setTikTokProfileError(error: string) {
* Follows users in signup flow after user is created
* @param userIds array of userIds to follow
*/
export function followArtists(userIds: ID[]) {
return { type: FOLLOW_ARTISTS, userIds }
export function followArtists(
userIds: ID[],
skipDefaultFollows: boolean = false
) {
return { type: FOLLOW_ARTISTS, userIds, skipDefaultFollows }
}

/**
Expand Down Expand Up @@ -484,3 +489,9 @@ export const setReferrer = (userId: ID) => ({
type: SET_REFERRER,
userId
})

/*
* Triggers completeFollowArtists saga that determines the best way to follow artists based on
* the potentially ongoing account creation logic
*/
export const completeFollowArtists = createCustomAction(COMPLETE_FOLLOW_ARTISTS)
37 changes: 30 additions & 7 deletions packages/web/src/common/store/pages/signon/sagas.js
Original file line number Diff line number Diff line change
Expand Up @@ -475,7 +475,9 @@ function* signUp() {

const isNativeMobile = yield getContext('isNativeMobile')

const isSignUpRedesignEnabled = getFeatureEnabled(FeatureFlags.SIGN_UP_REDESIGN)
const isSignUpRedesignEnabled = getFeatureEnabled(
FeatureFlags.SIGN_UP_REDESIGN
)

if (isNativeMobile && !isSignUpRedesignEnabled) {
yield put(requestPushNotificationPermissions())
Expand Down Expand Up @@ -714,17 +716,33 @@ function* followCollections(collectionIds, favoriteSource) {
}
}

function* followArtists() {
/* This saga makes sure that artists chosen in sign up get followed accordingly */
export function* completeFollowArtists(action) {
const accountId = yield select(accountSelectors.getUserId)
if (accountId) {
// If account creation has finished we need to make sure followArtists gets called
// Also we specifically request to not follow the defaults (Audius user, Hot & New Playlist) since that should have already occurred
yield put(signOnActions.followArtists(action.userIds, true))
}
// Otherwise, Account creation still in progress and followArtists will get called already, no need to call here
}

function* followArtists(action) {
const { skipDefaultFollows } = action
const audiusBackendInstance = yield getContext('audiusBackendInstance')
const { ENVIRONMENT } = yield getContext('env')
const defaultFollowUserIds = yield call(getDefautFollowUserIds)
const defaultFollowUserIds = skipDefaultFollows
? []
: yield call(getDefautFollowUserIds)
yield call(waitForWrite)
try {
// Auto-follow Hot & New Playlist
if (ENVIRONMENT === 'production') {
yield fork(followCollections, [4281], FavoriteSource.SIGN_UP)
} else if (ENVIRONMENT === 'staging') {
yield fork(followCollections, [555], FavoriteSource.SIGN_UP)
if (!skipDefaultFollows) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

when would you want to skip default follows? oh i see this is for the second time around?

Copy link
Contributor Author

@DejayJD DejayJD Jan 19, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah since I'm calling the same "sign up focused" follow artists saga here I was running into a quirk where it triggered the default follows twice (resulted in an incorrect following count and extra ACDC transactions to re-follow the default stuff that was already followed).
So yeah I just added a lil flag for my new saga to use

if (ENVIRONMENT === 'production') {
yield fork(followCollections, [4281], FavoriteSource.SIGN_UP)
} else if (ENVIRONMENT === 'staging') {
yield fork(followCollections, [555], FavoriteSource.SIGN_UP)
}
}

const signOn = yield select(getSignOn)
Expand Down Expand Up @@ -778,6 +796,10 @@ function* configureMetaMask() {
}
}

export function* watchCompleteFollowArtists() {
yield takeEvery(signOnActions.COMPLETE_FOLLOW_ARTISTS, completeFollowArtists)
}

function* watchGetArtistsToFollow() {
yield takeEvery(signOnActions.GET_USERS_TO_FOLLOW, getArtistsToFollow)
}
Expand Down Expand Up @@ -849,6 +871,7 @@ function* watchSendWelcomeEmail() {

export default function sagas() {
const sagas = [
watchCompleteFollowArtists,
watchFetchAllFollowArtists,
watchFetchReferrer,
watchCheckEmail,
Expand Down
14 changes: 10 additions & 4 deletions packages/web/src/pages/sign-on/SignOnProvider.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -213,16 +213,21 @@ export class SignOnProvider extends Component<SignOnProps, SignOnState> {
}
if (page === Pages.FOLLOW) {
const {
followArtists: { selectedUserIds },
email,
handle
} = this.props.fields
fields: {
followArtists: { selectedUserIds },
email,
handle
},
completeFollowArtists
} = this.props

this.props.recordCompleteFollow(
selectedUserIds.join('|'),
selectedUserIds.length,
email.value,
handle.value
)
completeFollowArtists()
}
if (page === Pages.LOADING) {
const { email, handle } = this.props.fields
Expand Down Expand Up @@ -567,6 +572,7 @@ function mapDispatchToProps(dispatch: Dispatch) {
goToPage: (page: Pages) => dispatch(signOnAction.goToPage(page)),
addFollows: (userIds: ID[]) =>
dispatch(signOnAction.addFollowArtists(userIds)),
completeFollowArtists: () => dispatch(signOnAction.completeFollowArtists()),
removeFollows: (userIds: ID[]) =>
dispatch(signOnAction.removeFollowArtists(userIds)),
onSetupMetaMask: () => dispatch(signOnAction.configureMetaMask()),
Expand Down
12 changes: 8 additions & 4 deletions packages/web/src/pages/sign-up-page/pages/SelectArtistsPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import type { ChangeEvent } from 'react'

import {
Genre,
ID,
Status,
convertGenreLabelToValue,
useGetFeaturedArtists,
Expand All @@ -18,7 +17,10 @@ import { range } from 'lodash'
import { useDispatch } from 'react-redux'
import { toFormikValidationSchema } from 'zod-formik-adapter'

import { addFollowArtists } from 'common/store/pages/signon/actions'
import {
addFollowArtists,
completeFollowArtists
} from 'common/store/pages/signon/actions'
import { getGenres } from 'common/store/pages/signon/selectors'
import { useMedia } from 'hooks/useMedia'
import { useNavigateToPage } from 'hooks/useNavigateToPage'
Expand Down Expand Up @@ -46,7 +48,7 @@ import { SelectArtistsPreviewContextProvider } from '../utils/selectArtistsPrevi
const AnimatedFlex = animated(Flex)

type SelectArtistsValues = {
selectedArtists: ID[]
selectedArtists: string[]
}

const initialValues: SelectArtistsValues = {
Expand All @@ -69,7 +71,9 @@ export const SelectArtistsPage = () => {
const handleSubmit = useCallback(
(values: SelectArtistsValues) => {
const { selectedArtists } = values
dispatch(addFollowArtists([...selectedArtists]))
const artistsIDArray = [...selectedArtists].map((a) => Number(a))
dispatch(addFollowArtists(artistsIDArray))
dispatch(completeFollowArtists())
if (isMobile) {
navigate(SIGN_UP_COMPLETED_REDIRECT)
} else {
Expand Down