Merge branch 'dev_v1-admin' into debian12_v1-admin

fix: update dependency reference for backend service in docker-compose

Docs/backend_API_docs/README.md

@@ -1,4 +1,4 @@
-# Backend API docs (apiV2)
+# Backend API docs
 
 If you want to cooperate with me, or build something new with my backend API, feel free to reach out!
 
@@ -6,51 +6,49 @@ On this page you will learn how my API works.
 
 ## General information
 
-When you look at my backend folder and file structure, you can see that I have two files called `API`. The first file called `api.js` which is for my web frontend, because this file works together with my JWT token service.
+When you look at my backend folder and file structure, you can see that I have two files called `API`. The first file called `api.js` is for my web frontend, because this file works together with my JWT token service.
 
-But I have built a second API. You can see the second API file in the same directory, the file is called `apiV2.js`.
+**\*But I have built a second API. You can see the second API file in the same directory, the file is called `apiV2.js`.**
 
-But first you have to get an API Key. You can get the API key from my admin dashboard. When you don't have any access to my admin dashboard, please contact your administrator or me.
+This is the file that you can use to build an API.
 
----
+But first you have to get the Admin API key, stored in an `.env` file on my server.
-
-## Base URL
-
-- Frontend: `https://insta.the1s.de`
-- Backend: `https://backend.insta.the1s.de`
-- Base path for this API: `https://backend.insta.the1s.de/apiV2`
-
-You can see the status of this and all my other services at `https://status.the1s.de`.
-
-_I have also build a [fallback page](https://git.the1s.de/theis.gaedigk/fallback-page). When only the application is down, you will see a friendly message and a link to the status page. (Only if the server is not down)_
 
 ---
 
 ## Authentication
 
-All endpoints require an API key as a path parameter named `:key`.
+All endpoints require the Admin API key (`ADMIN_ID`) as a URL parameter.
 
-Example: `/apiV2/items/:key`
+Example: `/apiV2/items/{ADMIN_ID}`
-
-If the key is missing or invalid, the API responds with `401 Unauthorized`.
 
 ---
 
-## Endpoints
+## URL
 
-### 1) Get all items
+- The frontend is currently running on `https://insta.the1s.de`.
 
-GET `/apiV2/items/:key`
+- The backend is currently running on `https://backend.insta.the1s.de`.
 
-Returns a list of all items wrapped in a `data` object.
+You can see the status of this and all my other services at `https://status.the1s.de`.
 
-Example request:
+---
+
+## Current endpoints
+
+### 1. Get All Items
+
+**GET** `/apiV2/items/:key`
+
+Returns a list of all items and their details.
+
+#### Example Request
 
 ```
-GET https://backend.insta.the1s.de/apiV2/items/12345
+GET https://backend.insta.the1s.de/apiV2/items/your_admin_key
 ```
 
-Example response:
+#### Example Response
 
 ```
 {
@@ -61,66 +59,206 @@ Example response:
       "can_borrow_role": 4,
       "inSafe": 1,
       "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 2,
+      "item_name": "DJI 2er Mikro 1",
+      "can_borrow_role": 4,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 3,
+      "item_name": "DJI 2er Mikro 2",
+      "can_borrow_role": 4,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 4,
+      "item_name": "Rode Richt Mikrofon",
+      "can_borrow_role": 2,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 5,
+      "item_name": "Kamera Stativ",
+      "can_borrow_role": 1,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 6,
+      "item_name": "SONY Kamera - inkl. Akkus und Objektiv",
+      "can_borrow_role": 1,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 7,
+      "item_name": "MacBook inkl. Adapter",
+      "can_borrow_role": 2,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 8,
+      "item_name": "SD Karten",
+      "can_borrow_role": 3,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 9,
+      "item_name": "Kameragimbal",
+      "can_borrow_role": 1,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 10,
+      "item_name": "ATEM MINI PRO",
+      "can_borrow_role": 1,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 11,
+      "item_name": "Handygimbal",
+      "can_borrow_role": 4,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 12,
+      "item_name": "Kameralfter",
+      "can_borrow_role": 1,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 13,
+      "item_name": "Kleine Kamera 1 - inkl. Objektiv",
+      "can_borrow_role": 2,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
+    },
+    {
+      "id": 14,
+      "item_name": "Kleine Kamera 2 - inkl. Objektiv",
+      "can_borrow_role": 2,
+      "inSafe": 1,
+      "entry_created_at": "2025-08-19T22:02:16.000Z"
     }
   ]
 }
 ```
 
-Fields:
+Each item has the following properties:
 
-- `id`: Unique identifier
+- `id`: The unique identifier for the item.
-- `item_name`: Item name
+- `item_name`: The name of the item.
-- `can_borrow_role`: Role allowed to borrow
+- `can_borrow_role`: The role ID that is allowed to borrow the item.
-- `inSafe`: 1 if in locker, 0 otherwise
+- `inSafe`: Indicates whether the item is currently in the locker (1) or not (0). This variable/state can change over time.
-- `entry_created_at`: Creation timestamp
 
-Status: 200 on success, 500 on failure.
+_You also get an http 200 status code._
 
 ---
 
-### 2) Change item safe state
+### 2. Change Item Safe State
 
-POST `/apiV2/controlInSafe/:key/:itemId/:state`
+**POST** `/apiV2/controlInSafe/:key/:itemId/:state`
 
-Updates `inSafe` (locker) state of an item.
+Updates the `inSafe` state of an item (whether it is in the locker).
 
-- `state` must be `"1"` (in safe) or `"0"` (not in safe)
+- `state` must be `"1"` (in safe) or `"0"` (not in safe).
 
-Example request:
+#### Example Request
 
 ```
-POST https://backend.insta.the1s.de/apiV2/controlInSafe/12345/123/1
+POST https://backend.insta.the1s.de/apiV2/controlInSafe/your_admin_key/item_id/new_item_state
 ```
 
-Example response (shape depends on database service):
+#### Example Response
 
 ```
-{ "data": { /* update result */ } }
+{}
 ```
 
-Status:
+_An empty object means, that the operation was successful and no further information is returned._
 
-- 200 on success
+_You also get an http 200 status code._
-- 400 if `state` is invalid
-- 500 on failure
-
-**You can get the item id on the admin panel, from your system administrator.**
 
 ---
 
-### 3) Get loan by code
+### 3. Set Return Date
 
-GET `/apiV2/getLoanByCode/:key/:loan_code`
+**POST** `/apiV2/setReturnDate/:key/:loan_code`
 
-Retrieves the details of a specific loan.
+Sets the `returned_date` of a loan to the current server time.
 
-Example request:
+- `loan_code`: The unique code of the loan.
+
+#### Example Request
 
 ```
-GET https://backend.insta.the1s.de/apiV2/getLoanByCode/12345/123456
+POST https://backend.insta.the1s.de/apiV2/setReturnDate/your_admin_key/your_loan_code
 ```
 
-Example response:
+#### Example Response
+
+```
+{}
+```
+
+_An empty object means, that the operation was successful and no further information is returned._
+
+_You also get an http 200 status code._
+
+---
+
+### 4. Set Take Date
+
+**POST** `/apiV2/setTakeDate/:key/:loan_code`
+
+Sets the `take_date` of a loan to the current server time.
+
+- `loan_code`: The unique code of the loan.
+
+#### Example Request
+
+```
+POST https://backend.insta.the1s.de/apiV2/setTakeDate/your_admin_key/your_loan_code
+```
+
+#### Example Response
+
+```
+{}
+```
+
+_An empty object means, that the operation was successful and no further information is returned._
+
+_You also get an http 2xx status code._
+
+---
+
+### 5. Get whole loan by loan code
+
+**POST** `/getLoanByCode/:key/:loan_code`
+
+Retrieves the details of a specific loan by its unique code.
+
+- `loan_code`: The unique code of the loan.
+
+#### Example Request
+
+```
+GET https://backend.insta.the1s.de/getLoanByCode/your_admin_key/your_loan_code
+```
+
+#### Example Response
 
 ```
 {
@@ -133,70 +271,36 @@ Example response:
     "take_date": null,
     "returned_date": null,
     "created_at": "2025-08-20T11:23:40.000Z",
-    "loaned_items_id": [8, 9],
+    "loaned_items_id": [
-    "loaned_items_name": ["SD Karten", "Kameragimbal"]
+      8,
+      9
+    ],
+    "loaned_items_name": [
+      "SD Karten",
+      "Kameragimbal"
+    ]
   }
 }
 ```
 
-Status:
+_You also get an http 200 status code._
 
-- 200 on success
+If the loan id does not exist, you will receive a 404 status code and an error message.
-- 404 if not found
+
+```
+{
+  "message": "Loan not found"
+}
+```
 
 ---
 
-### 4) Set return date (now) by loan code
+## Error Handling
 
-POST `/apiV2/setReturnDate/:key/:loan_code`
+- `403 Forbidden`: Invalid or missing API key.
-
+- `400 Bad Request`: Invalid parameters (e.g., wrong state value).
-Sets the `returned_date` to the current server time.
+- `500 Internal Server Error`: Database or server error.
-
-Example request:
-
-```
-POST https://backend.insta.the1s.de/apiV2/setReturnDate/12345/123456
-```
-
-Example response:
-
-```
-{ "data": { /* update result */ } }
-```
-
-Status: 200 on success, 500 on failure.
 
 ---
 
-### 5) Set take date (now) by loan code
+If you have questions or want to collaborate, please reach out to me!
-
-POST `/apiV2/setTakeDate/:key/:loan_code`
-
-Sets the `take_date` to the current server time.
-
-Example request:
-
-```
-POST https://backend.insta.the1s.de/apiV2/setTakeDate/12345/123456
-```
-
-Example response:
-
-```
-{ "data": { /* update result */ } }
-```
-
-Status: 200 on success, 500 on failure.
-
----
-
-## Error handling
-
-- 401 Unauthorized: Missing or invalid API key
-- 400 Bad Request: Invalid parameters (e.g., wrong state value)
-- 404 Not Found: Loan not found
-- 500 Internal Server Error: Database or server error
-
----
-
-If you have questions or want to collaborate, please reach out!

README.md

@@ -1,73 +1,7 @@
 # Borrow System
 
-![React](https://img.shields.io/badge/React-20232A?logo=react&logoColor=61DAFB)
+**You have reached the `debian12` branch.**
-![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?logo=typescript&logoColor=white)
-![Vite](https://img.shields.io/badge/Vite-646CFF?logo=vite&logoColor=white)
-![TailwindCSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?logo=tailwind-css&logoColor=white)
-![Node.js](https://img.shields.io/badge/Node.js-339933?logo=node.js&logoColor=white)
-![Express](https://img.shields.io/badge/Express-000000?logo=express&logoColor=white)
-![MySQL](https://img.shields.io/badge/MySQL-4479A1?logo=mysql&logoColor=white)
-![Docker](https://img.shields.io/badge/Docker-2496ED?logo=docker&logoColor=white)
-![JWT](https://img.shields.io/badge/JWT-000000?logo=jsonwebtokens&logoColor=white)
 
-A small full‑stack system to log in, view available items, reserve them for a time window, and manage personal loans.
+Here you will find the source code of exactly the application that I have hosted.
 
-- Frontend: React + TypeScript + Vite + Tailwind CSS
+The main branch or the branch that I am developing on, is the `dev` branch.
-- Backend: Node.js + Express + MySQL + JWT (jose)
-- Orchestration: Docker Compose (backend + MySQL)
-
-## Contents
-
-- Frontend: [frontend/](frontend)
-  - Vite/Tailwind config: [frontend/vite.config.ts](frontend/vite.config.ts), [frontend/tailwind.config.js](frontend/tailwind.config.js)
-  - App entry: [frontend/src/main.tsx](frontend/src/main.tsx), [frontend/src/App.tsx](frontend/src/App.tsx)
-  - UI: [frontend/src/layout/Layout.tsx](frontend/src/layout/Layout.tsx), [frontend/src/components](frontend/src/components)
-  - Data/utilities: [frontend/src/utils/fetchData.ts](frontend/src/utils/fetchData.ts), [frontend/src/utils/userHandler.ts](frontend/src/utils/userHandler.ts), [frontend/src/utils/toastify.ts](frontend/src/utils/toastify.ts)
-- Backend: [backend/](backend)
-  - Server: [backend/server.js](backend/server.js)
-  - Routes: [backend/routes/api.js](backend/routes/api.js), [backend/routes/apiV2.js](backend/routes/apiV2.js)
-  - DB + services: [backend/services/database.js](backend/services/database.js), [backend/services/tokenService.js](backend/services/tokenService.js)
-  - Schema/seed: [backend/scheme.sql](backend/scheme.sql)
-- Docs: [docs/](docs)
-  - API docs (see below): [docs/backend_API_docs/README.md](docs/backend_API_docs/README.md)
-
-## Features (high‑level)
-
-- Auth via JWT (login -> token cookie) using the backend route in [backend/routes/api.js](backend/routes/api.js).
-- After login, the app loads items, loans, and user loans and keeps them in localStorage.
-- Choose a date range to fetch borrowable items, select items, and create a loan.
-- Manage personal loans list (and delete a loan).
-
-Key frontend utilities:
-
-- [`utils.fetchData.fetchAllData`](frontend/src/utils/fetchData.ts): loads items, loans, and user loans after login.
-- [`utils.fetchData.getBorrowableItems`](frontend/src/utils/fetchData.ts): fetches borrowable items for the selected time range.
-- [`utils.userHandler.createLoan`](frontend/src/utils/userHandler.ts): creates a new loan for selected items.
-- [`utils.userHandler.handleDeleteLoan`](frontend/src/utils/userHandler.ts): deletes a loan and syncs local state.
-- [`utils.toastify.myToast`](frontend/src/utils/toastify.ts): toast notifications.
-
-UI flow (main screens):
-
-- Period selection: [frontend/src/components/Form1.tsx](frontend/src/components/Form1.tsx)
-- Borrowable items + selection: [frontend/src/components/Form2.tsx](frontend/src/components/Form2.tsx)
-- User loans table: [frontend/src/components/Form4.tsx](frontend/src/components/Form4.tsx)
-
-## Development
-
-- Scripts: see [frontend/package.json](frontend/package.json) and [backend/package.json](backend/package.json)
-  - Frontend: `npm run dev`, `npm run build`, `npm run preview`, `npm run lint`
-  - Backend: `npm start`
-- Linting: ESLint configured via [frontend/eslint.config.js](frontend/eslint.config.js)
-- TypeScript configs: [frontend/tsconfig.app.json](frontend/tsconfig.app.json), [frontend/tsconfig.node.json](frontend/tsconfig.node.json)
-
-## Configuration notes
-
-- Vite/Tailwind integration via [frontend/vite.config.ts](frontend/vite.config.ts) and `@tailwindcss/vite`; CSS entry uses `@import "tailwindcss"` in [frontend/src/index.css](frontend/src/index.css).
-- Toasts wired in [frontend/src/main.tsx](frontend/src/main.tsx) with `react-toastify`.
-- Local state is stored in `localStorage` keys: `allItems`, `allLoans`, `userLoans`, `borrowableItems`. Cross‑component updates are signaled via window events from [`utils.fetchData`](frontend/src/utils/fetchData.ts).
-
-## API documentation
-
-Refer to the dedicated API docs:
-
-`docs/backend_API_docs/README.md`

admin/src/Layout/Layout.tsx

@@ -19,7 +19,7 @@ const Layout: React.FC = () => {
 
     if (Cookies.get("token")) {
       const verifyToken = async () => {
-        const response = await fetch("http://localhost:8002/api/verifyToken", {
+        const response = await fetch("https://backend.insta.the1s.de/api/verifyToken", {
           method: "GET",
           headers: {
             Authorization: `Bearer ${Cookies.get("token")}`,

admin/src/components/API/Landingpage.tsx

@@ -57,7 +57,9 @@ const Landingpage: React.FC = () => {
     const fetchData = async () => {
       setIsLoading(true);
       try {
-        const loanRes = await fetch("http://localhost:8002/apiV2/allLoans");
+        const loanRes = await fetch(
+          "https://backend.insta.the1s.de/apiV2/allLoans"
+        );
         const loanData = await loanRes.json();
         if (Array.isArray(loanData)) {
           setLoans(loanData);
@@ -69,7 +71,9 @@ const Landingpage: React.FC = () => {
           );
         }
 
-        const deviceRes = await fetch("http://localhost:8002/apiV2/allItems");
+        const deviceRes = await fetch(
+          "https://backend.insta.the1s.de/apiV2/allItems"
+        );
         const deviceData = await deviceRes.json();
         if (Array.isArray(deviceData)) {
           setDevices(deviceData);

admin/src/components/ItemTable.tsx

@@ -77,7 +77,7 @@ const ItemTable: React.FC = () => {
     const fetchData = async () => {
       setIsLoading(true);
       try {
-        const response = await fetch("http://localhost:8002/api/allItems", {
+        const response = await fetch("https://backend.insta.the1s.de/api/allItems", {
           method: "GET",
           headers: {
             Authorization: `Bearer ${Cookies.get("token")}`,

admin/src/components/LoanTable.tsx

@@ -55,7 +55,7 @@ const LoanTable: React.FC = () => {
     const fetchData = async () => {
       setIsLoading(true);
       try {
-        const response = await fetch("http://localhost:8002/api/allLoans", {
+        const response = await fetch("https://backend.insta.the1s.de/api/allLoans", {
           method: "GET",
           headers: {
             Authorization: `Bearer ${Cookies.get("token")}`,

admin/src/utils/fetcher.ts

@@ -1,7 +1,7 @@
 import Cookies from "js-cookie";
 
 export const fetchUserData = async () => {
-  const response = await fetch("http://localhost:8002/api/allUsers", {
+  const response = await fetch("https://backend.insta.the1s.de/api/allUsers", {
     headers: {
       Authorization: `Bearer ${Cookies.get("token")}`,
     },

admin/src/utils/loginUser.ts

@@ -13,7 +13,7 @@ export const loginFunc = async (
   password: string
 ): Promise<LoginResult> => {
   try {
-    const response = await fetch("http://localhost:8002/api/loginAdmin", {
+    const response = await fetch("https://backend.insta.the1s.de/api/loginAdmin", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({ username, password }),

admin/src/utils/userActions.ts

@@ -3,7 +3,7 @@ import Cookies from "js-cookie";
 export const handleDelete = async (userId: number) => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/deleteUser/${userId}`,
+      `https://backend.insta.the1s.de/api/deleteUser/${userId}`,
       {
         method: "DELETE",
         headers: {
@@ -28,7 +28,7 @@ export const handleEdit = async (
 ) => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/editUser/${userId}`,
+      `https://backend.insta.the1s.de/api/editUser/${userId}`,
       {
         method: "POST",
         headers: {
@@ -54,14 +54,17 @@ export const createUser = async (
   password: string
 ) => {
   try {
-    const response = await fetch(`http://localhost:8002/api/createUser`, {
+    const response = await fetch(
-      method: "POST",
+      `https://backend.insta.the1s.de/api/createUser`,
-      headers: {
+      {
-        "Content-Type": "application/json",
+        method: "POST",
-        Authorization: `Bearer ${Cookies.get("token")}`,
+        headers: {
-      },
+          "Content-Type": "application/json",
-      body: JSON.stringify({ username, role, password }),
+          Authorization: `Bearer ${Cookies.get("token")}`,
-    });
+        },
+        body: JSON.stringify({ username, role, password }),
+      }
+    );
     if (!response.ok) {
       throw new Error("Failed to create user");
     }
@@ -74,14 +77,17 @@ export const createUser = async (
 
 export const changePW = async (newPassword: string, username: string) => {
   try {
-    const response = await fetch(`http://localhost:8002/api/changePWadmin`, {
+    const response = await fetch(
-      method: "POST",
+      `https://backend.insta.the1s.de/api/changePWadmin`,
-      headers: {
+      {
-        "Content-Type": "application/json",
+        method: "POST",
-        Authorization: `Bearer ${Cookies.get("token")}`,
+        headers: {
-      },
+          "Content-Type": "application/json",
-      body: JSON.stringify({ newPassword, username }),
+          Authorization: `Bearer ${Cookies.get("token")}`,
-    });
+        },
+        body: JSON.stringify({ newPassword, username }),
+      }
+    );
     if (!response.ok) {
       throw new Error("Failed to change password");
     }
@@ -95,7 +101,7 @@ export const changePW = async (newPassword: string, username: string) => {
 export const deleteLoan = async (loanId: number) => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/deleteLoan/${loanId}`,
+      `https://backend.insta.the1s.de/api/deleteLoan/${loanId}`,
       {
         method: "DELETE",
         headers: {
@@ -116,7 +122,7 @@ export const deleteLoan = async (loanId: number) => {
 export const deleteItem = async (itemId: number) => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/deleteItem/${itemId}`,
+      `https://backend.insta.the1s.de/api/deleteItem/${itemId}`,
       {
         method: "DELETE",
         headers: {
@@ -139,14 +145,17 @@ export const createItem = async (
   can_borrow_role: number
 ) => {
   try {
-    const response = await fetch(`http://localhost:8002/api/createItem`, {
+    const response = await fetch(
-      method: "POST",
+      `https://backend.insta.the1s.de/api/createItem`,
-      headers: {
+      {
-        "Content-Type": "application/json",
+        method: "POST",
-        Authorization: `Bearer ${Cookies.get("token")}`,
+        headers: {
-      },
+          "Content-Type": "application/json",
-      body: JSON.stringify({ item_name, can_borrow_role }),
+          Authorization: `Bearer ${Cookies.get("token")}`,
-    });
+        },
+        body: JSON.stringify({ item_name, can_borrow_role }),
+      }
+    );
     if (!response.ok) {
       throw new Error("Failed to create item");
     }
@@ -163,14 +172,17 @@ export const handleEditItems = async (
   can_borrow_role: string
 ) => {
   try {
-    const response = await fetch("http://localhost:8002/api/updateItemByID", {
+    const response = await fetch(
-      method: "POST",
+      "https://backend.insta.the1s.de/api/updateItemByID",
-      headers: {
+      {
-        "Content-Type": "application/json",
+        method: "POST",
-        Authorization: `Bearer ${Cookies.get("token")}`,
+        headers: {
-      },
+          "Content-Type": "application/json",
-      body: JSON.stringify({ itemId, item_name, can_borrow_role }),
+          Authorization: `Bearer ${Cookies.get("token")}`,
-    });
+        },
+        body: JSON.stringify({ itemId, item_name, can_borrow_role }),
+      }
+    );
     if (!response.ok) {
       throw new Error("Failed to edit item");
     }
@@ -184,7 +196,7 @@ export const handleEditItems = async (
 export const changeSafeState = async (itemId: number) => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/changeSafeState/${itemId}`,
+      `https://backend.insta.the1s.de/api/changeSafeState/${itemId}`,
       {
         method: "PUT",
         headers: {

admin/vite.config.ts

@@ -8,9 +8,13 @@ export default defineConfig({
   plugins: [react(), svgr(), tailwindcss(), tsconfigPaths()],
   server: {
     host: "0.0.0.0",
-    port: 8003,
+    allowedHosts: ["admin.insta.the1s.de"],
-    watch: {
+    port: 8103,
-      usePolling: true,
+    watch: { usePolling: true },
+    hmr: {
+      host: "admin.insta.the1s.de",
+      port: 8103,
+      protocol: "wss",
     },
   },
 });

backend/Dockerfile

@@ -7,6 +7,6 @@ RUN npm install
 
 COPY . .
 
-EXPOSE 8002
+EXPOSE 8102
 
 CMD ["npm", "start"]

backend/routes/apiV2.js

@@ -111,8 +111,8 @@ router.post("/setTakeDate/:key/:loan_code", apiKeyGuard, async (req, res) => {
   }
 });
 
-// Route for API to get ALL loans from the database without sensitive info (only for landingpage)
+// Route for API to get ALL loans from the database without sensitive info
-router.get("/allLoans", async (req, res) => {
+router.get("/allLoans/:key", apiKeyGuard, async (req, res) => {
   const result = await getAllLoansV2();
   if (result.success) {
     return res.status(200).json(result.data);
@@ -120,8 +120,8 @@ router.get("/allLoans", async (req, res) => {
   return res.status(500).json({ message: "Failed to fetch loans" });
 });
 
-// Route for API to get ALL items from the database (only for landingpage)
+// Route for API to get ALL items form the database
-router.get("/allItems", async (req, res) => {
+router.get("/allItems/:key", apiKeyGuard, async (req, res) => {
   const result = await getItemsFromDatabaseV2();
   if (result.success) {
     res.status(200).json(result.data);

backend/scheme.sql

@@ -63,7 +63,8 @@ CREATE TABLE `apiKeys` (
   `apiKey` int NOT NULL UNIQUE,
   `user` VARCHAR(255) NOT NULL,
   `entry_created_at` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
-  PRIMARY KEY (`id`)
+  PRIMARY KEY (`id`),
+  UNIQUE KEY `apiKey` (`apiKey`)
 );
 
 INSERT INTO `items` (`item_name`, `can_borrow_role`, `inSafe`) VALUES

backend/server.js

@@ -5,7 +5,7 @@ import apiRouter from "./routes/api.js";
 import apiRouterV2 from "./routes/apiV2.js";
 env.config();
 const app = express();
-const port = 8002;
+const port = 8102;
 
 app.use(cors());
 // Increase body size limits to support large CSV JSON payloads

backend/services/database.js

@@ -8,6 +8,7 @@ const pool = mysql
     user: process.env.DB_USER,
     password: process.env.DB_PASSWORD,
     database: process.env.DB_NAME,
+    port: process.env.DB_PORT,
   })
   .promise();
 

docker-compose.yml

@@ -1,35 +1,45 @@
 services:
-  #  borrow_system-frontend:
+  borrow_system-frontend:
-  #    container_name: borrow_system-frontend
+    container_name: borrow_system-frontend
-  #    build: ./frontend
+    build: ./frontend
-  #    ports:
+    ports:
-  #      - "8001:8001"
+      - "8101:8101"
-  #    environment:
+    networks:
-  #      - CHOKIDAR_USEPOLLING=true
+      - proxynet
-  #    volumes:
+      - borrow_system-internal
-  #      - ./frontend:/app
+    environment:
-  #      - /app/node_modules
+      - CHOKIDAR_USEPOLLING=true
-  #    restart: unless-stopped
+    volumes:
+      - ./frontend:/app
+      - /app/node_modules
+    restart: unless-stopped
 
-  #  admin-frontend:
+  admin-frontend:
-  #    container_name: admin-frontend
+    container_name: admin-frontend
-  #    build: ./admin
+    build: ./admin
-  #    ports:
+    networks:
-  #      - "8003:8003"
+      - proxynet
-  #    environment:
+      - borrow_system-internal
-  #      - CHOKIDAR_USEPOLLING=true
+    ports:
-  #    volumes:
+      - "8103:8103"
-  #      - ./admin:/app
+    environment:
-  #      - /app/node_modules
+      - CHOKIDAR_USEPOLLING=true
-  #    restart: unless-stopped
+    volumes:
+      - ./admin:/app
+      - /app/node_modules
+    restart: unless-stopped
 
   borrow_system-backend:
     container_name: borrow_system-backend
     build: ./backend
     ports:
-      - "8002:8002"
+      - "8102:8102"
+    networks:
+      - proxynet
+      - borrow_system-internal
     environment:
       DB_HOST: mysql
+      DB_PORT: 3306
       DB_USER: root
       DB_PASSWORD: ${DB_PASSWORD}
       DB_NAME: borrow_system
@@ -52,6 +62,14 @@ services:
       - ./mysql-timezone.cnf:/etc/mysql/conf.d/timezone.cnf:ro
     ports:
       - "3309:3306"
+    networks:
+      - borrow_system-internal
 
 volumes:
   mysql-data:
+
+networks:
+  proxynet:
+    external: true
+  borrow_system-internal:
+    external: false

frontend/Dockerfile

@@ -7,6 +7,6 @@ RUN npm install
 
 COPY . .
 
-EXPOSE 8001
+EXPOSE 8101
 
 CMD ["npm", "run", "dev"]

frontend/src/components/Form4.tsx

@@ -28,7 +28,7 @@ const formatDate = (iso: string | null) => {
 };
 
 async function fetchUserLoans(): Promise<Loan[]> {
-  const res = await fetch("http://localhost:8002/api/userLoans", {
+  const res = await fetch("https://backend.insta.the1s.de/api/userLoans", {
     method: "GET",
     headers: { Authorization: `Bearer ${Cookies.get("token") || ""}` },
   });

frontend/src/utils/fetchData.ts

@@ -25,7 +25,7 @@ export const fetchAllData = async (token: string | undefined) => {
   if (!token) return;
   // First we fetch all items that are potentially available for borrowing
   try {
-    const response = await fetch("http://localhost:8002/api/items", {
+    const response = await fetch("https://backend.insta.the1s.de/api/items", {
       method: "GET",
       headers: {
         Authorization: `Bearer ${token}`,
@@ -57,7 +57,7 @@ export const fetchAllData = async (token: string | undefined) => {
 
   // get all loans
   try {
-    const response = await fetch("http://localhost:8002/api/loans", {
+    const response = await fetch("https://backend.insta.the1s.de/api/loans", {
       method: "GET",
       headers: {
         Authorization: `Bearer ${token}`,
@@ -89,7 +89,7 @@ export const fetchAllData = async (token: string | undefined) => {
 
   // get user loans
   try {
-    const response = await fetch("http://localhost:8002/api/userLoans", {
+    const response = await fetch("https://backend.insta.the1s.de/api/userLoans", {
       method: "GET",
       headers: {
         Authorization: `Bearer ${token}`,
@@ -122,7 +122,7 @@ export const fetchAllData = async (token: string | undefined) => {
 
 export const loginUser = async (username: string, password: string) => {
   try {
-    const response = await fetch("http://localhost:8002/api/login", {
+    const response = await fetch("https://backend.insta.the1s.de/api/login", {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -158,7 +158,7 @@ export const getBorrowableItems = async () => {
   }
 
   try {
-    const response = await fetch("http://localhost:8002/api/borrowableItems", {
+    const response = await fetch("https://backend.insta.the1s.de/api/borrowableItems", {
       method: "POST",
       headers: {
         Authorization: `Bearer ${Cookies.get("token") || ""}`,

frontend/src/utils/userHandler.ts

@@ -5,7 +5,7 @@ import { queryClient } from "./queryClient";
 export const handleDeleteLoan = async (loanID: number): Promise<boolean> => {
   try {
     const response = await fetch(
-      `http://localhost:8002/api/deleteLoan/${loanID}`,
+      `https://backend.insta.the1s.de/api/deleteLoan/${loanID}`,
       {
         method: "DELETE",
         headers: {
@@ -75,14 +75,17 @@ export const rmFromRemove = (itemID: number) => {
 
 export const createLoan = async (startDate: string, endDate: string) => {
   const items = removeArr;
-  const response = await fetch("http://localhost:8002/api/createLoan", {
+  const response = await fetch(
-    method: "POST",
+    "https://backend.insta.the1s.de/api/createLoan",
-    headers: {
+    {
-      "Content-Type": "application/json",
+      method: "POST",
-      Authorization: `Bearer ${Cookies.get("token") || ""}`,
+      headers: {
-    },
+        "Content-Type": "application/json",
-    body: JSON.stringify({ items, startDate, endDate }),
+        Authorization: `Bearer ${Cookies.get("token") || ""}`,
-  });
+      },
+      body: JSON.stringify({ items, startDate, endDate }),
+    }
+  );
 
   if (!response.ok) {
     myToast("Fehler beim Erstellen der Ausleihe", "error");
@@ -103,7 +106,7 @@ export const createLoan = async (startDate: string, endDate: string) => {
 
 export const onReturn = async (loanID: number) => {
   const response = await fetch(
-    `http://localhost:8002/api/returnLoan/${loanID}`,
+    `https://backend.insta.the1s.de/api/returnLoan/${loanID}`,
     {
       method: "POST",
       headers: {
@@ -122,12 +125,15 @@ export const onReturn = async (loanID: number) => {
 };
 
 export const onTake = async (loanID: number) => {
-  const response = await fetch(`http://localhost:8002/api/takeLoan/${loanID}`, {
+  const response = await fetch(
-    method: "POST",
+    `https://backend.insta.the1s.de/api/takeLoan/${loanID}`,
-    headers: {
+    {
-      Authorization: `Bearer ${Cookies.get("token") || ""}`,
+      method: "POST",
-    },
+      headers: {
-  });
+        Authorization: `Bearer ${Cookies.get("token") || ""}`,
+      },
+    }
+  );
 
   if (!response.ok) {
     myToast("Fehler beim Ausleihen der Ausleihe", "error");
@@ -139,14 +145,17 @@ export const onTake = async (loanID: number) => {
 };
 
 export const changePW = async (oldPassword: string, newPassword: string) => {
-  const response = await fetch("http://localhost:8002/api/changePassword", {
+  const response = await fetch(
-    method: "POST",
+    "https://backend.insta.the1s.de/api/changePassword",
-    headers: {
+    {
-      "Content-Type": "application/json",
+      method: "POST",
-      Authorization: `Bearer ${Cookies.get("token") || ""}`,
+      headers: {
-    },
+        "Content-Type": "application/json",
-    body: JSON.stringify({ oldPassword, newPassword }),
+        Authorization: `Bearer ${Cookies.get("token") || ""}`,
-  });
+      },
+      body: JSON.stringify({ oldPassword, newPassword }),
+    }
+  );
 
   if (!response.ok) {
     myToast("Fehler beim Ändern des Passworts", "error");

frontend/vite.config.ts

@@ -1,15 +1,17 @@
 import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react";
-import svgr from "vite-plugin-svgr";
 import tailwindcss from "@tailwindcss/vite";
 
 export default defineConfig({
-  plugins: [react(), svgr(), tailwindcss()],
+  plugins: [tailwindcss()],
   server: {
     host: "0.0.0.0",
-    port: 8001,
+    allowedHosts: ["insta.the1s.de"],
-    watch: {
+    port: 8101,
-      usePolling: true,
+    watch: { usePolling: true },
+    hmr: {
+      host: "insta.the1s.de",
+      port: 8101,
+      protocol: "wss",
     },
   },
 });