Me encantaría tener una idea de cómo destruir mi código para evitar un ciclo requerido (no encuentro ningún error, solo quiero hacer que mi código sea lo mejor posible, sin fugas de memoria, encontrar vars no configurados o daños) rendimiento/legibilidad)
Mi jerarquía se ve así:
services -- api.ts -- userService.ts store -- actions ---- auth.ts -- index.tsx -- jwt.ts En store/index.tsx estoy importando store/jwt.ts para -
const store = createStore(reducer, compose(applyMiddleware(thunk, jwt))) Mientras estoy en store/jwt.ts estoy importando actions/auth.ts para -
import { refreshToken as refreshTokenFunc } from './actions/auth' const jwt: Middleware = ({ dispatch, getState }: { dispatch; getState: () => IRootState }) => { return (next) => (action) => { const nextAction = () => next(action) if (should refresh token) { return !getState().auth.refreshTokenPromise ? refreshTokenFunc(dispatch).then(nextAction) : getState().auth.refreshTokenPromise.then(nextAction) } return nextAction() } } (Mientras tengo refreshTokenPromise como una variable redux para evitar llamar al punto final del token de actualización varias veces seguidas pero esperando que termine la misma llamada).
refreshTokenFunc de actions/auth.ts usa userService.refreshToken (e importa userService... )
export async function refreshToken(dispatch) { const handleErr = () => Promise.reject(dispatch(logout())) const refreshTokenPromise = userService .refreshToken(... some params) .then(({ status, ...rest }) => { status ? dispatch(...) : handleErr() }) .catch(handleErr) await dispatch({ type: AUTH_REFRESH_TOKEN, refreshTokenPromise }) return refreshTokenPromise } services/userService.ts importa servicios principales services/api.ts
import API from './api' refreshToken: (params) => API.post(EEndPoints.REFRESH_TOKEN, ...params) y services/api.ts importa store/index.tsx para getState común, ya sea dispatch cosas comunes como
store.dispatch({ type: GENERAL_TOGGLE_NO_INTERNET }) store.dispatch({ type: AUTH_LOGOUT }) // in case token sent returned as invalid by API...)para resumir -
services/userService.ts -> services/api.ts -> store/index.tsx -> store/jwt.ts -> store/actions/auth.ts -> services/userService.ts
Estoy seguro de que no soy el primero en usar middleware para actualizar tokens, tener este tipo de jerarquía o usar un servicio de api principal con dispatch común o getState , así que tal vez alguien encontró una forma de evitar este bucle. Cada vez que trato de cambiar algunas de las importaciones, todavía tengo este bucle solo de un archivo diferente a otro archivo (por ejemplo, de store/actions/auth.ts a sí mismo)
Traté de mantener el código lo más mínimo posible, en caso de que no sea lo suficientemente claro, comente.
¡Cualquier idea/pensamiento será muy apreciada! :)