From cd1930a2bccc912e2e32f1f037f1bada698e0965 Mon Sep 17 00:00:00 2001
From: Nuwan <nuwanchaturanga@gmail.com>
Date: Tue, 10 Sep 2024 18:10:18 +0530
Subject: [PATCH] fix for user instruements and genres are not been loaded on
 edit profile page load

---
 jam-ui/src/components/page/JKEditProfile.js | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/jam-ui/src/components/page/JKEditProfile.js b/jam-ui/src/components/page/JKEditProfile.js
index 3f6f9e3ed..b5fc98179 100644
--- a/jam-ui/src/components/page/JKEditProfile.js
+++ b/jam-ui/src/components/page/JKEditProfile.js
@@ -16,10 +16,16 @@ import { useAppData } from '../../context/AppDataContext';
 function JKEditProfile() {
   const { t } = useTranslation('profile');
   const { currentUser } = useAuth();
+
   const [musicInstruments, setMusicInstruments] = useState([]);
+  const [userMusicInstruments, setUserMusicInstruments] = useState([]);
+
   const [genres, setGenres] = useState([]);
+  const [userGenres, setUserGenres] = useState([]);
+
   const [instrumentsInitialLoadingDone, setInstrumentsInitialLoadingDone] = useState(false);
   const [genreInitialLoadingDone, setGenreInitialLoadingDone] = useState(false);
+
   const [countries, setCountries] = useState([]);
   const [regions, setRegions] = useState([]);
   const [cities, setCities] = useState([]);
@@ -62,6 +68,8 @@ function JKEditProfile() {
   useEffect(() => {
     if (!userProfile) return;
     updateFormData(userProfile);
+    setUserGenres(userProfile.genres);
+    setUserMusicInstruments(userProfile.instruments);
   }, [userProfile]);
 
   useLayoutEffect(() => {
@@ -105,8 +113,7 @@ function JKEditProfile() {
   };
 
   useEffect(() => {
-    if (!musicInstruments.length || !getValues('instruments') || instrumentsInitialLoadingDone) return;
-    setInstrumentsInitialLoadingDone(false);
+    if (instrumentsInitialLoadingDone || musicInstruments.length === 0 || userMusicInstruments.length === 0) return;
     const updatedMusicInstruments = musicInstruments.map(musicInstrument => {
       const instrument = getValues('instruments').find(instrument => instrument.instrument_id === musicInstrument.id);
 
@@ -125,7 +132,7 @@ function JKEditProfile() {
     });
     setMusicInstruments(updatedMusicInstruments);
     setInstrumentsInitialLoadingDone(true);
-  }, [musicInstruments, getValues('instruments')]);
+  }, [userMusicInstruments, musicInstruments]);
 
   const fetchGenres = () => {
     getGenres()
@@ -143,9 +150,10 @@ function JKEditProfile() {
   };
 
   useEffect(() => {
-    if (!genres.length || !getValues('genres') || genreInitialLoadingDone) return;
+    if (genreInitialLoadingDone || userGenres.length === 0 || genres.length === 0) return;
+    
     const updatedGenres = genres.map(genre => {
-      const userGenre = getValues('genres').find(userGenre => userGenre.genre_id === genre.id);
+      const userGenre = userGenres.find(userGenre => userGenre.genre_id === genre.id);
       if (userGenre) {
         genre.checked = true;
       } else {
@@ -156,7 +164,8 @@ function JKEditProfile() {
     });
     setGenres(updatedGenres);
     setGenreInitialLoadingDone(true);
-  }, [genres, getValues('genres')]);
+  }, [userGenres, genres]);
+
 
   const fetchCountries = () => {
     getCountries()