Dockerize the app

src/App.js

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import "./styles/App.css";
 import List from "./componets/List";
 import AddItem from "./componets/AddItem";
-import config from "./config";
+import { API_HOST } from "./config";
 import Filters from "./componets/Filters";
 import sortList from "./modules/sortList";
 import filter from "./modules/filterData";
@@ -60,8 +60,7 @@ function App() {
   const tags = concatTags(data);
 
   async function fetchData() {
-    const ADDRESS = config.API.ADDRESS + ":" + config.API.PORT;
-    const res = await fetch(ADDRESS + "/api");
+    const res = await fetch(API_HOST + "/api");
     const resJSON = await res.json();
     const data = resJSON.reverse();
     setData(data);

src/componets/ViewArchived.js

@@ -1,11 +1,11 @@
 import "../styles/ViewArchived.css";
-import config from "../config";
+import { API_HOST } from "../config";
 
 const ViewArchived = ({ id }) => {
   const screenshotPath =
-    config.API.ADDRESS + ":" + config.API.PORT + "/screenshots/" + id + ".png";
+    API_HOST + "/screenshots/" + id + ".png";
   const pdfPath =
-    config.API.ADDRESS + ":" + config.API.PORT + "/pdfs/" + id + ".pdf";
+    API_HOST + "/pdfs/" + id + ".pdf";
 
   return (
     <div className="view-archived">

src/config.js

@@ -1,12 +1 @@
-// Note: the formatting are really sensitive so for example DO NOT end
-// the "STORAGE_LOCATION" path with an extra slash "/" (i.e. "/home/")
-module.exports = {
-  API: {
-    ADDRESS: "http://192.168.1.7", // IP address of the computer which LinkWarden is running
-    PORT: 5000, // The api port
-    MONGODB_URI: "mongodb://localhost:27017", // MongoDB link
-    DB_NAME: "sample_db", // MongoDB database name
-    COLLECTION_NAME: "list", // MongoDB collection name
-    STORAGE_LOCATION: "/home/danny/Documents", // The path to store the archived data
-  },
-};
+export const API_HOST = process.env.REACT_APP_API_HOST || "";

src/modules/deleteEntity.js

@@ -1,8 +1,7 @@
-import config from "../config";
+import { API_HOST } from "../config";
 
 const deleteEntity = (id, reFetch, onExit, SetLoader) => {
-  const ADDRESS = config.API.ADDRESS + ":" + config.API.PORT;
-  fetch(ADDRESS + "/api", {
+  fetch(API_HOST + "/api", {
     method: "DELETE",
     body: JSON.stringify({ id }),
     headers: {

src/modules/send.js

@@ -1,4 +1,4 @@
-import config from "../config";
+import { API_HOST } from "../config";
 import { nanoid } from "nanoid";
 
 const addItem = async (
@@ -28,8 +28,7 @@ const addItem = async (
   }
 
   if (isValidHttpUrl(link)) {
-    const ADDRESS = config.API.ADDRESS + ":" + config.API.PORT;
-    fetch(ADDRESS + "/api", {
+    fetch(API_HOST + "/api", {
       method: method,
       body: JSON.stringify({
         _id: id,