Open shoaibshebi opened 2 years ago
As a redux best practice, I would not recommend creating a snackbar from inside the reducer itself because reducers should be free of side effects. It would be best to call the function notification.success(payload.message)
from a middleware, such as the RTK listener middleware. But that's a separate issue and does not have any impact on how MUI would implement an imperative snackbar call.
I had the same problem and wanted to add global method calls.
I have the same problems. I want to handle errors in responses in interceptors in axios. To implement, I need a global function. notification by antd looks like the perfect solution, but I'm already using MUI. My code example:
import AxiosStatic, { AxiosError, AxiosInstance } from 'axios'
const errorResponseInterceptor = (error: AxiosError): Promise<AxiosError> => {
const { response } = error
switch (response?.status) {
case 500:
// here need to call an error notification for 500
break
case 400:
// here need to call an error notification for 400
break
default:
console.log(response?.data)
}
return Promise.reject(error.response)
}
axiosInstance.interceptors.response.use(
Promise.resolve,
errorResponseInterceptor
)
Using the notification in this way makes it possible to make the UI/ux uniform and saves the developer from resorting to third-party libraries.
Here is an example implementation that seems to be working for me: https://gist.github.com/MonstraG/02e2c5a51784a80d60d724143a5753f8
Duplicates
Latest version
Summary 💡
Current scenerio 😯
Currently, in MUI we only have snackbars that should be used in such a way that can be rendered as HTML (JSX syntax) i.e
OR
<Alert severity="error">This is an error message!</Alert>
New and required behavior 🤔
But what if we have to generate a snackbar from within the reducer i.e
So currently we are not able to do that in reducers and have to install another package, or have to create the global and to do a bunch of stuff to achieve the functionality
Sumup 🙌
A simple calling method to show the notification or snackbar for some specific task, a method that can be called from anywhere of the application
Examples 🌈
No response
Motivation 🔦
We can check this scenario working here, as Antd implemented it