boardModifyThunk

순9·2023년 10월 19일
0

리액트 게시판

목록 보기
32/54

데이터를 수정 하기위한 비동기

import

import { createAsyncThunk } from "@reduxjs/toolkit";

import { firestore } from "../../firebase";
import { collection, doc, updateDoc, getDocs } from "firebase/firestore";
import { getAuth } from "firebase/auth";

modifyUserData

export interface UserData {
  did: number;
  title: string;
  content: string;
  timedata: Date;
  userUid: string;
  isModified: boolean;
}


const modifyUserData = createAsyncThunk<
  { boardId: number; boarditem: UserData }, //함수에 전달되는 인자의 타입
  { boardId: number; boarditem: UserData }//완료될 때 반환되는 값의 타입
>("user/fetchUserModifyDta", async (data, thunkAPI) => {
  const { boardId, boarditem } = data;
  const { title, content } = boarditem;
  
  const auth = getAuth();
  const currentUser = auth.currentUser;
  const userId = currentUser?.uid;

  const userCollection = collection(firestore, "users");

  const userDataCollrection = collection(
    userCollection,
    "userData",
    userId as string
  );
  
   const datas = await getDocs(userDataCollrection);

  const dataI = datas.docs.map(async (item) => {
    const dt = item.data();

    if (dt.did === boardId) {
      const dataIn = {
        did: boardId,
        index: dt.index,
        title: title,
        content: content,
        timedata: new Date(),
        userUid: userId as string,
        isModified: true,
      };

      const docRef = doc(userDataCollrection, dataIn.index);
      await updateDoc(docRef, dataIn);
    }
  });
  
  const responseData = {
    boardId: boardId,
    boarditem: {
      did: boardId,
      title: title,
      content: content,
      timedata: new Date(),
      userUid: userId as string,
      isModified: true,
    },
  };
  return responseData;
});

createAsyncThunk<T,Z>
T:첫 번째 매개변수는 비동기 작업을 시작할 때 함수에 전달되는 인자의 타입
Z:두 번째 매개변수는 비동기 작업이 성공적으로 완료될 때 반환되는 값의 타입

🦒추가로

수정사항은 선택한 보드와 유저가 가진 데이터의 id가 동일 할때
수정 할 수 있도록 작성

profile
1. 사용법 익히기 2. 원리가 뭔지 찾아보기 3. 원리를 공부하기

0개의 댓글