며칠동안 해결을 못해 남깁니다 ㅜㅜ

안녕하세요.. 제로초님 ㅜㅜ

며칠동안 해결을 하지 못하여 진도를 나갈수가 없어 ㅜㅜㅜ

큐앤에이 남깁니다 ...(또륵)

login버튼을 누르면 redux에서는 'LOG_IN_REQUEST'실행이 되지만..saga에서는 'LOG_IN_REQUEST'로 안넘어갑니다 ㅜ

LOG_IN_SUCCESS로도 당연히 안 넘어가구요 ㅜㅜ

redux history 에도 LOG_IN_REQUEST만 남고

LOG_IN_SUCCESS나

LOG_IN_FAILURE로는 아예 안넘어갑니다 ㅜㅜ

*참고로 console.log로 찍으면

function* watchLogIn()까지는 찍힙니다 ㅜㅜ 대체 왜그럴까요 

//sagas/user.js 코드

import { all, delay, fork, put, takeLatest } from 'redux-saga/effects';
import axios from 'axios';

import {
  LOG_IN_FAILURE,
  LOG_IN_REQUEST,
  LOG_IN_SUCCESS,
  LOG_OUT_FAILURE,
  LOG_OUT_REQUEST,
  LOG_OUT_SUCCESS,
 
} from '../reducers/user';

function logInAPI(data) {
  return axios.post('/api/login', data);
}

function* logIn(action) {
  console.log("Loginsaga");
  try {
    //console.log('saga logIn');
    // const result = yield call(logInAPI);
    yield delay(1000);
    yield put({
      type: LOG_IN_SUCCESS,
      data:action.data,
    });
  } catch (err) {
    console.error(err);
    yield put({
      type: LOG_IN_FAILURE,
      data: err.response.data,
    });
  }
}

function logOutAPI() {
  return axios.post('/api/logout');
}

function* logOut() {
  try {
    // const result = yield call(logOutAPI);
    yield delay(1000);
    yield put({
      type: LOG_OUT_SUCCESS,
    });
  } catch (err) {
    console.error(err);
    yield put({
      type: LOG_OUT_FAILURE,
      error: err.response.data,
    });
  }
}




function* watchLogIn() {
  console.log("watchLogin");
  yield takeLatest(LOG_IN_REQUEST, logIn);
}

function* watchLogOut() {
  yield takeLatest(LOG_OUT_REQUEST, logOut);
}


export default function* userSaga() {
  yield all([
   
    fork(watchLogIn),
    fork(watchLogOut),
   
  ]);
}


//reducers/user.js 코드


//reducer 쪼개기!
export const LOG_IN_REQUEST = 'LOG_IN_REQUEST';
export const LOG_IN_SUCCESS = 'LOG_IN_SUCCESS';
export const LOG_IN_FAILURE = 'LOG_IN_FAILURE';

export const LOG_OUT_REQUEST = 'LOG_OUT_REQUEST';
export const LOG_OUT_SUCCESS = 'LOG_OUT_SUCCESS';
export const LOG_OUT_FAILURE = 'LOG_OUT_FAILURE';

const dummyUser = {
    id: 1,
    nickname: 'songsong',
    Posts: [],
    Followings: [],
    Followers: [],
  };


export const initialState={
    isLoggingIN:false ,//시도에 대한 변수
    isLoggedIn: false,
    isLoggingOUT:false,
    me: null,
    signUpdate: {},
    loginDate: {}

}

//actionCreater
export const loginRequestAction = (data) => ({
    type: LOG_IN_REQUEST,
    data,
  });
  
  export const logoutRequestAction = () => ({
    type: LOG_OUT_REQUEST,
  });



const Userreducer=(state=initialState,action)=>{
    switch(action.type){

        case LOG_IN_REQUEST:
            console.log('reducer logInReQuest');
            return {
                ...state,
               isLoggingIN:true,
            }
        case LOG_IN_SUCCESS:
            console.log('reducer logInSuccess');
            return {
                ...state, 
                isLoggingIN:false,
                isLoggedIn: true,
                me:{...action.data,nickname:'songsong'}
               

            }
            case 'LOG_IN_FAILURE':
                return { 
                    ...state, 
                    isLoggingIN:false,
           
                }
        case LOG_OUT_REQUEST:
            return {
                ...state,
                isLoggingOUT:true,  
                
            }
        case LOG_OUT_SUCCESS:
            return {
                ...state,
                isLoggingOUT:false,
                isLoggedIn: false,
                me:null
               
         
            }
        case LOG_OUT_FAILURE:
            return {
                ...state,
                isLoggingOUT:false,
               
            }
       
        default :
        return state;
    }

    }
  
export default Userreducer;

//sagas//index.js

import {all,fork} from 'redux-saga/effects';

import postSaga from './post';
import userSaga from './user';
//saga쓰는법 saga만들고 비동기 action을 넣어줌 


export default function* rootSaga(){
    console.log("saga start");
    yield all([
        fork(postSaga),
        fork(userSaga)  //fork와 call 중하나로 generater를 실행한다.
       //함수를 실행하는 것
    ]); //동시 실행

}

/**generator 는 yield를 쓰면  중단점이 생긴다.*/


//store/configureStore.js 

import { applyMiddleware, createStore, compose } from 'redux';
import createSagaMiddleware from 'redux-saga';
import { createWrapper } from 'next-redux-wrapper';
import { composeWithDevTools } from 'redux-devtools-extension';

import reducer from '../reducers';
import rootSaga from '../sagas';

const configureStore =(context)=>{
  console.log(context);
  const sagaMiddleware = createSagaMiddleware();
  const middlewares = [sagaMiddleware];
    const enhancer =process.env.NODE_ENV ==='production' //middleware ==>redux history 기록을 위해서  
    ? compose(applyMiddleware(...middlewares)) : composeWithDevTools(applyMiddleware(...middlewares));
    const store = createStore(reducer, enhancer);
    store.sagaTask = sagaMiddleware.run(rootSaga);
    return store;

    // store.dispatch(changeNickNAme())// reducer   로 전달 됨==>//계속 바뀌니까 매번action을 만드는것은 어려움으로  함수형을 만듦 동적으로

    

} 
const wrapper =createWrapper(configureStore,{
    debug:process.env.NODE_ENV==='development',

}); //option

export default wrapper;


//readuxmiddleWare란 ,redux에 middleware를 추가해주는 것(비 동기 action을 dispatch 하는 역할)
//thunk란 함수를 지연하게 해주는 것

/**
 * function createThunkMiddleware(extraArgument) {
  return ({ dispatch, getState }) => (next) => (action) => {
    if (typeof action === 'function') {
      return action(dispatch, getState, extraArgument);
    }

    return next(action);
  };
}

function loggerMiddleware=({ dispatch, getState }) => (next) => (action) => {
   console.log(action)
    return next(action);
  };
}

 * 
 */