최종 팀 프로젝트 Day8

 

팀 프로젝트 시작하면서 정말 시간이 빨리 지나감을 느낀다. 

아니 시간이 정말 왜 이렇게 빨리 지나가는 거죠??

일요일까지 기능구현 마쳐야 하는데 메인의 늪에 빠져있다. 

 

슬라이드와의 싸움..

과연 내가 이길 수 있는가..

 

메인에서 특히 오래 걸린 이유는 슬라이드와 로그인했을 때 안 했을 때, 또는 어떤 데이터가 있을 때 없을 때 나와야 하는 콘텐츠가 달라서 어떤 리스트 조회 작업이라는 1개처럼 보이는 작업이 있다면 사실은 작업이 2개다...

디비에 요청하는 쿼리도 달라야 하고... 어쨌든 그렇다...

 

아래의 코드는 내가 처참하게 실패한 코드...

유저가 우리 서비스에서 퍼스널 음악 진달을 받고 결과를 가진 유저라면 추천 장르에 따라 노래를 보여주고, 아니면 랜덤으로 보여주는 작업을 진행했는데, useQuery로 enabled와 querykey 배열의 두 번째 인자도 사용하고 했는데,,, 결국 실패했다. 

뭔가 계속 싱크가 안 맞았다....

 

로그인했으면 

• 유저 데이블에서 진단 결과 조회
• 진단 결과 있으면 그 진단 결과로 진단 테이블에서 top3 장르 조회 후 그 장르에 맞는 노래 테이블에서 조회
  진단 결과 없다면(진단 안 받음) 노래 테이블에서 랜덤으로 노래 조회

미로그인

• 노래 테이블에서 랜덤으로 노래 조회

경우의 수는 위와 같다. 

결국은 장르 추천 리스트와 랜덤 리스트로 컴포넌트도 분리하고, supabase에 조회하는 함수도 분리했다. 

 

[실패한 코드]

export const getGenreMusicData = async (genreCodes: number[] | undefined): Promise<GenreMusicInfo[]> => {
  try {
    if (genreCodes?.length) {
      const { data } = await supabase.from("musicInfo").select("musicTitle, genre, artist, thumbnail, lyrics, release, musicId, musicSource").in("genre", genreCodes).limit(10);
      console.log("진단결과 있음~");
      return data as GenreMusicInfo[];
    } else {
      const alphabets = "abcdefghijklmnopqrstuvwxyz";
      const random = Math.floor(Math.random() * 10);
      console.log(alphabets[random]);
      const { data } = await supabase.from("musicInfo").select("musicTitle, genre, artist, thumbnail, lyrics, release, musicId, musicSource").like("musicSource", `%${alphabets[random]}%`).limit(10);
      console.log("비회원 또는 진단결과 없음~");
      return data as GenreMusicInfo[];
    }
  } catch (error) {
    console.error(error);
    return [];
  }
};

 

 

나중에는 이것도 해결할 수 있게 되겠지.

남은 기간도 파이팅!