saqueib · June 9, 2022 06:42 · Jun 7, 2020 · Sep 8, 2018 · Sep 8, 2018 · Sep 8, 2018
diff --git a/readme.md b/readme.md
@@ -14,8 +14,8 @@ require('./services/errorHandler');
 ```
 4. Thats it, now you should be seeing toast notification on request fail.
 
-## Turn on gloabl error handling for specific call
-You can turn on the global error handling for a specific request by passing `{errorHandle: false}` as config in axios call.
+## Turn off gloabl error handling for specific call
+You can turn off the global error handling for a specific request by passing `{errorHandle: false}` as config in axios call.
 
 ```js
 axios.get('/user/1', {errorHandle: false}).then((response) => {

diff --git a/readme.md b/readme.md
@@ -15,10 +15,10 @@ require('./services/errorHandler');
 4. Thats it, now you should be seeing toast notification on request fail.
 
 ## Turn on gloabl error handling for specific call
-You can turn on the global error handling for a specific request by passing `{handleError: false}` as config in axios call.
+You can turn on the global error handling for a specific request by passing `{errorHandle: false}` as config in axios call.
 
 ```js
-axios.get('/user/1', {handleError: false}).then((response) => {
+axios.get('/user/1', {errorHandle: false}).then((response) => {
     console.log('Everything is awesome.');
 }).catch((error) => {
     // handle this error here

diff --git a/readme.md b/readme.md
@@ -15,7 +15,7 @@ require('./services/errorHandler');
 4. Thats it, now you should be seeing toast notification on request fail.
 
 ## Turn on gloabl error handling for specific call
-You can turn on the global error handling for a specific request by passing `{handleErrors: false}` as config in axios call.
+You can turn on the global error handling for a specific request by passing `{handleError: false}` as config in axios call.
 
 ```js
 axios.get('/user/1', {handleError: false}).then((response) => {

diff --git a/readme.md b/readme.md
@@ -18,7 +18,7 @@ require('./services/errorHandler');
 You can turn on the global error handling for a specific request by passing `{handleErrors: false}` as config in axios call.
 
 ```js
-axios.get('/user/1', {handleErrors: false}).then((response) => {
+axios.get('/user/1', {handleError: false}).then((response) => {
     console.log('Everything is awesome.');
 }).catch((error) => {
     // handle this error here

diff --git a/readme.md b/readme.md
@@ -0,0 +1,27 @@
+## How to use it
+I am assuming you have a Laravel app with axios installed.
+
+1. Run `npm install izitoast --save` to pull the iziToast
+2. Create a `resources/assets/js/services` folder and place `toast.js` and `errorHandler.js` in it.
+3. Now open the `resources/assets/js/bootstrap.js` and add following:
+
+```js
+...
+window.axios = require('axios');
+window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
+
+require('./services/errorHandler');
+```
+4. Thats it, now you should be seeing toast notification on request fail.
+
+## Turn on gloabl error handling for specific call
+You can turn on the global error handling for a specific request by passing `{handleErrors: false}` as config in axios call.
+
+```js
+axios.get('/user/1', {handleErrors: false}).then((response) => {
+    console.log('Everything is awesome.');
+}).catch((error) => {
+    // handle this error here
+    console.warn('Not good man :(');
+})
+```
diff --git a/errorHandler.js b/errorHandler.js
@@ -0,0 +1,22 @@
+ import axios from 'axios'
+ import toast from './toast'
+
+ function errorResponseHandler(error) {
+     // check for errorHandle config
+     if( error.config.hasOwnProperty('errorHandle') && error.config.errorHandle === false ) {
+         return Promise.reject(error);
+     }
+
+     // if has response show the error
+     if (error.response) {
+         toast.error(error.response.data.message);
+     }
+ }
+
+// apply interceptor on response
+axios.interceptors.response.use(
+    response => response,
+    errorResponseHandler
+);
+
+export default errorResponseHandler;
diff --git a/toast.js b/toast.js
@@ -0,0 +1,21 @@
+import 'izitoast/dist/css/iziToast.min.css'
+import iZtoast from 'izitoast'
+
+const toast = {
+    error: (message, title = 'Error') => {
+        return iZtoast.error({
+            title: title,
+            message: message,
+            position: 'bottomCenter'
+        });
+    },
+    success: (message, title = 'Success') => {
+        return iZtoast.success({
+            title: title,
+            message: message,
+            position: 'bottomCenter'
+        });
+    }
+};
+
+export default toast;