packagesSlice.js

import { createSlice } from '@reduxjs/toolkit';

import * as api from 'api/packages';

const startLoading = state => {
  state.isLoading = true;
};

const loadingFailed = (state, action) => {
  state.isLoading = false;
  state.error = action.payload;
};

const packagesSlice = createSlice({
  name: 'packages',
  initialState: {
    packages: [],
    isLoading: false,
    error: null,
  },
  reducers: {
    getPackagesStart: startLoading,
    updatePackageStart: startLoading,
    getPackagesSuccess(state, action) {
      state.packages = action.payload;
      state.error = null;
    },
    updatePackageSuccess(state, action) {
      const updatedPackage = action.payload;
      state.packages = state.packages.map(package =>
        package.id === updatedPackage.id ? updatedPackage : package,
      );
      state.error = null;
    },
    getPackagesFailed: loadingFailed,
    updatePackageFailed: loadingFailed,
  },
});

export const {
  getPackagesStart,
  getPackagesSuccess,
  getPackagesFailed,
  updatePackageStart,
  updatePackageSuccess,
  updatePackageFailed,
} = packagesSlice.actions;

export default packagesSlice.reducer;

export const fetchPackages = page => async dispatch => {
  try {
    dispatch(getPackagesStart());
    const packages = await api.getPackages(page);
    dispatch(getPackagesSuccess(packages));
  } catch (error) {
    dispatch(getPackagesFailed(error.toString()));
  }
};

export const updatePackage = (id, package) => async dispatch => {
  try {
    dispatch(updatePackageStart());
    const updatedPackage = await api.updatePackage(package);
    dispatch(updatePackageSuccess(updatedPackage));
  } catch (error) {
    dispatch(updatePackageFailed(error.toString()));
  }
};