Context provides a way to pass data through the component tree without having to pass props down manually at every level.
We are using context for login methods - JWT
SWR
SWR is a popular library used for data fetching and state management in React applications. Data fetching is covered in the Axios API calls section, here we are going to cover about state management using SWR.
Mantis is managing the state of the following using SWR
Snackbar states
Menu states
E-commerce Cart
1. Snackbar
Snackbar is used to show notifications in the application. Whenever a component dispatches an action with data to show snackbar, it appears in the app. The initial state of snackbar is being captured using useSWR hooks and after that, we are mutating it state based on action calls. Following is the initial state:
Now how to read these values and update them as well.
To read the values and listen, following SWR hooks is sufficient in the component. Whenever any changes happen, it is activated like a redux selector and acts based on logic.
Snackbar is used to show notifications in the application. Whenever a component dispatches an action with data to show snackbar, it appears in the app. The initial state of snackbar is being captured using useSWR hooks and after that, we are mutating it state based on action calls. Following is the initial state:
Now how to read these values and update them as well.
To read the values and listen, following SWR hooks is sufficient in the component. Whenever any changes happen, it is activated like a redux selector and acts based on logic.