added axios

package-lock.json

@@ -3126,6 +3126,37 @@
       "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.1.1.tgz",
       "integrity": "sha512-5Kgy8Cz6LPC9DJcNb3yjAXTu3XihQgEdnIg50c//zOC/MyLP0Clg+Y8Sh9ZjjnvBrDZU4DgXS9C3T9r4/scGZQ=="
     },
+    "axios": {
+      "version": "0.19.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
+      "integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
+      "requires": {
+        "follow-redirects": "1.5.10"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "follow-redirects": {
+          "version": "1.5.10",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
+          "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
+          "requires": {
+            "debug": "=3.1.0"
+          }
+        },
+        "ms": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+          "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        }
+      }
+    },
     "axobject-query": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",

package.json

@@ -16,7 +16,8 @@
     "i18next-browser-languagedetector": "^4.1.1",
     "i18next-http-backend": "^1.0.10",
     "react-i18next": "^11.4.0",
-    "moment": "^2.25.3"
+    "moment": "^2.25.3",
+    "axios": "^0.19.2"
   },
   "scripts": {
     "start": "react-scripts start",

src/hooks/useAuthorizationToken.js

@@ -0,0 +1,7 @@
+import { useContext } from "react";
+import { ApplicationStateContext } from "../state/ApplicationContexts";
+
+export const useAuthorizationToken = () => {
+  const state = useContext(ApplicationStateContext);
+  return state.security.authorization.token;
+};

src/state/initialState.js

@@ -3,6 +3,11 @@ export const initialState = {
     userName: "",
     password: ""
   },
+  security: {
+    authorization: {
+      token: null
+    }
+  },
   network: {
     test: ""
   }

src/utils/axios.js

@@ -0,0 +1,73 @@
+import axios from "axios";
+import i18next from "i18next";
+import { useAuthorizationToken } from "../hooks/useAuthorizationToken";
+
+function getHeaders() {
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const token = useAuthorizationToken();
+  const language = i18next.language;
+
+  return {
+    "Content-Type": "application/json",
+    Authorization: `Basic ${token}`,
+    "Accept-Language": `${language}`
+  };
+}
+
+function internalRequest(url, options) {
+  return axios
+    .request(url, options)
+    .then(res => res.data)
+    .catch(function (error) {
+      if (error.response && error.response.data) {
+        throw (
+          {
+            ...error.response.data,
+            message: error.response.data.detail || error.response.data.title
+          } || error
+        );
+      }
+      // The request was made but no response was received
+      // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
+      // http.ClientRequest in node.js
+      throw error;
+    });
+}
+
+export function post(url, data) {
+  const options = {
+    method: "post",
+    data: JSON.stringify(data),
+    headers: getHeaders()
+  };
+
+  return internalRequest(url, options);
+}
+
+export function put(url, data) {
+  const options = {
+    method: "put",
+    data: JSON.stringify(data),
+    headers: getHeaders()
+  };
+
+  return internalRequest(url, options);
+}
+
+export function del(url, data) {
+  const options = {
+    method: "delete",
+    data: JSON.stringify(data),
+    headers: getHeaders()
+  };
+
+  return internalRequest(url, options);
+}
+
+export function get(url) {
+  const options = {
+    method: "GET",
+    headers: getHeaders()
+  };
+  return internalRequest(url, options);
+}