React sample apps: useEffect hook, Axios api calls

1 files changed, 37 insertions, 0 deletions

diff --git a/react/06-api-calls/src/services/api.js b/react/06-api-calls/src/services/api.js
new file mode 100644
index 0000000..215ee1b
--- /dev/null
+++ b/react/06-api-calls/src/services/api.js
@@ -0,0 +1,37 @@
+import axios from 'axios';
+
+const api = axios.create({
+  baseURL: '/bff/api', // Example value: https://www.example.com
+  timeout: 30000, // 30 seconds
+  headers: { 'Content-Type': 'application/json' },
+  withCredentials: true
+});
+
+// Request Interceptor (Optional: Add Authorization Headers)
+/*
+api.interceptors.request.use(
+  (request) => {
+    console.log("API Request:", request);
+    return request;
+  },
+  (error) => Promise.reject(error)
+);
+*/
+
+// Response Interceptor for Centralized Error Handling
+api.interceptors.response.use(
+  (response) => {
+    return response;
+  },
+  (error) => {
+    console.error("API ERROR:", error.response || error.message);
+
+    if (window.confirm("A network error occured. Try reloading the page?")) {
+      window.location.href =  "/bff/ui"; 
+    }
+
+    return Promise.reject(error);
+  }
+);
+
+export default api;
\ No newline at end of file