Fixed manual setup (alongside docker)

.dockerignore

@@ -4,5 +4,4 @@ api
 .dockerignore
 Dockerfile*
 node_modules
-media/**
-!media/explanation
+api/media

.gitignore

@@ -12,8 +12,7 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-media/**
-!media/explanation
+api/media
 api/.ash_history
 api/.config
 api/.cache/

README.md

@@ -42,20 +42,21 @@ The objective is to have a self-hosted place to keep useful links in one place,
 
 2. Clone this repository.
 
-4. [Optional] If you want to use this app across the network change `REACT_APP_API_HOST` in docker-compose.yml with the computer IP and port.
+4. [Optional] If you want to use this app across the network change `REACT_APP_API_HOST` in docker-compose.yml with the computer IP and API port.
 
 3. head to the main folder and run `docker compose up`.
 
 ### Manual Setup
-(Unstable for now.)
 
 1. Make sure your MongoDB database and collection is up and running.
 
-2. Edit [/src/config.js](src/config.js) accordingly.
+2. Edit [URI, Database name and Collection name](api/config.js) accordingly.
 
-3. Head to the main folder using terminal and run: `(cd api && npm install) && npm install --legacy-peer-deps` for the dependencies.
+3. [Optional] If you want to use this app across the network change [`API_HOST`](src/config.js) address with the computer IP and API port.
 
-4. Run `npm start` to start the application.
+4. Head to the main folder using terminal and run: `(cd api && npm install) && npm install --legacy-peer-deps` for the dependencies.
+
+5. Run `npm start` to start the application.
 
 ## LinkWarden Development
 

api/config.js

@@ -1,7 +1,7 @@
 module.exports.port = process.env.PORT || 5000;
-module.exports.URI = process.env.MONGODB_URI || 'mongodb://localhost:27017';
-module.exports.database = process.env.DB_NAME || 'sample_db';
-module.exports.collection = process.env.COLLECTION_NAME || 'list';
-const storageLocation = process.env.STORAGE_LOCATION || '/media';
-module.exports.screenshotDirectory = storageLocation + '/screenshots';
-module.exports.pdfDirectory = storageLocation + '/pdfs';
+module.exports.URI = process.env.MONGODB_URI || "mongodb://localhost:27017"; // URI
+module.exports.database = process.env.DB_NAME || "sample_db"; // Database name
+module.exports.collection = process.env.COLLECTION_NAME || "list"; // Collection name
+const storageLocation = process.env.STORAGE_LOCATION || "./media";
+module.exports.screenshotDirectory = storageLocation + "/screenshots";
+module.exports.pdfDirectory = storageLocation + "/pdfs";

api/server.js

@@ -4,7 +4,14 @@ const { MongoClient } = require("mongodb");
 const cors = require("cors");
 const getData = require("./modules/getData.js");
 const fs = require("fs");
-const { port, URI, database, collection, screenshotDirectory, pdfDirectory } = require("./config.js");
+const {
+  port,
+  URI,
+  database,
+  collection,
+  screenshotDirectory,
+  pdfDirectory,
+} = require("./config.js");
 const fetch = require("cross-fetch");
 const sanitize = require("sanitize-filename");
 
@@ -21,7 +28,6 @@ if (!fs.existsSync(pdfDirectory)) {
   fs.mkdirSync(pdfDirectory, { recursive: true });
 }
 
-
 app.use(cors());
 
 app.use(express.json());
@@ -33,7 +39,7 @@ app.get("/api", async (req, res) => {
 
 app.get("/screenshots/:id", async (req, res) => {
   res.sendFile(
-    screenshotDirectory + "/" + sanitize(req.params.id),
+    __dirname + "/" + screenshotDirectory + "/" + sanitize(req.params.id),
     (err) => {
       if (err) {
         res.sendFile(__dirname + "/pages/404.html");
@@ -43,14 +49,11 @@ app.get("/screenshots/:id", async (req, res) => {
 });
 
 app.get("/pdfs/:id", async (req, res) => {
-  res.sendFile(
-    pdfDirectory + "/" + sanitize(req.params.id),
-    (err) => {
-      if (err) {
-        res.sendFile(__dirname + "/pages/404.html");
-      }
+  res.sendFile(pdfDirectory + "/" + sanitize(req.params.id), (err) => {
+    if (err) {
+      res.sendFile(__dirname + "/pages/404.html");
     }
-  );
+  });
 });
 
 app.post("/api", async (req, res) => {
@@ -125,23 +128,17 @@ async function deleteDoc(doc) {
   try {
     const result = await list.deleteOne({ _id: doc });
 
-    fs.unlink(
-      screenshotDirectory + "/" + doc + ".png",
-      (err) => {
-        if (err) {
-          console.log(err);
-        }
+    fs.unlink(screenshotDirectory + "/" + doc + ".png", (err) => {
+      if (err) {
+        console.log(err);
       }
-    );
+    });
 
-    fs.unlink(
-      pdfDirectory +"/" + doc + ".pdf",
-      (err) => {
-        if (err) {
-          console.log(err);
-        }
+    fs.unlink(pdfDirectory + "/" + doc + ".pdf", (err) => {
+      if (err) {
+        console.log(err);
       }
-    );
+    });
 
     return result;
   } catch (err) {

docker-compose.yml

@@ -13,7 +13,6 @@ services:
       - MONGODB_URI=mongodb://mongo:27017/
       - PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
     volumes:
-      - ./media:/media
       - ./api:/home/node
     ports:
       - 5000:5000

media/explanation

@@ -1 +0,0 @@
-This is the archive storage (For docker).

src/App.js

@@ -146,8 +146,6 @@ function App() {
           />
         ) : null}
 
-        {numberOfResults === 0 ? <NoResults /> : null}
-
         {newBox ? (
           <AddItem
             SetLoader={SetLoader}
@@ -158,6 +156,8 @@ function App() {
           />
         ) : null}
 
+        {numberOfResults === 0 ? <NoResults /> : null}
+
         {loader ? <Loader lightMode={lightMode} /> : null}
       </div>
 

src/config.js

@@ -1 +1 @@
-export const API_HOST = process.env.REACT_APP_API_HOST || "";
+export const API_HOST = process.env.REACT_APP_API_HOST || "http://localhost:5000"; // API full address