0

I am Trying to get a response on the action.js file from the service but every time I am getting undefined I have debugged the service.js API function and it's showing its response and I am getting undefined in the action.js file

Action.js

export const loginUser = () => async (
  dispatch: ThunkDispatch<IStore, null, ILogInUserAction>,
  getState: () => IStore
) => {
  dispatch({ type: LOGIN_USER_ACCOUNT.LOGIN_USER_LOADING });

  const logInUser = store.getState().auth.logInUser;

  const payload: ILogInUserRequestAction = {
    username: logInUser.username,
    password: logInUser.password,
  };
  const result = await login(payload);
  console.log('result', result);
};

instance.js

import axios from 'axios';

export const instance = axios.create({
  baseURL: process.env.REACT_APP_BACK_END_HOST,
  headers: { 'Content-Type': 'application/json' },
});

instance.interceptors.response.use(
  (response) => response.data,
  (error) => Promise.reject(error)
);

service.js

export const login = (data: ReqLogin) => {
  instance
    .post('/auth/login/', data)
    .then((response) => ({
      status: true,
      response,
    }))
    .catch((response) => ({
      status: false,
      error: response?.data,
    }));
};

Result Console.log enter image description here

Response Screenshot enter image description here

VLAZ
  • 26,331
  • 9
  • 49
  • 67
Shiva Giri
  • 105
  • 1
  • 6

1 Answers1

1

You are not returning anything in your login() function. You have to add return statement:

export const login = (data: ReqLogin) => {
   return instance
    .post('/auth/login/', data)
    .then((response) => ({
      status: true,
      response,
    }))
    .catch((response) => ({
      status: false,
      error: response?.data,
    }));
};
pe.kne
  • 655
  • 3
  • 16
  • Or since you are using arrow function, you can omit curly braces (`{}`) around the `instance` promise. – pe.kne Dec 13 '22 at 14:32