diff --git a/jam-ui/src/components/page/JKEditProfile.js b/jam-ui/src/components/page/JKEditProfile.js index bdc93aa93..7a31c0879 100644 --- a/jam-ui/src/components/page/JKEditProfile.js +++ b/jam-ui/src/components/page/JKEditProfile.js @@ -18,9 +18,11 @@ function JKEditProfile() { const [musicInstruments, setMusicInstruments] = useState([]); const [userMusicInstruments, setUserMusicInstruments] = useState([]); + const [userMusicInstrumentsReceived, setUserMusicInstrumentsReceived] = useState(false); const [genres, setGenres] = useState([]); const [userGenres, setUserGenres] = useState([]); + const [userGenresReceived, setUserGenresReceived] = useState(false); const [instrumentsInitialLoadingDone, setInstrumentsInitialLoadingDone] = useState(false); const [genreInitialLoadingDone, setGenreInitialLoadingDone] = useState(false); @@ -68,7 +70,9 @@ function JKEditProfile() { if (!userProfile || Object.keys(userProfile).length === 0) return; updateFormData(userProfile); setUserGenres(userProfile.genres); + setUserGenresReceived(true); setUserMusicInstruments(userProfile.instruments); + setUserMusicInstrumentsReceived(true); }, [userProfile]); useLayoutEffect(() => { @@ -112,7 +116,7 @@ function JKEditProfile() { }; useEffect(() => { - if (instrumentsInitialLoadingDone || musicInstruments.length === 0 || userMusicInstruments.length === 0) return; + if (instrumentsInitialLoadingDone || musicInstruments.length === 0 || !userMusicInstrumentsReceived) return; const updatedMusicInstruments = musicInstruments.map(musicInstrument => { const instrument = getValues('instruments').find(instrument => instrument.instrument_id === musicInstrument.id); @@ -132,7 +136,7 @@ function JKEditProfile() { }); setMusicInstruments(updatedMusicInstruments); setInstrumentsInitialLoadingDone(true); - }, [userMusicInstruments, musicInstruments]); + }, [userMusicInstrumentsReceived, musicInstruments]); const fetchGenres = () => { getGenres() @@ -150,7 +154,7 @@ function JKEditProfile() { }; useEffect(() => { - if (genreInitialLoadingDone || genres.length === 0) return; + if (genreInitialLoadingDone || genres.length === 0 || !userGenresReceived) return; const updatedGenres = genres.map(genre => { const userGenre = userGenres.find(userGenre => userGenre.genre_id === genre.id); @@ -164,7 +168,7 @@ function JKEditProfile() { }); setGenres(updatedGenres); setGenreInitialLoadingDone(true); - }, [userGenres, genres]); + }, [userGenresReceived, genres]); const fetchCountries = () => { getCountries()