TIL - 20230217

 

 

 

북마크 기능에 생각보다 많은 시간을 쏟았지만 전부 구현해내지 못했다.

프로젝트 특성 상 하나의 디테일 페이지에 들어가 작동을 하는 게 아니라 나뉘어 있는 카테고리, 카테고리에 나열된 리스트에 기능을 넣으려하고, 내가 작업하지 않은 페이지 및 컴포넌트에 들어가 시도해보지 않은 기능을 구현하려니 감도 잡히지 않았다. 그 중간 api 할당량과 어느새 700줄이 넘어가는 복잡한 코드도 어려움에 한 몫을 더했기도 하고.

그런데 돌아보니 그냥 내가 열심히 하지 않아서인듯 함. 더 노력해야겠다.

 

주말에 팀원 분 도움 받아 마무리 함. 

열공하자 ~_~

  const [bookmark, setBookmark] = useState(false);
  const currentUserUid = authService.currentUser?.uid;
  const navigate = useNavigate();

  // 북마크 추가.
  const addBookmark = async () => {
    // 로그인 체크.
    const newId = currentUserUid + productId;
    if (!authService.currentUser) {
      alert("로그인이 필요합니다.");
      navigate("/login");
    }

    // 북마크 되어 있지 않다면?
    if (!bookmark) {
      await setDoc(doc(db, "bookmarks", newId), {
        userId: currentUserUid,
        productName,
        productCoName,
        productId,
        productDocId,
        isbookmark: true,
      });
      setBookmark(true);
    } else {
      // 북마크가 되어 있다면?
      const haveBookMark = doc(db, "bookmarks", newId);
      deleteDoc(haveBookMark);
      setBookmark(false);
    }
  };
  
  // 북마크 내역 불러오기.
  const getBookmark = async () => {
    const newId = currentUserUid + productId;
    const docRef = doc(db, "bookmarks", newId);
    const docSnap = await getDoc(docRef);
    if (docSnap.exists()) {
      setBookmark(true);
    }
  };
  
  useEffect(() => {
    getBookmark();
  }, []);