В redux-toolkit у меня есть 2 модуля - auth и profile.
auth => обрабатывает информацию про логин, регистрацию, токен и тд
profile => обрабатывает инфомацию об учётной записи пользователя
Когда пользователь пытается войти в систему, я отправляю запрос в api, который возвращает мне токен и информацию об учетной записи. И дальше мне нужно это сохранить.
Я помещаю токен в соответствующее поле (в том же модуле 'auth'). И мне нужно поместить информацию о своей учетной записи в модуль 'profile'. Сейчас я просто диспатчу экшн setProfile из модуля auth.
Является ли такой диспатч экшнов между модулями анти-паттерном?
Или лучше перенести эту логику из redux в component?
Или реализовать экшн логина вне модулей, а в корне редьюсера и из него уже диспатчить экшны в модулях.
Или мне нужно держать все это в одном модуле?
// PROFILE SLICE | profile.js
const initialState = {
data: {},
status: 'idle'
}
export const profileSlice = createSlice({
name: 'profile',
initialState,
reducers: {
setProfile(s, {payload: profile}) {
s.profile = profile
}
}
})
export const {setProfile} = userSlice.actions;
export default profileSlice.reducer
// AUTH SLICE | auth.js
import {setProfile} from './profile' // import action creator from profile slice
const initialState = {
token: null,
status: 'idle'
}
export const authSlice = createSlice({
name: 'auth',
initialState,
reducers: {
setToken(s, {payload: token}) {
s.token = token
}
}
})
export const login = ({email, password}) => dispatch => {
return api.auth.login({
email,
password
})
.then(res => {
const {token, ...profile} = res.data
dispatch(setToken(token))
dispatch(setProfile(profile)
})
}
export const {setToken} = authSlice.actions;
export default authSlice.reducer