Task EPAM-JS-Competency-center#7 Authorization

- add alerts on unauthenticated requests

Author: voroshkov

src/components/pages/admin/PageProductImport/components/CSVFileImport.tsx

@@ -25,24 +25,30 @@ export default function CSVFileImport({ url, title }: CSVFileImportProps) {
 
   const uploadFile = async () => {
     console.log("uploadFile to", url);
-
-    // Get the presigned URL
+    if (!file) {
+      console.error("File not specified");
+      return;
+    }
+    // Get the pre-signed URL
     const response = await axios({
       method: "GET",
+      headers: { Authorization: "Basic ddm9yb3Noa292OlRFU1RfUEFTU1dPUkQ=" },
       url,
       params: {
         name: encodeURIComponent(file.name),
       },
     });
     console.log("File to upload: ", file.name);
     console.log("Uploading to: ", response.data);
+
     const result = await fetch(response.data, {
       method: "PUT",
       body: file,
     });
     console.log("Result: ", result);
-    setFile("");
+    setFile(undefined);
   };
+
   return (
     <Box>
       <Typography variant="h6" gutterBottom>

src/constants/apiPaths.ts

@@ -1,8 +1,8 @@
 const API_PATHS = {
-  product: "https://7u8vlssv4d.execute-api.us-east-1.amazonaws.com",
+  product: "https://bsar9vq69i.execute-api.us-east-1.amazonaws.com",
   order: "https://.execute-api.eu-west-1.amazonaws.com/dev",
   import: "https://ol9cna0j4c.execute-api.us-east-1.amazonaws.com/dev",
-  bff: "https://7u8vlssv4d.execute-api.us-east-1.amazonaws.com",
+  bff: "https://bsar9vq69i.execute-api.us-east-1.amazonaws.com",
   cart: "https://.execute-api.eu-west-1.amazonaws.com/dev",
 };
 

src/index.tsx

@@ -1,3 +1,4 @@
+import axios from "axios";
 import React from "react";
 import { createRoot } from "react-dom/client";
 import App from "~/components/App/App";
@@ -18,6 +19,26 @@ if (import.meta.env.DEV) {
   const { worker } = await import("./mocks/browser");
   worker.start({ onUnhandledRequest: "bypass" });
 }
+axios.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    const { status } = error.response;
+    if (status === 401) {
+      alert(`Current operation requires authorization`);
+    }
+    if (status === 403) {
+      alert(`You are not authorized to perform this operation`);
+    }
+    return Promise.reject(error.response);
+  }
+);
+
+if (!localStorage.getItem("authorization_token")) {
+  localStorage.setItem(
+    "authorization_token",
+    "VmljdG9yQmVsaWtvdjpURVNUX1BBU1NXT1JE"
+  );
+}
 
 const container = document.getElementById("app");
 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion