release: 0.18.2

* New translations en-us.ts (Japanese)

* New translations en-us.ts (Japanese)

* New translations en-us.ts (Japanese)

.github/ISSUE_TEMPLATE/language-request.yml

@@ -0,0 +1,19 @@
+name: "🌐 Language request"
+description: "You want to contribute to a language that isn't on Crowdin yet?"
+title: "🌐 Language request: <language name in english>"
+labels: [language-request]
+body:
+  - type: input
+    id: language-name-native
+    attributes:
+      label: "🌐 Language name (native)"
+      placeholder: "Schweizerdeutsch"
+    validations:
+      required: true
+  - type: input
+    id: language-code
+    attributes:
+      label: "🌐 Language code"
+      placeholder: "de-CH"
+    validations:
+      required: true

.github/workflows/build-docker-image.yml

@@ -1,4 +1,4 @@
-name: Create Docker Image
+name: Build and Push Docker Image
 
 on:
   release:
@@ -10,15 +10,25 @@ jobs:
     steps:
       - name: checkout code
         uses: actions/checkout@v3
+
       - name: Set up QEMU
         uses: docker/setup-qemu-action@v2
+
       - name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v2
-      - name: login to docker registry
-        run: echo "${{ secrets.DOCKER_PASSWORD }}" | docker login -u "${{ secrets.DOCKER_USERNAME }}" --password-stdin
-      - name: Build the image
-        run: |
-          docker buildx build --push \
-             --tag stonith404/pingvin-share:latest \
-             --tag stonith404/pingvin-share:${{  github.ref_name }} \
-             --platform linux/amd64,linux/arm64 .
+
+      - name: Login to Docker registry
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_PASSWORD }}
+
+      - name: Build and push
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: stonith404/pingvin-share:latest,stonith404/pingvin-share:${{  github.ref_name }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max

.gitignore

@@ -23,6 +23,7 @@ yarn-error.log*
 
 # env file
 .env
+!/backend/prisma/.env
 
 # vercel
 .vercel

CHANGELOG.md

@@ -1,3 +1,129 @@
+## [0.18.2](https://github.com/stonith404/pingvin-share/compare/v0.18.1...v0.18.2) (2023-10-09)
+
+
+### Bug Fixes
+
+* disable image optimizations for logo to prevent caching issues with custom logos ([3891900](https://github.com/stonith404/pingvin-share/commit/38919003e9091203b507d0f0b061f4a1835ff4f4))
+* memory leak while downloading large files ([97e7d71](https://github.com/stonith404/pingvin-share/commit/97e7d7190dfe219caf441dffcd7830c304c3c939))
+
+## [0.18.1](https://github.com/stonith404/pingvin-share/compare/v0.18.0...v0.18.1) (2023-09-22)
+
+
+### Bug Fixes
+
+* permission changes of docker container brakes existing installations ([6a4108e](https://github.com/stonith404/pingvin-share/commit/6a4108ed6138e7297e66fd1e38450f23afe99aae))
+
+## [0.18.0](https://github.com/stonith404/pingvin-share/compare/v0.17.5...v0.18.0) (2023-09-21)
+
+
+### Features
+
+* show upload modal on file drop ([13e7a30](https://github.com/stonith404/pingvin-share/commit/13e7a30bb96faeb25936ff08a107834fd7af5766))
+
+
+### Bug Fixes
+
+* **docker:** Updated to newest version of alpine linux and fixed missing dependencies ([#255](https://github.com/stonith404/pingvin-share/issues/255)) ([6fa7af7](https://github.com/stonith404/pingvin-share/commit/6fa7af79051c964060bd291c9faad90fc01a1b72))
+* nextjs proxy warning ([e9efbc1](https://github.com/stonith404/pingvin-share/commit/e9efbc17bcf4827e935e2018dcdf3b70a9a49991))
+
+## [0.17.5](https://github.com/stonith404/pingvin-share/compare/v0.17.4...v0.17.5) (2023-09-03)
+
+
+### Features
+
+* **localization:** Added thai language ([#231](https://github.com/stonith404/pingvin-share/issues/231)) ([bddb87b](https://github.com/stonith404/pingvin-share/commit/bddb87b9b3ec5426a3c7a14a96caf2eb45b93ff7))
+
+
+### Bug Fixes
+
+* autocomplete on create share modal ([d4e8d4f](https://github.com/stonith404/pingvin-share/commit/d4e8d4f58b9b7d10b865eff49aa784547891c4e8))
+* missing translation ([7647a9f](https://github.com/stonith404/pingvin-share/commit/7647a9f620cbc5d38e019225a680a53bd3027698))
+
+## [0.17.4](https://github.com/stonith404/pingvin-share/compare/v0.17.3...v0.17.4) (2023-08-01)
+
+
+### Bug Fixes
+
+* redirection to `localhost:3000` ([ea0d521](https://github.com/stonith404/pingvin-share/commit/ea0d5216e89346b8d3ef0277b76fdc6302e9de15))
+
+## [0.17.3](https://github.com/stonith404/pingvin-share/compare/v0.17.2...v0.17.3) (2023-07-31)
+
+
+### Bug Fixes
+
+* logo doesn't get loaded correctly ([9ba2b4c](https://github.com/stonith404/pingvin-share/commit/9ba2b4c82cdad9097b33f0451771818c7b972a6b))
+* share expiration never doesn't work if using another language than English ([a47d080](https://github.com/stonith404/pingvin-share/commit/a47d080657e1d08ef06ec7425d8bdafd5a26c24a))
+
+## [0.17.2](https://github.com/stonith404/pingvin-share/compare/v0.17.1...v0.17.2) (2023-07-31)
+
+
+### Bug Fixes
+
+* `ECONNREFUSED` with Docker ipv6 enabled ([c9a2a46](https://github.com/stonith404/pingvin-share/commit/c9a2a469c67d3c3cd08179b44e2bf82208f05177))
+
+## [0.17.1](https://github.com/stonith404/pingvin-share/compare/v0.17.0...v0.17.1) (2023-07-30)
+
+
+### Bug Fixes
+
+* rename pt-PT.ts to pt-BR.ts ([2584bb0](https://github.com/stonith404/pingvin-share/commit/2584bb0d48c761940eafc03d5cd98d47e7a5b0ae))
+
+## [0.17.0](https://github.com/stonith404/pingvin-share/compare/v0.16.1...v0.17.0) (2023-07-23)
+
+
+### Features
+
+* ability to define zip compression level ([7827b68](https://github.com/stonith404/pingvin-share/commit/7827b687fa022e86a2643e7a1951af8c7e80608c))
+* add note to language picker ([7f0c31c](https://github.com/stonith404/pingvin-share/commit/7f0c31c2e09b3ee9aae6c3dfb54fac2f2b1dfe23))
+* add share url alias `/s` ([231a2e9](https://github.com/stonith404/pingvin-share/commit/231a2e95b9734cf4704454e1945698753dbb378b))
+* localization ([#196](https://github.com/stonith404/pingvin-share/issues/196)) ([b9f6e3b](https://github.com/stonith404/pingvin-share/commit/b9f6e3bd08dcfc050048fba582b35958bc7b6184))
+* update default value of `maxSize` from `1073741824` to `1000000000` ([389dc87](https://github.com/stonith404/pingvin-share/commit/389dc87cac775d916d0cff9b71d3c5ff90bfe916))
+
+
+### Bug Fixes
+
+* confusion between GB and GiB ([5816b39](https://github.com/stonith404/pingvin-share/commit/5816b39fc6ef6fe6b7cf8e7925aa297561f5b796))
+* mistakes in English translations ([70b425b](https://github.com/stonith404/pingvin-share/commit/70b425b3807be79a3b518cc478996c71dffcf986))
+* wrong layout if button text is too long in modals ([f4c88ae](https://github.com/stonith404/pingvin-share/commit/f4c88aeb0823c2c18535c25fcf8e16afa8b53a56))
+
+### [0.16.1](https://github.com/stonith404/pingvin-share/compare/v0.16.0...v0.16.1) (2023-07-10)
+
+
+### Features
+
+* Adding reverse share ability to copy the link ([#191](https://github.com/stonith404/pingvin-share/issues/191)) ([7574eb3](https://github.com/stonith404/pingvin-share/commit/7574eb3191f21aadd64f436e9e7c78d3e3973a07)), closes [#178](https://github.com/stonith404/pingvin-share/issues/178) [#181](https://github.com/stonith404/pingvin-share/issues/181)
+* Adding reverse shares' shares a clickable link ([#190](https://github.com/stonith404/pingvin-share/issues/190)) ([0276294](https://github.com/stonith404/pingvin-share/commit/0276294f5219a7edcc762bc52391b6720cfd741d))
+
+
+### Bug Fixes
+
+* set link default value to random ([#192](https://github.com/stonith404/pingvin-share/issues/192)) ([a1ea7c0](https://github.com/stonith404/pingvin-share/commit/a1ea7c026594a54eafd52f764eecbf06e1bb4d4e)), closes [#178](https://github.com/stonith404/pingvin-share/issues/178) [#181](https://github.com/stonith404/pingvin-share/issues/181)
+
+## [0.16.0](https://github.com/stonith404/pingvin-share/compare/v0.15.0...v0.16.0) (2023-07-09)
+
+
+### Features
+
+* Adding more informations on My Shares page (table and modal) ([#174](https://github.com/stonith404/pingvin-share/issues/174)) ([1466240](https://github.com/stonith404/pingvin-share/commit/14662404614f15bc25384d924d8cb0458ab06cd8))
+* Adding the possibility of copying the link by clicking text and icons ([#171](https://github.com/stonith404/pingvin-share/issues/171)) ([348852c](https://github.com/stonith404/pingvin-share/commit/348852cfa4275f5c642669b43697f83c35333044))
+
+## [0.15.0](https://github.com/stonith404/pingvin-share/compare/v0.14.1...v0.15.0) (2023-05-09)
+
+
+### Features
+
+* add env variables for port, database url and data dir  ([98c0de7](https://github.com/stonith404/pingvin-share/commit/98c0de78e8a73e3e5bf0928226cfb8a024b566a1))
+* add healthcheck endpoint ([5132d17](https://github.com/stonith404/pingvin-share/commit/5132d177b8ab4e00a7e701e9956222fa2352d42c))
+* allow to configure clamav with environment variables ([1df5c71](https://github.com/stonith404/pingvin-share/commit/1df5c7123e4ca8695f4f1b7d49f46cdf147fb920))
+* configure ports, db url and api url with env variables ([e5071cb](https://github.com/stonith404/pingvin-share/commit/e5071cba1204093197b72e18d024b484e72e360a))
+
+### [0.14.1](https://github.com/stonith404/pingvin-share/compare/v0.14.0...v0.14.1) (2023-04-07)
+
+
+### Bug Fixes
+
+* boolean config variables can't be set to false ([39a7451](https://github.com/stonith404/pingvin-share/commit/39a74510c1f00466acaead39f7bee003b3db60d7))
+
 ## [0.14.0](https://github.com/stonith404/pingvin-share/compare/v0.13.1...v0.14.0) (2023-04-01)
 
 

CONTRIBUTING.md

@@ -1,4 +1,4 @@
-*Read this in another language: [Spanish](CONTRIBUTING.es.md), [English](CONTRIBUTING.md)* 
+_Read this in another language: [Spanish](/docs/CONTRIBUTING.es.md), [English](/CONTRIBUTING.md), [Simplified Chinese](/docs/CONTRIBUTING.zh-cn.md)_
 
 ---
 

Dockerfile

@@ -1,37 +1,40 @@
-# Using node slim because prisma ORM needs libc for ARM builds
-
-# Stage 1: on frontend dependency change
-FROM node:19-slim AS frontend-dependencies
+# Stage 1: Frontend dependencies
+FROM node:20-alpine AS frontend-dependencies
 WORKDIR /opt/app
 COPY frontend/package.json frontend/package-lock.json ./
 RUN npm ci
 
-# Stage 2: on frontend change
-FROM node:19-slim AS frontend-builder
+# Stage 2: Build frontend
+FROM node:20-alpine AS frontend-builder
 WORKDIR /opt/app
 COPY ./frontend .
 COPY --from=frontend-dependencies /opt/app/node_modules ./node_modules
 RUN npm run build
 
-# Stage 3: on backend dependency change
-FROM node:19-slim AS backend-dependencies
+# Stage 3: Backend dependencies
+FROM node:20-alpine AS backend-dependencies
 WORKDIR /opt/app
 COPY backend/package.json backend/package-lock.json ./
 RUN npm ci
 
-# Stage 4:on backend change
-FROM node:19-slim AS backend-builder
-RUN apt-get update && apt-get install -y openssl
+# Stage 4: Build backend
+FROM node:20-alpine AS backend-builder
 WORKDIR /opt/app
 COPY ./backend .
 COPY --from=backend-dependencies /opt/app/node_modules ./node_modules
 RUN npx prisma generate
-RUN npm run build  && npm prune --production
+RUN npm run build && npm prune --production
 
 # Stage 5: Final image
-FROM node:19-slim AS runner
+FROM node:20-alpine AS runner
 ENV NODE_ENV=docker
-RUN apt-get update && apt-get install -y openssl
+
+# Alpine specific dependencies
+RUN apk update --no-cache
+RUN apk upgrade --no-cache
+RUN apk add --no-cache curl nginx
+
+COPY ./nginx/nginx.conf /etc/nginx/nginx.conf
 
 WORKDIR /opt/app/frontend
 COPY --from=frontend-builder /opt/app/public ./public
@@ -46,5 +49,12 @@ COPY --from=backend-builder /opt/app/prisma ./prisma
 COPY --from=backend-builder /opt/app/package.json ./
 
 WORKDIR /opt/app
+
 EXPOSE 3000
-CMD cp -rn /tmp/img /opt/app/frontend/public && node frontend/server.js & cd backend && npm run prod
+
+# Add a health check to ensure the container is healthy
+HEALTHCHECK --interval=10s --timeout=3s CMD curl -f http://localhost:3000/api/health || exit 1
+
+# Application startup
+# HOSTNAME=0.0.0.0 fixes https://github.com/vercel/next.js/issues/51684. It can be removed as soon as the issue is fixed
+CMD cp -rn /tmp/img /opt/app/frontend/public && nginx && PORT=3333 HOSTNAME=0.0.0.0 node frontend/server.js & cd backend && npm run prod

README.md

@@ -2,7 +2,7 @@
 
 ---
 
-*Read this in another language: [Spanish](README.es.md), [English](README.md)* 
+_Read this in another language: [Spanish](/docs/README.es.md), [English](/README.md), [Simplified Chinese](/docs/README.zh-cn.md)_
 
 ---
 
@@ -63,6 +63,8 @@ npm run build
 pm2 start --name="pingvin-share-frontend" npm -- run start
 ```
 
+**Uploading Large Files**: By default, Pingvin Share uses a built-in reverse proxy to reduce the installation steps. However, this reverse proxy is not optimized for uploading large files. If you wish to upload larger files, you can either use the Docker installation or set up your own reverse proxy. An example configuration for Nginx can be found in `/nginx/nginx.conf`.
+
 The website is now listening on `http://localhost:3000`, have fun with Pingvin Share 🐧!
 
 ### Integrations
@@ -95,10 +97,11 @@ docker compose up -d
 #### Stand-alone
 
 1. Stop the running app
-    ```bash
-    pm2 stop pingvin-share-backend pingvin-share-frontend
-    ```
+   ```bash
+   pm2 stop pingvin-share-backend pingvin-share-frontend
+   ```
 2. Repeat the steps from the [installation guide](#stand-alone-installation) except the `git clone` step.
+
    ```bash
    cd pingvin-share
 
@@ -116,10 +119,42 @@ docker compose up -d
    pm2 restart pingvin-share-frontend
    ```
 
-### Custom branding
+### Configuration
 
-You can change the name and the logo of the app by visiting the admin configuration page.
+You can customize Pingvin Share by going to the configuration page in your admin dashboard.
+
+#### Environment variables
+
+For installation specific configuration, you can use environment variables. The following variables are available:
+
+##### Backend
+
+| Variable         | Default Value                                      | Description                            |
+| ---------------- | -------------------------------------------------- | -------------------------------------- |
+| `PORT`           | `8080`                                             | The port on which the backend listens. |
+| `DATABASE_URL`   | `file:../data/pingvin-share.db?connection_limit=1` | The URL of the SQLite database.        |
+| `DATA_DIRECTORY` | `./data`                                           | The directory where data is stored.    |
+| `CLAMAV_HOST`    | `127.0.0.1`                                        | The IP address of the ClamAV server.   |
+| `CLAMAV_PORT`    | `3310`                                             | The port number of the ClamAV server.  |
+
+##### Frontend
+
+| Variable  | Default Value           | Description                              |
+| --------- | ----------------------- | ---------------------------------------- |
+| `PORT`    | `3000`                  | The port on which the frontend listens.  |
+| `API_URL` | `http://localhost:8080` | The URL of the backend for the frontend. |
 
 ## 🖤 Contribute
 
-You're very welcome to contribute to Pingvin Share! Follow the [contribution guide](/CONTRIBUTING.md) to get started.
+### Translations
+
+You can help to translate Pingvin Share into your language.
+On [Crowdin](https://crowdin.com/project/pingvin-share) you can easily translate Pingvin Share online.
+
+Is your language not on Crowdin? Feel free to [Request it](https://github.com/stonith404/pingvin-share/issues/new?assignees=&labels=language-request&projects=&template=language-request.yml&title=%F0%9F%8C%90+Language+request%3A+%3Clanguage+name+in+english%3E).
+
+Any issues while translating? Feel free to participate in the [Localization discussion](https://github.com/stonith404/pingvin-share/discussions/198).
+
+### Project
+
+You're very welcome to contribute to Pingvin Share! Please follow the [contribution guide](/CONTRIBUTING.md) to get started.

backend/.prettierignore

@@ -0,0 +1 @@
+/src/constants.ts

backend/Dockerfile

@@ -1,22 +0,0 @@
-FROM node:18 AS deps
-WORKDIR /opt/app
-COPY package.json package-lock.json ./
-COPY prisma ./prisma
-RUN npm ci
-RUN npx prisma generate
-
-
-FROM node:18 As build
-WORKDIR /opt/app
-COPY . .
-COPY --from=deps /opt/app/node_modules ./node_modules
-RUN npm run build
-
-
-FROM node:18 As runner
-WORKDIR /opt/app
-COPY --from=build /opt/app/node_modules ./node_modules
-COPY --from=build /opt/app/dist ./dist
-COPY --from=build /opt/app/prisma ./prisma
-COPY --from=deps /opt/app/package.json ./
-CMD npm run prod

backend/package.json

@@ -1,28 +1,28 @@
 {
   "name": "pingvin-share-backend",
-  "version": "0.14.0",
+  "version": "0.18.2",
   "scripts": {
     "build": "nest build",
     "dev": "cross-env NODE_ENV=development nest start --watch",
     "prod": "prisma migrate deploy && prisma db seed && node dist/src/main",
     "lint": "eslint 'src/**/*.ts'",
-    "format": "prettier --write 'src/**/*.ts'",
+    "format": "prettier --end-of-line=auto --write 'src/**/*.ts'",
     "test:system": "prisma migrate reset -f && nest start & wait-on http://localhost:8080/api/configs && newman run ./test/newman-system-tests.json"
   },
   "prisma": {
     "seed": "ts-node prisma/seed/config.seed.ts"
   },
   "dependencies": {
-    "@nestjs/common": "^9.3.9",
-    "@nestjs/config": "^2.3.1",
-    "@nestjs/core": "^9.3.9",
-    "@nestjs/jwt": "^10.0.2",
-    "@nestjs/passport": "^9.0.3",
-    "@nestjs/platform-express": "^9.3.9",
-    "@nestjs/schedule": "^2.2.0",
-    "@nestjs/swagger": "^6.2.1",
-    "@nestjs/throttler": "^4.0.0",
-    "@prisma/client": "^4.11.0",
+    "@nestjs/common": "^10.1.2",
+    "@nestjs/config": "^3.0.0",
+    "@nestjs/core": "^10.1.2",
+    "@nestjs/jwt": "^10.1.0",
+    "@nestjs/passport": "^10.0.0",
+    "@nestjs/platform-express": "^10.1.2",
+    "@nestjs/schedule": "^3.0.1",
+    "@nestjs/swagger": "^7.1.4",
+    "@nestjs/throttler": "^4.2.1",
+    "@prisma/client": "^5.0.0",
     "archiver": "^5.3.1",
     "argon2": "^0.30.3",
     "body-parser": "^1.20.2",
@@ -33,48 +33,48 @@
     "cookie-parser": "^1.4.6",
     "mime-types": "^2.1.35",
     "moment": "^2.29.4",
-    "nodemailer": "^6.9.1",
+    "nodemailer": "^6.9.4",
     "otplib": "^12.0.1",
     "passport": "^0.6.0",
     "passport-jwt": "^4.0.1",
     "passport-local": "^1.0.0",
     "qrcode-svg": "^1.1.0",
     "reflect-metadata": "^0.1.13",
-    "rimraf": "^4.4.0",
-    "rxjs": "^7.8.0",
-    "sharp": "^0.31.3",
+    "rimraf": "^5.0.1",
+    "rxjs": "^7.8.1",
+    "sharp": "^0.32.4",
     "ts-node": "^10.9.1"
   },
   "devDependencies": {
-    "@nestjs/cli": "^9.2.0",
-    "@nestjs/schematics": "^9.0.4",
-    "@nestjs/testing": "^9.3.9",
-    "@types/archiver": "^5.3.1",
+    "@nestjs/cli": "^10.1.10",
+    "@nestjs/schematics": "^10.0.1",
+    "@nestjs/testing": "^10.1.2",
+    "@types/archiver": "^5.3.2",
     "@types/clamscan": "^2.0.4",
     "@types/cookie-parser": "^1.4.3",
-    "@types/cron": "^2.0.0",
+    "@types/cron": "^2.0.1",
     "@types/express": "^4.17.17",
     "@types/mime-types": "^2.1.1",
     "@types/multer": "^1.4.7",
-    "@types/node": "^18.15.0",
-    "@types/nodemailer": "^6.4.7",
-    "@types/passport-jwt": "^3.0.8",
+    "@types/node": "^20.4.5",
+    "@types/nodemailer": "^6.4.9",
+    "@types/passport-jwt": "^3.0.9",
     "@types/qrcode-svg": "^1.1.1",
     "@types/sharp": "^0.31.1",
     "@types/supertest": "^2.0.12",
-    "@typescript-eslint/eslint-plugin": "^5.54.1",
-    "@typescript-eslint/parser": "^5.54.1",
+    "@typescript-eslint/eslint-plugin": "^6.2.0",
+    "@typescript-eslint/parser": "^6.2.0",
     "cross-env": "^7.0.3",
-    "eslint": "^8.35.0",
-    "eslint-config-prettier": "^8.7.0",
-    "eslint-plugin-prettier": "^4.2.1",
+    "eslint": "^8.46.0",
+    "eslint-config-prettier": "^8.9.0",
+    "eslint-plugin-prettier": "^5.0.0",
     "newman": "^5.3.2",
-    "prettier": "^2.8.4",
-    "prisma": "^4.11.0",
+    "prettier": "^3.0.0",
+    "prisma": "^5.0.0",
     "source-map-support": "^0.5.21",
-    "ts-loader": "^9.4.2",
-    "tsconfig-paths": "4.1.2",
-    "typescript": "^4.9.5",
+    "ts-loader": "^9.4.4",
+    "tsconfig-paths": "4.2.0",
+    "typescript": "^5.1.6",
     "wait-on": "^7.0.1"
   }
 }

backend/prisma/.env

@@ -0,0 +1,2 @@
+#This file is only used to set a default value for the database url
+DATABASE_URL="file:../data/pingvin-share.db"

backend/prisma/migrations/20230718155819_remove_config_veriable_description/migration.sql

@@ -0,0 +1,27 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `description` on the `Config` table. All the data in the column will be lost.
+
+*/
+-- RedefineTables
+PRAGMA foreign_keys=OFF;
+CREATE TABLE "new_Config" (
+    "updatedAt" DATETIME NOT NULL,
+    "name" TEXT NOT NULL,
+    "category" TEXT NOT NULL,
+    "type" TEXT NOT NULL,
+    "defaultValue" TEXT NOT NULL DEFAULT '',
+    "value" TEXT,
+    "obscured" BOOLEAN NOT NULL DEFAULT false,
+    "secret" BOOLEAN NOT NULL DEFAULT true,
+    "locked" BOOLEAN NOT NULL DEFAULT false,
+    "order" INTEGER NOT NULL,
+
+    PRIMARY KEY ("name", "category")
+);
+INSERT INTO "new_Config" ("category", "defaultValue", "locked", "name", "obscured", "order", "secret", "type", "updatedAt", "value") SELECT "category", "defaultValue", "locked", "name", "obscured", "order", "secret", "type", "updatedAt", "value" FROM "Config";
+DROP TABLE "Config";
+ALTER TABLE "new_Config" RENAME TO "Config";
+PRAGMA foreign_key_check;
+PRAGMA foreign_keys=ON;

backend/prisma/schema.prisma

@@ -4,7 +4,7 @@ generator client {
 
 datasource db {
   provider = "sqlite"
-  url      = "file:../data/pingvin-share.db"
+  url      = env("DATABASE_URL")
 }
 
 model User {
@@ -136,7 +136,6 @@ model Config {
   type         String
   defaultValue String @default("")
   value        String?
-  description  String
   obscured     Boolean @default(false)
   secret       Boolean @default(true)
   locked       Boolean @default(false)

backend/prisma/seed/config.seed.ts

@@ -4,7 +4,6 @@ import * as crypto from "crypto";
 const configVariables: ConfigVariables = {
   internal: {
     jwtSecret: {
-      description: "Long random string used to sign JWT tokens",
       type: "string",
       defaultValue: crypto.randomBytes(256).toString("base64"),
       locked: true,
@@ -12,20 +11,16 @@ const configVariables: ConfigVariables = {
   },
   general: {
     appName: {
-      description: "Name of the application",
       type: "string",
       defaultValue: "Pingvin Share",
       secret: false,
     },
     appUrl: {
-      description: "On which URL Pingvin Share is available",
       type: "string",
       defaultValue: "http://localhost:3000",
-
       secret: false,
     },
     showHomePage: {
-      description: "Whether to show the home page",
       type: "boolean",
       defaultValue: "true",
       secret: false,
@@ -33,84 +28,64 @@ const configVariables: ConfigVariables = {
   },
   share: {
     allowRegistration: {
-      description: "Whether registration is allowed",
       type: "boolean",
       defaultValue: "true",
-
       secret: false,
     },
     allowUnauthenticatedShares: {
-      description: "Whether unauthorized users can create shares",
       type: "boolean",
       defaultValue: "false",
-
       secret: false,
     },
     maxSize: {
-      description: "Maximum share size in bytes",
       type: "number",
-      defaultValue: "1073741824",
-
+      defaultValue: "1000000000",
       secret: false,
     },
+    zipCompressionLevel: {
+      type: "number",
+      defaultValue: "9",
+    },
   },
   email: {
     enableShareEmailRecipients: {
-      description:
-        "Whether to allow emails to share recipients. Only enable this if you have enabled SMTP.",
       type: "boolean",
       defaultValue: "false",
 
       secret: false,
     },
     shareRecipientsSubject: {
-      description:
-        "Subject of the email which gets sent to the share recipients.",
       type: "string",
       defaultValue: "Files shared with you",
     },
     shareRecipientsMessage: {
-      description:
-        "Message which gets sent to the share recipients.\n\nAvailable variables:\n{creator} - The username of the creator of the share\n{shareUrl} - The URL of the share\n{desc} - The description of the share\n{expires} - The expiration date of the share\n\nVariables will be replaced with the actual values.",
       type: "text",
       defaultValue:
         "Hey!\n\n{creator} shared some files with you, view or download the files with this link: {shareUrl}\n\nThe share will expire {expires}.\n\nNote: {desc}\n\nShared securely with Pingvin Share 🐧",
     },
     reverseShareSubject: {
-      description:
-        "Subject of the email which gets sent when someone created a share with your reverse share link.",
       type: "string",
       defaultValue: "Reverse share link used",
     },
     reverseShareMessage: {
-      description:
-        "Message which gets sent when someone created a share with your reverse share link. {shareUrl} will be replaced with the creator's name and the share URL.",
       type: "text",
       defaultValue:
         "Hey!\n\nA share was just created with your reverse share link: {shareUrl}\n\nShared securely with Pingvin Share 🐧",
     },
     resetPasswordSubject: {
-      description:
-        "Subject of the email which gets sent when a user requests a password reset.",
       type: "string",
       defaultValue: "Pingvin Share password reset",
     },
     resetPasswordMessage: {
-      description:
-        "Message which gets sent when a user requests a password reset. {url} will be replaced with the reset password URL.",
       type: "text",
       defaultValue:
         "Hey!\n\nYou requested a password reset. Click this link to reset your password: {url}\nThe link expires in a hour.\n\nPingvin Share 🐧",
     },
     inviteSubject: {
-      description:
-        "Subject of the email which gets sent when an admin invites an user.",
       type: "string",
       defaultValue: "Pingvin Share invite",
     },
     inviteMessage: {
-      description:
-        "Message which gets sent when an admin invites an user. {url} will be replaced with the invite URL and {password} with the password.",
       type: "text",
       defaultValue:
         "Hey!\n\nYou were invited to Pingvin Share. Click this link to accept the invite: {url}\n\nYour password is: {password}\n\nPingvin Share 🐧",
@@ -118,34 +93,27 @@ const configVariables: ConfigVariables = {
   },
   smtp: {
     enabled: {
-      description:
-        "Whether SMTP is enabled. Only set this to true if you entered the host, port, email, user and password of your SMTP server.",
       type: "boolean",
       defaultValue: "false",
       secret: false,
     },
     host: {
-      description: "Host of the SMTP server",
       type: "string",
       defaultValue: "",
     },
     port: {
-      description: "Port of the SMTP server",
       type: "number",
       defaultValue: "0",
     },
     email: {
-      description: "Email address which the emails get sent from",
       type: "string",
       defaultValue: "",
     },
     username: {
-      description: "Username of the SMTP server",
       type: "string",
       defaultValue: "",
     },
     password: {
-      description: "Password of the SMTP server",
       type: "string",
       defaultValue: "",
       obscured: true,
@@ -162,7 +130,15 @@ type ConfigVariables = {
   };
 };
 
-const prisma = new PrismaClient();
+const prisma = new PrismaClient({
+  datasources: {
+    db: {
+      url:
+        process.env.DATABASE_URL ||
+        "file:../data/pingvin-share.db?connection_limit=1",
+    },
+  },
+});
 
 async function seedConfigVariables() {
   for (const [category, configVariablesOfCategory] of Object.entries(

backend/src/app.controller.ts

@@ -0,0 +1,19 @@
+import { Controller, Get, Res } from "@nestjs/common";
+import { Response } from "express";
+import { PrismaService } from "./prisma/prisma.service";
+
+@Controller("/")
+export class AppController {
+  constructor(private prismaService: PrismaService) {}
+
+  @Get("health")
+  async health(@Res({ passthrough: true }) res: Response) {
+    try {
+      await this.prismaService.config.findMany();
+      return "OK";
+    } catch {
+      res.statusCode = 500;
+      return "ERROR";
+    }
+  }
+}

backend/src/app.module.ts

@@ -14,6 +14,7 @@ import { ShareModule } from "./share/share.module";
 import { UserModule } from "./user/user.module";
 import { ClamScanModule } from "./clamscan/clamscan.module";
 import { ReverseShareModule } from "./reverseShare/reverseShare.module";
+import { AppController } from "./app.controller";
 
 @Module({
   imports: [
@@ -33,6 +34,9 @@ import { ReverseShareModule } from "./reverseShare/reverseShare.module";
     ClamScanModule,
     ReverseShareModule,
   ],
+  controllers:[
+    AppController,
+  ],
   providers: [
     {
       provide: APP_GUARD,

backend/src/auth/auth.controller.ts

@@ -33,14 +33,14 @@ export class AuthController {
   constructor(
     private authService: AuthService,
     private authTotpService: AuthTotpService,
-    private config: ConfigService
+    private config: ConfigService,
   ) {}
 
   @Post("signUp")
   @Throttle(10, 5 * 60)
   async signUp(
     @Body() dto: AuthRegisterDTO,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     if (!this.config.get("share.allowRegistration"))
       throw new ForbiddenException("Registration is not allowed");
@@ -50,7 +50,7 @@ export class AuthController {
     response = this.addTokensToResponse(
       response,
       result.refreshToken,
-      result.accessToken
+      result.accessToken,
     );
 
     return result;
@@ -61,7 +61,7 @@ export class AuthController {
   @HttpCode(200)
   async signIn(
     @Body() dto: AuthSignInDTO,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     const result = await this.authService.signIn(dto);
 
@@ -69,7 +69,7 @@ export class AuthController {
       response = this.addTokensToResponse(
         response,
         result.refreshToken,
-        result.accessToken
+        result.accessToken,
       );
     }
 
@@ -81,14 +81,14 @@ export class AuthController {
   @HttpCode(200)
   async signInTotp(
     @Body() dto: AuthSignInTotpDTO,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     const result = await this.authTotpService.signInTotp(dto);
 
     response = this.addTokensToResponse(
       response,
       result.refreshToken,
-      result.accessToken
+      result.accessToken,
     );
 
     return new TokenDTO().from(result);
@@ -113,12 +113,12 @@ export class AuthController {
   async updatePassword(
     @GetUser() user: User,
     @Res({ passthrough: true }) response: Response,
-    @Body() dto: UpdatePasswordDTO
+    @Body() dto: UpdatePasswordDTO,
   ) {
     const result = await this.authService.updatePassword(
       user,
       dto.oldPassword,
-      dto.password
+      dto.password,
     );
 
     response = this.addTokensToResponse(response, result.refreshToken);
@@ -129,12 +129,12 @@ export class AuthController {
   @HttpCode(200)
   async refreshAccessToken(
     @Req() request: Request,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     if (!request.cookies.refresh_token) throw new UnauthorizedException();
 
     const accessToken = await this.authService.refreshAccessToken(
-      request.cookies.refresh_token
+      request.cookies.refresh_token,
     );
     response = this.addTokensToResponse(response, undefined, accessToken);
     return new TokenDTO().from({ accessToken });
@@ -143,7 +143,7 @@ export class AuthController {
   @Post("signOut")
   async signOut(
     @Req() request: Request,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     await this.authService.signOut(request.cookies.access_token);
     response.cookie("access_token", "accessToken", { maxAge: -1 });
@@ -176,7 +176,7 @@ export class AuthController {
   private addTokensToResponse(
     response: Response,
     refreshToken?: string,
-    accessToken?: string
+    accessToken?: string,
   ) {
     if (accessToken)
       response.cookie("access_token", accessToken, { sameSite: "lax" });

backend/src/auth/auth.service.ts

@@ -21,7 +21,7 @@ export class AuthService {
     private prisma: PrismaService,
     private jwtService: JwtService,
     private config: ConfigService,
-    private emailService: EmailService
+    private emailService: EmailService,
   ) {}
 
   async signUp(dto: AuthRegisterDTO) {
@@ -39,7 +39,7 @@ export class AuthService {
       });
 
       const { refreshToken, refreshTokenId } = await this.createRefreshToken(
-        user.id
+        user.id,
       );
       const accessToken = await this.createAccessToken(user, refreshTokenId);
 
@@ -49,7 +49,7 @@ export class AuthService {
         if (e.code == "P2002") {
           const duplicatedField: string = e.meta.target[0];
           throw new BadRequestException(
-            `A user with this ${duplicatedField} already exists`
+            `A user with this ${duplicatedField} already exists`,
           );
         }
       }
@@ -78,7 +78,7 @@ export class AuthService {
     }
 
     const { refreshToken, refreshTokenId } = await this.createRefreshToken(
-      user.id
+      user.id,
     );
     const accessToken = await this.createAccessToken(user, refreshTokenId);
 
@@ -158,7 +158,7 @@ export class AuthService {
       {
         expiresIn: "15min",
         secret: this.config.get("internal.jwtSecret"),
-      }
+      },
     );
   }
 
@@ -189,7 +189,7 @@ export class AuthService {
 
     return this.createAccessToken(
       refreshTokenMetaData.user,
-      refreshTokenMetaData.id
+      refreshTokenMetaData.id,
     );
   }
 

backend/src/auth/authTotp.service.ts

@@ -18,7 +18,7 @@ export class AuthTotpService {
   constructor(
     private prisma: PrismaService,
     private authService: AuthService,
-    private config: ConfigService
+    private config: ConfigService,
   ) {}
 
   async signInTotp(dto: AuthSignInTotpDTO) {
@@ -72,7 +72,7 @@ export class AuthTotpService {
       await this.authService.createRefreshToken(user.id);
     const accessToken = await this.authService.createAccessToken(
       user,
-      refreshTokenId
+      refreshTokenId,
     );
 
     return { accessToken, refreshToken };
@@ -98,7 +98,7 @@ export class AuthTotpService {
     const otpURL = totp.keyuri(
       user.username || user.email,
       this.config.get("general.appName"),
-      secret
+      secret,
     );
 
     await this.prisma.user.update({

backend/src/auth/decorator/getUser.decorator.ts

@@ -5,5 +5,5 @@ export const GetUser = createParamDecorator(
     const request = ctx.switchToHttp().getRequest();
     const user = request.user;
     return data ? user?.[data] : user;
-  }
+  },
 );

backend/src/auth/strategy/jwt.strategy.ts

@@ -8,7 +8,10 @@ import { PrismaService } from "src/prisma/prisma.service";
 
 @Injectable()
 export class JwtStrategy extends PassportStrategy(Strategy) {
-  constructor(config: ConfigService, private prisma: PrismaService) {
+  constructor(
+    config: ConfigService,
+    private prisma: PrismaService,
+  ) {
     config.get("internal.jwtSecret");
     super({
       jwtFromRequest: JwtStrategy.extractJWT,

backend/src/clamscan/clamscan.service.ts

@@ -1,33 +1,35 @@
-import { Injectable } from "@nestjs/common";
+import { Injectable, Logger } from "@nestjs/common";
 import * as NodeClam from "clamscan";
 import * as fs from "fs";
 import { FileService } from "src/file/file.service";
 import { PrismaService } from "src/prisma/prisma.service";
+import { CLAMAV_HOST, CLAMAV_PORT, SHARE_DIRECTORY } from "../constants";
 
 const clamscanConfig = {
   clamdscan: {
-    host: process.env.NODE_ENV == "docker" ? "clamav" : "127.0.0.1",
-    port: 3310,
+    host: CLAMAV_HOST,
+    port: CLAMAV_PORT,
     localFallback: false,
   },
   preference: "clamdscan",
 };
-
 @Injectable()
 export class ClamScanService {
+  private readonly logger = new Logger(ClamScanService.name);
+
   constructor(
     private fileService: FileService,
-    private prisma: PrismaService
+    private prisma: PrismaService,
   ) {}
 
   private ClamScan: Promise<NodeClam | null> = new NodeClam()
     .init(clamscanConfig)
     .then((res) => {
-      console.log("ClamAV is active");
+      this.logger.log("ClamAV is active");
       return res;
     })
     .catch(() => {
-      console.log("ClamAV is not active");
+      this.logger.log("ClamAV is not active");
       return null;
     });
 
@@ -39,14 +41,14 @@ export class ClamScanService {
     const infectedFiles = [];
 
     const files = fs
-      .readdirSync(`./data/uploads/shares/${shareId}`)
+      .readdirSync(`${SHARE_DIRECTORY}/${shareId}`)
       .filter((file) => file != "archive.zip");
 
     for (const fileId of files) {
       const { isInfected } = await clamScan
-        .isInfected(`./data/uploads/shares/${shareId}/${fileId}`)
+        .isInfected(`${SHARE_DIRECTORY}/${shareId}/${fileId}`)
         .catch(() => {
-          console.log("ClamAV is not active");
+          this.logger.log("ClamAV is not active");
           return { isInfected: false };
         });
 
@@ -78,8 +80,8 @@ export class ClamScanService {
         },
       });
 
-      console.log(
-        `Share ${shareId} deleted because it contained ${infectedFiles.length} malicious file(s)`
+      this.logger.warn(
+        `Share ${shareId} deleted because it contained ${infectedFiles.length} malicious file(s)`,
       );
     }
   }

backend/src/config/config.controller.ts

@@ -28,7 +28,7 @@ export class ConfigController {
   constructor(
     private configService: ConfigService,
     private logoService: LogoService,
-    private emailService: EmailService
+    private emailService: EmailService,
   ) {}
 
   @Get()
@@ -41,7 +41,7 @@ export class ConfigController {
   @UseGuards(JwtGuard, AdministratorGuard)
   async getByCategory(@Param("category") category: string) {
     return new AdminConfigDTO().fromList(
-      await this.configService.getByCategory(category)
+      await this.configService.getByCategory(category),
     );
   }
 
@@ -49,7 +49,7 @@ export class ConfigController {
   @UseGuards(JwtGuard, AdministratorGuard)
   async updateMany(@Body() data: UpdateConfigDTO[]) {
     return new AdminConfigDTO().fromList(
-      await this.configService.updateMany(data)
+      await this.configService.updateMany(data),
     );
   }
 
@@ -66,9 +66,9 @@ export class ConfigController {
     @UploadedFile(
       new ParseFilePipe({
         validators: [new FileTypeValidator({ fileType: "image/png" })],
-      })
+      }),
     )
-    file: Express.Multer.File
+    file: Express.Multer.File,
   ) {
     return await this.logoService.create(file.buffer);
   }

backend/src/config/config.service.ts

@@ -11,12 +11,12 @@ import { PrismaService } from "src/prisma/prisma.service";
 export class ConfigService {
   constructor(
     @Inject("CONFIG_VARIABLES") private configVariables: Config[],
-    private prisma: PrismaService
+    private prisma: PrismaService,
   ) {}
 
   get(key: `${string}.${string}`): any {
     const configVariable = this.configVariables.filter(
-      (variable) => `${variable.category}.${variable.name}` == key
+      (variable) => `${variable.category}.${variable.name}` == key,
     )[0];
 
     if (!configVariable) throw new Error(`Config variable ${key} not found`);
@@ -81,7 +81,7 @@ export class ConfigService {
     if (!configVariable || configVariable.locked)
       throw new NotFoundException("Config variable not found");
 
-    if (value == "") {
+    if (value === "") {
       value = null;
     } else if (
       typeof value != configVariable.type &&
@@ -89,7 +89,7 @@ export class ConfigService {
       configVariable.type != "text"
     ) {
       throw new BadRequestException(
-        `Config variable must be of type ${configVariable.type}`
+        `Config variable must be of type ${configVariable.type}`,
       );
     }
 
@@ -100,7 +100,7 @@ export class ConfigService {
           name: key.split(".")[1],
         },
       },
-      data: { value: value ? value.toString() : null },
+      data: { value: value === null ? null : value.toString() },
     });
 
     this.configVariables = await this.prisma.config.findMany();

backend/src/config/dto/adminConfig.dto.ts

@@ -14,9 +14,6 @@ export class AdminConfigDTO extends ConfigDTO {
   @Expose()
   updatedAt: Date;
 
-  @Expose()
-  description: string;
-
   @Expose()
   obscured: boolean;
 
@@ -28,7 +25,7 @@ export class AdminConfigDTO extends ConfigDTO {
 
   fromList(partial: Partial<AdminConfigDTO>[]) {
     return partial.map((part) =>
-      plainToClass(AdminConfigDTO, part, { excludeExtraneousValues: true })
+      plainToClass(AdminConfigDTO, part, { excludeExtraneousValues: true }),
     );
   }
 }

backend/src/config/dto/config.dto.ts

@@ -12,7 +12,7 @@ export class ConfigDTO {
 
   fromList(partial: Partial<ConfigDTO>[]) {
     return partial.map((part) =>
-      plainToClass(ConfigDTO, part, { excludeExtraneousValues: true })
+      plainToClass(ConfigDTO, part, { excludeExtraneousValues: true }),
     );
   }
 }

backend/src/config/logo.service.ts

@@ -7,7 +7,8 @@ const IMAGES_PATH = "../frontend/public/img";
 @Injectable()
 export class LogoService {
   async create(file: Buffer) {
-    fs.writeFileSync(`${IMAGES_PATH}/logo.png`, file, "binary");
+    const resized = await sharp(file).resize(900).toBuffer();
+    fs.writeFileSync(`${IMAGES_PATH}/logo.png`, resized, "binary");
     this.createFavicon(file);
     this.createPWAIcons(file);
   }

backend/src/constants.ts

@@ -0,0 +1,9 @@
+export const DATA_DIRECTORY = process.env.DATA_DIRECTORY || "./data";
+export const SHARE_DIRECTORY = `${DATA_DIRECTORY}/uploads/shares`;
+export const DATABASE_URL =
+  process.env.DATABASE_URL ||
+  "file:../data/pingvin-share.db?connection_limit=1";
+export const CLAMAV_HOST =
+  process.env.CLAMAV_HOST ||
+  (process.env.NODE_ENV == "docker" ? "clamav" : "127.0.0.1");
+export const CLAMAV_PORT = parseInt(process.env.CLAMAV_PORT) || 3310;

backend/src/email/email.service.ts

@@ -32,7 +32,7 @@ export class EmailService {
     await this.getTransporter()
       .sendMail({
         from: `"${this.config.get("general.appName")}" <${this.config.get(
-          "smtp.email"
+          "smtp.email",
         )}>`,
         to: email,
         subject,
@@ -49,12 +49,12 @@ export class EmailService {
     shareId: string,
     creator?: User,
     description?: string,
-    expiration?: Date
+    expiration?: Date,
   ) {
     if (!this.config.get("email.enableShareEmailRecipients"))
       throw new InternalServerErrorException("Email service disabled");
 
-    const shareUrl = `${this.config.get("general.appUrl")}/share/${shareId}`;
+    const shareUrl = `${this.config.get("general.appUrl")}/s/${shareId}`;
 
     await this.sendMail(
       recipientEmail,
@@ -69,13 +69,13 @@ export class EmailService {
           "{expires}",
           moment(expiration).unix() != 0
             ? moment(expiration).fromNow()
-            : "in: never"
-        )
+            : "in: never",
+        ),
     );
   }
 
   async sendMailToReverseShareCreator(recipientEmail: string, shareId: string) {
-    const shareUrl = `${this.config.get("general.appUrl")}/share/${shareId}`;
+    const shareUrl = `${this.config.get("general.appUrl")}/s/${shareId}`;
 
     await this.sendMail(
       recipientEmail,
@@ -83,13 +83,13 @@ export class EmailService {
       this.config
         .get("email.reverseShareMessage")
         .replaceAll("\\n", "\n")
-        .replaceAll("{shareUrl}", shareUrl)
+        .replaceAll("{shareUrl}", shareUrl),
     );
   }
 
   async sendResetPasswordEmail(recipientEmail: string, token: string) {
     const resetPasswordUrl = `${this.config.get(
-      "general.appUrl"
+      "general.appUrl",
     )}/auth/resetPassword/${token}`;
 
     await this.sendMail(
@@ -98,7 +98,7 @@ export class EmailService {
       this.config
         .get("email.resetPasswordMessage")
         .replaceAll("\\n", "\n")
-        .replaceAll("{url}", resetPasswordUrl)
+        .replaceAll("{url}", resetPasswordUrl),
     );
   }
 
@@ -111,7 +111,7 @@ export class EmailService {
       this.config
         .get("email.inviteMessage")
         .replaceAll("{url}", loginUrl)
-        .replaceAll("{password}", password)
+        .replaceAll("{password}", password),
     );
   }
 
@@ -119,7 +119,7 @@ export class EmailService {
     await this.getTransporter()
       .sendMail({
         from: `"${this.config.get("general.appName")}" <${this.config.get(
-          "smtp.email"
+          "smtp.email",
         )}>`,
         to: recipientEmail,
         subject: "Test email",

backend/src/file/file.controller.ts

@@ -28,7 +28,7 @@ export class FileController {
     @Query() query: any,
 
     @Body() body: string,
-    @Param("shareId") shareId: string
+    @Param("shareId") shareId: string,
   ) {
     const { id, name, chunkIndex, totalChunks } = query;
 
@@ -39,7 +39,7 @@ export class FileController {
       data,
       { index: parseInt(chunkIndex), total: parseInt(totalChunks) },
       { id, name },
-      shareId
+      shareId,
     );
   }
 
@@ -47,7 +47,7 @@ export class FileController {
   @UseGuards(FileSecurityGuard)
   async getZip(
     @Res({ passthrough: true }) res: Response,
-    @Param("shareId") shareId: string
+    @Param("shareId") shareId: string,
   ) {
     const zip = this.fileService.getZip(shareId);
     res.set({
@@ -64,7 +64,7 @@ export class FileController {
     @Res({ passthrough: true }) res: Response,
     @Param("shareId") shareId: string,
     @Param("fileId") fileId: string,
-    @Query("download") download = "true"
+    @Query("download") download = "true",
   ) {
     const file = await this.fileService.get(shareId, fileId);
 

backend/src/file/file.service.ts

@@ -11,20 +11,21 @@ import * as fs from "fs";
 import * as mime from "mime-types";
 import { ConfigService } from "src/config/config.service";
 import { PrismaService } from "src/prisma/prisma.service";
+import { SHARE_DIRECTORY } from "../constants";
 
 @Injectable()
 export class FileService {
   constructor(
     private prisma: PrismaService,
     private jwtService: JwtService,
-    private config: ConfigService
+    private config: ConfigService,
   ) {}
 
   async create(
     data: string,
     chunk: { index: number; total: number },
     file: { id?: string; name: string },
-    shareId: string
+    shareId: string,
   ) {
     if (!file.id) file.id = crypto.randomUUID();
 
@@ -39,7 +40,7 @@ export class FileService {
     let diskFileSize: number;
     try {
       diskFileSize = fs.statSync(
-        `./data/uploads/shares/${shareId}/${file.id}.tmp-chunk`
+        `${SHARE_DIRECTORY}/${shareId}/${file.id}.tmp-chunk`,
       ).size;
     } catch {
       diskFileSize = 0;
@@ -61,7 +62,7 @@ export class FileService {
     // Check if share size limit is exceeded
     const fileSizeSum = share.files.reduce(
       (n, { size }) => n + parseInt(size),
-      0
+      0,
     );
 
     const shareSizeSum = fileSizeSum + diskFileSize + buffer.byteLength;
@@ -73,23 +74,23 @@ export class FileService {
     ) {
       throw new HttpException(
         "Max share size exceeded",
-        HttpStatus.PAYLOAD_TOO_LARGE
+        HttpStatus.PAYLOAD_TOO_LARGE,
       );
     }
 
     fs.appendFileSync(
-      `./data/uploads/shares/${shareId}/${file.id}.tmp-chunk`,
-      buffer
+      `${SHARE_DIRECTORY}/${shareId}/${file.id}.tmp-chunk`,
+      buffer,
     );
 
     const isLastChunk = chunk.index == chunk.total - 1;
     if (isLastChunk) {
       fs.renameSync(
-        `./data/uploads/shares/${shareId}/${file.id}.tmp-chunk`,
-        `./data/uploads/shares/${shareId}/${file.id}`
+        `${SHARE_DIRECTORY}/${shareId}/${file.id}.tmp-chunk`,
+        `${SHARE_DIRECTORY}/${shareId}/${file.id}`,
       );
       const fileSize = fs.statSync(
-        `./data/uploads/shares/${shareId}/${file.id}`
+        `${SHARE_DIRECTORY}/${shareId}/${file.id}`,
       ).size;
       await this.prisma.file.create({
         data: {
@@ -111,9 +112,7 @@ export class FileService {
 
     if (!fileMetaData) throw new NotFoundException("File not found");
 
-    const file = fs.createReadStream(
-      `./data/uploads/shares/${shareId}/${fileId}`
-    );
+    const file = fs.createReadStream(`${SHARE_DIRECTORY}/${shareId}/${fileId}`);
 
     return {
       metaData: {
@@ -126,13 +125,13 @@ export class FileService {
   }
 
   async deleteAllFiles(shareId: string) {
-    await fs.promises.rm(`./data/uploads/shares/${shareId}`, {
+    await fs.promises.rm(`${SHARE_DIRECTORY}/${shareId}`, {
       recursive: true,
       force: true,
     });
   }
 
   getZip(shareId: string) {
-    return fs.createReadStream(`./data/uploads/shares/${shareId}/archive.zip`);
+    return fs.createReadStream(`${SHARE_DIRECTORY}/${shareId}/archive.zip`);
   }
 }

backend/src/file/guard/fileSecurity.guard.ts

@@ -14,7 +14,7 @@ import { ShareService } from "src/share/share.service";
 export class FileSecurityGuard extends ShareSecurityGuard {
   constructor(
     private _shareService: ShareService,
-    private _prisma: PrismaService
+    private _prisma: PrismaService,
   ) {
     super(_shareService, _prisma);
   }
@@ -24,7 +24,7 @@ export class FileSecurityGuard extends ShareSecurityGuard {
 
     const shareId = Object.prototype.hasOwnProperty.call(
       request.params,
-      "shareId"
+      "shareId",
     )
       ? request.params.shareId
       : request.params.id;
@@ -52,7 +52,7 @@ export class FileSecurityGuard extends ShareSecurityGuard {
       if (share.security?.maxViews && share.security.maxViews <= share.views) {
         throw new ForbiddenException(
           "Maximum views exceeded",
-          "share_max_views_exceeded"
+          "share_max_views_exceeded",
         );
       }
 

backend/src/jobs/jobs.service.ts

@@ -1,17 +1,20 @@
-import { Injectable } from "@nestjs/common";
+import { Injectable, Logger } from "@nestjs/common";
 import { Cron } from "@nestjs/schedule";
 import * as fs from "fs";
 import * as moment from "moment";
 import { FileService } from "src/file/file.service";
 import { PrismaService } from "src/prisma/prisma.service";
 import { ReverseShareService } from "src/reverseShare/reverseShare.service";
+import { SHARE_DIRECTORY } from "../constants";
 
 @Injectable()
 export class JobsService {
+  private readonly logger = new Logger(JobsService.name);
+
   constructor(
     private prisma: PrismaService,
     private reverseShareService: ReverseShareService,
-    private fileService: FileService
+    private fileService: FileService,
   ) {}
 
   @Cron("0 * * * *")
@@ -34,8 +37,9 @@ export class JobsService {
       await this.fileService.deleteAllFiles(expiredShare.id);
     }
 
-    if (expiredShares.length > 0)
-      console.log(`job: deleted ${expiredShares.length} expired shares`);
+    if (expiredShares.length > 0) {
+      this.logger.log(`Deleted ${expiredShares.length} expired shares`);
+    }
   }
 
   @Cron("0 * * * *")
@@ -50,10 +54,11 @@ export class JobsService {
       await this.reverseShareService.remove(expiredReverseShare.id);
     }
 
-    if (expiredReverseShares.length > 0)
-      console.log(
-        `job: deleted ${expiredReverseShares.length} expired reverse shares`
+    if (expiredReverseShares.length > 0) {
+      this.logger.log(
+        `Deleted ${expiredReverseShares.length} expired reverse shares`,
       );
+    }
   }
 
   @Cron("0 0 * * *")
@@ -61,31 +66,31 @@ export class JobsService {
     let filesDeleted = 0;
 
     const shareDirectories = fs
-      .readdirSync("./data/uploads/shares", { withFileTypes: true })
+      .readdirSync(SHARE_DIRECTORY, { withFileTypes: true })
       .filter((dirent) => dirent.isDirectory())
       .map((dirent) => dirent.name);
 
     for (const shareDirectory of shareDirectories) {
       const temporaryFiles = fs
-        .readdirSync(`./data/uploads/shares/${shareDirectory}`)
+        .readdirSync(`${SHARE_DIRECTORY}/${shareDirectory}`)
         .filter((file) => file.endsWith(".tmp-chunk"));
 
       for (const file of temporaryFiles) {
         const stats = fs.statSync(
-          `./data/uploads/shares/${shareDirectory}/${file}`
+          `${SHARE_DIRECTORY}/${shareDirectory}/${file}`,
         );
         const isOlderThanOneDay = moment(stats.mtime)
           .add(1, "day")
           .isBefore(moment());
 
         if (isOlderThanOneDay) {
-          fs.rmSync(`./data/uploads/shares/${shareDirectory}/${file}`);
+          fs.rmSync(`${SHARE_DIRECTORY}/${shareDirectory}/${file}`);
           filesDeleted++;
         }
       }
     }
 
-    console.log(`job: deleted ${filesDeleted} temporary files`);
+    this.logger.log(`Deleted ${filesDeleted} temporary files`);
   }
 
   @Cron("0 * * * *")
@@ -107,7 +112,8 @@ export class JobsService {
     const deletedTokensCount =
       refreshTokenCount + loginTokenCount + resetPasswordTokenCount;
 
-    if (deletedTokensCount > 0)
-      console.log(`job: deleted ${deletedTokensCount} expired refresh tokens`);
+    if (deletedTokensCount > 0) {
+      this.logger.log(`Deleted ${deletedTokensCount} expired refresh tokens`);
+    }
   }
 }

backend/src/main.ts

@@ -6,6 +6,7 @@ import * as bodyParser from "body-parser";
 import * as cookieParser from "cookie-parser";
 import * as fs from "fs";
 import { AppModule } from "./app.module";
+import { DATA_DIRECTORY } from "./constants";
 
 async function bootstrap() {
   const app = await NestFactory.create<NestExpressApplication>(AppModule);
@@ -16,7 +17,9 @@ async function bootstrap() {
   app.use(cookieParser());
   app.set("trust proxy", true);
 
-  await fs.promises.mkdir("./data/uploads/_temp", { recursive: true });
+  await fs.promises.mkdir(`${DATA_DIRECTORY}/uploads/_temp`, {
+    recursive: true,
+  });
 
   app.setGlobalPrefix("api");
 
@@ -30,6 +33,6 @@ async function bootstrap() {
     SwaggerModule.setup("api/swagger", app, document);
   }
 
-  await app.listen(8080);
+  await app.listen(parseInt(process.env.PORT) || 8080);
 }
 bootstrap();

backend/src/prisma/prisma.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from "@nestjs/common";
 import { PrismaClient } from "@prisma/client";
+import { DATABASE_URL } from "../constants";
 
 @Injectable()
 export class PrismaService extends PrismaClient {
@@ -7,7 +8,7 @@ export class PrismaService extends PrismaClient {
     super({
       datasources: {
         db: {
-          url: "file:../data/pingvin-share.db?connection_limit=1",
+          url: DATABASE_URL,
         },
       },
     });

backend/src/reverseShare/dto/reverseShare.dto.ts

@@ -10,6 +10,9 @@ export class ReverseShareDTO {
   @Expose()
   shareExpiration: Date;
 
+  @Expose()
+  token: string;
+
   from(partial: Partial<ReverseShareDTO>) {
     return plainToClass(ReverseShareDTO, partial, {
       excludeExtraneousValues: true,

backend/src/reverseShare/dto/reverseShareTokenWithShares.ts

@@ -23,7 +23,7 @@ export class ReverseShareTokenWithShares extends OmitType(ReverseShareDTO, [
     return partial.map((part) =>
       plainToClass(ReverseShareTokenWithShares, part, {
         excludeExtraneousValues: true,
-      })
+      }),
     );
   }
 }

backend/src/reverseShare/reverseShare.controller.ts

@@ -23,7 +23,7 @@ import { ReverseShareService } from "./reverseShare.service";
 export class ReverseShareController {
   constructor(
     private reverseShareService: ReverseShareService,
-    private config: ConfigService
+    private config: ConfigService,
   ) {}
 
   @Post()
@@ -44,7 +44,7 @@ export class ReverseShareController {
     if (!isValid) throw new NotFoundException("Reverse share token not found");
 
     return new ReverseShareDTO().from(
-      await this.reverseShareService.getByToken(reverseShareToken)
+      await this.reverseShareService.getByToken(reverseShareToken),
     );
   }
 
@@ -52,7 +52,7 @@ export class ReverseShareController {
   @UseGuards(JwtGuard)
   async getAllByUser(@GetUser() user: User) {
     return new ReverseShareTokenWithShares().fromList(
-      await this.reverseShareService.getAllByUser(user.id)
+      await this.reverseShareService.getAllByUser(user.id),
     );
   }
 

backend/src/reverseShare/reverseShare.service.ts

@@ -10,7 +10,7 @@ export class ReverseShareService {
   constructor(
     private config: ConfigService,
     private prisma: PrismaService,
-    private fileService: FileService
+    private fileService: FileService,
   ) {}
 
   async create(data: CreateReverseShareDTO, creatorId: string) {
@@ -19,8 +19,8 @@ export class ReverseShareService {
       .add(
         data.shareExpiration.split("-")[0],
         data.shareExpiration.split(
-          "-"
-        )[1] as moment.unitOfTime.DurationConstructor
+          "-",
+        )[1] as moment.unitOfTime.DurationConstructor,
       )
       .toDate();
 
@@ -28,7 +28,7 @@ export class ReverseShareService {
 
     if (globalMaxShareSize < data.maxShareSize)
       throw new BadRequestException(
-        `Max share size can't be greater than ${globalMaxShareSize} bytes.`
+        `Max share size can't be greater than ${globalMaxShareSize} bytes.`,
       );
 
     const reverseShare = await this.prisma.reverseShare.create({

backend/src/share/dto/myShare.dto.ts

@@ -1,7 +1,13 @@
-import { Expose, plainToClass } from "class-transformer";
+import { Expose, plainToClass, Type } from "class-transformer";
 import { ShareDTO } from "./share.dto";
+import { FileDTO } from "../../file/dto/file.dto";
+import { OmitType } from "@nestjs/swagger";
 
-export class MyShareDTO extends ShareDTO {
+export class MyShareDTO extends OmitType(ShareDTO, [
+  "files",
+  "from",
+  "fromList",
+] as const) {
   @Expose()
   views: number;
 
@@ -11,13 +17,17 @@ export class MyShareDTO extends ShareDTO {
   @Expose()
   recipients: string[];
 
+  @Expose()
+  @Type(() => OmitType(FileDTO, ["share", "from"] as const))
+  files: Omit<FileDTO, "share" | "from">[];
+
   from(partial: Partial<MyShareDTO>) {
     return plainToClass(MyShareDTO, partial, { excludeExtraneousValues: true });
   }
 
   fromList(partial: Partial<MyShareDTO>[]) {
     return partial.map((part) =>
-      plainToClass(MyShareDTO, part, { excludeExtraneousValues: true })
+      plainToClass(MyShareDTO, part, { excludeExtraneousValues: true }),
     );
   }
 }

backend/src/share/dto/share.dto.ts

@@ -29,7 +29,7 @@ export class ShareDTO {
 
   fromList(partial: Partial<ShareDTO>[]) {
     return partial.map((part) =>
-      plainToClass(ShareDTO, part, { excludeExtraneousValues: true })
+      plainToClass(ShareDTO, part, { excludeExtraneousValues: true }),
     );
   }
 }

backend/src/share/guard/createShare.guard.ts

@@ -7,7 +7,7 @@ import { ReverseShareService } from "src/reverseShare/reverseShare.service";
 export class CreateShareGuard extends JwtGuard {
   constructor(
     configService: ConfigService,
-    private reverseShareService: ReverseShareService
+    private reverseShareService: ReverseShareService,
   ) {
     super(configService);
   }
@@ -21,7 +21,7 @@ export class CreateShareGuard extends JwtGuard {
     if (!reverseShareTokenId) return false;
 
     const isReverseShareTokenValid = await this.reverseShareService.isValid(
-      reverseShareTokenId
+      reverseShareTokenId,
     );
 
     return isReverseShareTokenValid;

backend/src/share/guard/shareOwner.guard.ts

@@ -16,7 +16,7 @@ export class ShareOwnerGuard implements CanActivate {
     const request: Request = context.switchToHttp().getRequest();
     const shareId = Object.prototype.hasOwnProperty.call(
       request.params,
-      "shareId"
+      "shareId",
     )
       ? request.params.shareId
       : request.params.id;

backend/src/share/guard/shareSecurity.guard.ts

@@ -14,7 +14,7 @@ import { ShareService } from "src/share/share.service";
 export class ShareSecurityGuard implements CanActivate {
   constructor(
     private shareService: ShareService,
-    private prisma: PrismaService
+    private prisma: PrismaService,
   ) {}
 
   async canActivate(context: ExecutionContext) {
@@ -22,7 +22,7 @@ export class ShareSecurityGuard implements CanActivate {
 
     const shareId = Object.prototype.hasOwnProperty.call(
       request.params,
-      "shareId"
+      "shareId",
     )
       ? request.params.shareId
       : request.params.id;
@@ -44,13 +44,13 @@ export class ShareSecurityGuard implements CanActivate {
     if (share.security?.password && !shareToken)
       throw new ForbiddenException(
         "This share is password protected",
-        "share_password_required"
+        "share_password_required",
       );
 
     if (!(await this.shareService.verifyShareToken(shareId, shareToken)))
       throw new ForbiddenException(
         "Share token required",
-        "share_token_required"
+        "share_token_required",
       );
 
     return true;

backend/src/share/guard/shareTokenSecurity.guard.ts

@@ -16,7 +16,7 @@ export class ShareTokenSecurity implements CanActivate {
     const request: Request = context.switchToHttp().getRequest();
     const shareId = Object.prototype.hasOwnProperty.call(
       request.params,
-      "shareId"
+      "shareId",
     )
       ? request.params.shareId
       : request.params.id;

backend/src/share/share.controller.ts

@@ -33,7 +33,7 @@ export class ShareController {
   @UseGuards(JwtGuard)
   async getMyShares(@GetUser() user: User) {
     return new MyShareDTO().fromList(
-      await this.shareService.getSharesByUser(user.id)
+      await this.shareService.getSharesByUser(user.id),
     );
   }
 
@@ -54,11 +54,11 @@ export class ShareController {
   async create(
     @Body() body: CreateShareDTO,
     @Req() request: Request,
-    @GetUser() user: User
+    @GetUser() user: User,
   ) {
     const { reverse_share_token } = request.cookies;
     return new ShareDTO().from(
-      await this.shareService.create(body, user, reverse_share_token)
+      await this.shareService.create(body, user, reverse_share_token),
     );
   }
 
@@ -74,7 +74,7 @@ export class ShareController {
   async complete(@Param("id") id: string, @Req() request: Request) {
     const { reverse_share_token } = request.cookies;
     return new ShareDTO().from(
-      await this.shareService.complete(id, reverse_share_token)
+      await this.shareService.complete(id, reverse_share_token),
     );
   }
 
@@ -91,7 +91,7 @@ export class ShareController {
   async getShareToken(
     @Param("id") id: string,
     @Res({ passthrough: true }) response: Response,
-    @Body() body: SharePasswordDto
+    @Body() body: SharePasswordDto,
   ) {
     const token = await this.shareService.getShareToken(id, body.password);
     response.cookie(`share_${id}_token`, token, {

backend/src/share/share.service.ts

@@ -16,6 +16,7 @@ import { EmailService } from "src/email/email.service";
 import { FileService } from "src/file/file.service";
 import { PrismaService } from "src/prisma/prisma.service";
 import { ReverseShareService } from "src/reverseShare/reverseShare.service";
+import { SHARE_DIRECTORY } from "../constants";
 import { CreateShareDTO } from "./dto/createShare.dto";
 
 @Injectable()
@@ -27,7 +28,7 @@ export class ShareService {
     private config: ConfigService,
     private jwtService: JwtService,
     private reverseShareService: ReverseShareService,
-    private clamScanService: ClamScanService
+    private clamScanService: ClamScanService,
   ) {}
 
   async create(share: CreateShareDTO, user?: User, reverseShareToken?: string) {
@@ -45,7 +46,7 @@ export class ShareService {
 
     // If share is created by a reverse share token override the expiration date
     const reverseShare = await this.reverseShareService.getByToken(
-      reverseShareToken
+      reverseShareToken,
     );
     if (reverseShare) {
       expirationDate = reverseShare.shareExpiration;
@@ -56,8 +57,8 @@ export class ShareService {
           .add(
             share.expiration.split("-")[0],
             share.expiration.split(
-              "-"
-            )[1] as moment.unitOfTime.DurationConstructor
+              "-",
+            )[1] as moment.unitOfTime.DurationConstructor,
           )
           .toDate();
       } else {
@@ -65,7 +66,7 @@ export class ShareService {
       }
     }
 
-    fs.mkdirSync(`./data/uploads/shares/${share.id}`, {
+    fs.mkdirSync(`${SHARE_DIRECTORY}/${share.id}`, {
       recursive: true,
     });
 
@@ -99,11 +100,11 @@ export class ShareService {
   }
 
   async createZip(shareId: string) {
-    const path = `./data/uploads/shares/${shareId}`;
+    const path = `${SHARE_DIRECTORY}/${shareId}`;
 
     const files = await this.prisma.file.findMany({ where: { shareId } });
     const archive = archiver("zip", {
-      zlib: { level: 9 },
+      zlib: { level: this.config.get("share.zipCompressionLevel") },
     });
     const writeStream = fs.createWriteStream(`${path}/archive.zip`);
 
@@ -133,13 +134,13 @@ export class ShareService {
 
     if (share.files.length == 0)
       throw new BadRequestException(
-        "You need at least on file in your share to complete it."
+        "You need at least on file in your share to complete it.",
       );
 
     // Asynchronously create a zip of all files
     if (share.files.length > 1)
       this.createZip(id).then(() =>
-        this.prisma.share.update({ where: { id }, data: { isZipReady: true } })
+        this.prisma.share.update({ where: { id }, data: { isZipReady: true } }),
       );
 
     // Send email for each recipient
@@ -149,7 +150,7 @@ export class ShareService {
         share.id,
         share.creator,
         share.description,
-        share.expiration
+        share.expiration,
       );
     }
 
@@ -160,7 +161,7 @@ export class ShareService {
     ) {
       await this.emailService.sendMailToReverseShareCreator(
         share.reverseShare.creator.email,
-        share.id
+        share.id,
       );
     }
 
@@ -194,7 +195,7 @@ export class ShareService {
       orderBy: {
         expiration: "desc",
       },
-      include: { recipients: true },
+      include: { recipients: true, files: true },
     });
 
     return shares.map((share) => {
@@ -284,7 +285,7 @@ export class ShareService {
     if (share.security?.maxViews && share.security.maxViews <= share.views) {
       throw new ForbiddenException(
         "Maximum views exceeded",
-        "share_max_views_exceeded"
+        "share_max_views_exceeded",
       );
     }
 
@@ -304,7 +305,7 @@ export class ShareService {
       {
         expiresIn: moment(expiration).diff(new Date(), "seconds") + "s",
         secret: this.config.get("internal.jwtSecret"),
-      }
+      },
     );
   }
 

backend/src/user/dto/updateOwnUser.dto.ts

@@ -2,5 +2,5 @@ import { OmitType, PartialType } from "@nestjs/swagger";
 import { UserDTO } from "./user.dto";
 
 export class UpdateOwnUserDTO extends PartialType(
-  OmitType(UserDTO, ["isAdmin", "password"] as const)
+  OmitType(UserDTO, ["isAdmin", "password"] as const),
 ) {}

backend/src/user/dto/user.dto.ts

@@ -31,7 +31,7 @@ export class UserDTO {
 
   fromList(partial: Partial<UserDTO>[]) {
     return partial.map((part) =>
-      plainToClass(UserDTO, part, { excludeExtraneousValues: true })
+      plainToClass(UserDTO, part, { excludeExtraneousValues: true }),
     );
   }
 }

backend/src/user/user.controller.ts

@@ -35,7 +35,7 @@ export class UserController {
   @UseGuards(JwtGuard)
   async updateCurrentUser(
     @GetUser() user: User,
-    @Body() data: UpdateOwnUserDTO
+    @Body() data: UpdateOwnUserDTO,
   ) {
     return new UserDTO().from(await this.userService.update(user.id, data));
   }
@@ -44,7 +44,7 @@ export class UserController {
   @UseGuards(JwtGuard)
   async deleteCurrentUser(
     @GetUser() user: User,
-    @Res({ passthrough: true }) response: Response
+    @Res({ passthrough: true }) response: Response,
   ) {
     response.cookie("access_token", "accessToken", { maxAge: -1 });
     response.cookie("refresh_token", "", {

backend/src/user/user.service.ts

@@ -11,7 +11,7 @@ import { UpdateUserDto } from "./dto/updateUser.dto";
 export class UserSevice {
   constructor(
     private prisma: PrismaService,
-    private emailService: EmailService
+    private emailService: EmailService,
   ) {}
 
   async list() {
@@ -46,7 +46,7 @@ export class UserSevice {
         if (e.code == "P2002") {
           const duplicatedField: string = e.meta.target[0];
           throw new BadRequestException(
-            `A user with this ${duplicatedField} already exists`
+            `A user with this ${duplicatedField} already exists`,
           );
         }
       }
@@ -66,7 +66,7 @@ export class UserSevice {
         if (e.code == "P2002") {
           const duplicatedField: string = e.meta.target[0];
           throw new BadRequestException(
-            `A user with this ${duplicatedField} already exists`
+            `A user with this ${duplicatedField} already exists`,
           );
         }
       }

crowdin.yml

@@ -0,0 +1,4 @@
+files:
+  - source: /frontend/src/i18n/translations/en-US.ts
+    translation: /%original_path%/%locale%.ts
+pull_request_title: "chore(translations): update translations via Crowdin"

docs/CONTRIBUTING.es.md

@@ -1,10 +1,10 @@
-*Leer esto en otro idioma: [Inglés](CONTRIBUTING.md), [Español](CONTRIBUTING.es.md)* 
+_Leer esto en otro idioma: [Inglés](/CONTRIBUTING.md), [Español](/docs/CONTRIBUTING.es.md), [Chino Simplificado](/docs/CONTRIBUTING.zh-cn.md)_
 
 ---
 
 # Contribuyendo
 
-¡Nos ❤️ encantaría que contribuyas a Pingvin Share y nos ayudes a hacerlo mejor! Todas las contribuciones son bienvenidas, incluyendo problemas, sugerencias, *pull requests* y más.
+¡Nos ❤️ encantaría que contribuyas a Pingvin Share y nos ayudes a hacerlo mejor! Todas las contribuciones son bienvenidas, incluyendo problemas, sugerencias, _pull requests_ y más.
 
 ## Para comenzar
 
@@ -15,17 +15,17 @@ Si encontraste un error, tienes una sugerencia o algo más, simplemente crea un
 Antes de enviar la pull request para su revisión, asegúrate de que:
 
 - El nombre de la pull request sigue las [especificaciones de Commits Convencionales](https://www.conventionalcommits.org/):
-  
+
   `<tipo>[ámbito opcional]: <descripción>`
-  
+
   ejemplo:
-  
+
   ```
   feat(share): agregar protección con contraseña
   ```
-  
+
   Donde `tipo` puede ser:
-  
+
   - **feat** - es una nueva función
   - **doc** - cambios solo en la documentación
   - **fix** - una corrección de error

docs/CONTRIBUTING.zh-cn.md

@@ -0,0 +1,97 @@
+_选择合适的语言阅读: [西班牙语](/docs/CONTRIBUTING.es.md), [英语](/CONTRIBUTING.md), [简体中文](/docs/CONTRIBUTING.zh-cn.md)_
+
+---
+
+# 提交贡献
+
+我们非常感谢你 ❤️ 为 Pingvin Share 提交贡献使其变得更棒! 欢迎任何形式的贡献，包括 issues, 建议, PRs 和其他形式
+
+## 小小的开始
+
+你找到了一个 bug，有新特性建议或者其他提议，请在 GitHub 建立一个 issue 以便我和你联络 😊
+
+## 提交一个 Pull Request
+
+在你提交 PR 前请确保
+
+- PR 的名字遵守 [Conventional Commits specification](https://www.conventionalcommits.org):
+
+  `<type>[optional scope]: <description>`
+
+  例如:
+
+  ```
+  feat(share): add password protection
+  ```
+
+  `TYPE` 可以是:
+
+  - **feat** - 这是一个新特性 feature
+  - **doc** - 仅仅改变了文档部分 documentation
+  - **fix** - 修复了一个 bug
+  - **refactor** - 更新了代码，但是并非出于增加新特性 feature 或修复 bug 的目的
+
+- 请在 PR 中附详细的解释说明
+- 使用 `npm run format` 格式化你的代码
+
+<details>
+  <summary>不知道怎么发起一个 PR？ 点开了解怎么发起一个 PR </summary>
+
+1. 点击 Pingvin Share 仓库的 `Fork` 按钮，复制一份你的仓库
+
+2. 通过 `git clone` 将你的仓库克隆到本地
+
+```
+$ git clone https://github.com/[你的用户名]/pingvin-share
+```
+
+3. 进行你的修改 - 提交 commit 你的修改 - 重复直到完成
+
+4. 将你的修改提交到 GitHub
+
+```
+$ git push origin [你的新分支的名字]
+```
+
+5. 提交你的代码以便代码审查
+
+   如果你进入你 fork 的 Github 仓库，你会看到一个 `Compare & pull request` 按钮，点击该按钮
+
+6. 发起一个 PR
+7. 点击 `Create pull request` 来提交你的 PR
+8. 等待代码审查，通过或以某些原因拒绝
+
+</details>
+
+## 配置开发项目
+
+Pingvin Share 包括前端和后端部分
+
+### 后端
+
+后端使用 [Nest.js](https://nestjs.com) 建立，使用 Typescript
+
+#### 搭建
+
+1. 打开 `backend` 文件夹
+2. 使用 `npm install` 安装依赖
+3. 通过 `npx prisma db push` 配置数据库结构
+4. 通过 `npx prisma db seed` 初始化数据库数据
+5. 通过 `npm run dev` 启动后端
+
+### 前端
+
+后端使用 [Next.js](https://nextjs.org) 建立，使用 Typescript
+
+#### 搭建
+
+1. 首先启动后端
+2. 打开 `frontend` 文件夹
+3. 通过 `npm install` 安装依赖
+4. 通过 `npm run dev` 启动前端
+
+开发项目配置完成
+
+### 测试
+
+目前阶段我们只有后端的系统测试，在 `backend` 文件夹运行 `npm run test:system` 来执行系统测试

docs/README.es.md

@@ -1,9 +1,8 @@
-
 # <div align="center"><img  src="https://user-images.githubusercontent.com/58886915/166198400-c2134044-1198-4647-a8b6-da9c4a204c68.svg" width="40"/> </br>Pingvin Share</div>
 
 ---
 
-*Leer esto en otro idioma: [Inglés](README.md), [Español](README.es.md)* 
+_Leer esto en otro idioma: [Inglés](/README.md), [Español](/docs/README.es.md), [Chino Simplificado](/docs/README.zh-cn.md)_
 
 ---
 
@@ -31,7 +30,7 @@ Pingvin Share es una plataforma de intercambio de archivos autoalojada y una alt
 
 ### Instalación con Docker (recomendada)
 
-1. Descarge el archivo `docker-compose.yml` 
+1. Descarge el archivo `docker-compose.yml`
 2. Ejecute `docker-compose up -d`
 
 El sitio web ahora está esperando conexiones en `http://localhost:3000`, ¡diviértase usando Pingvin Share 🐧!
@@ -96,24 +95,24 @@ docker compose up -d
 #### Instalación autónoma
 
 1. Deten la aplicación en ejecución
-   
+
    ```bash
    pm2 stop pingvin-share-backend pingvin-share-frontend
    ```
 
 2. Repite los pasos de la [guía de instalación](#instalación-autonoma) excepto el paso de `git clone`.
-   
+
    ```bash
    cd pingvin-share
-   
+
    # Consultar la última versión
    git fetch --tags && git checkout $(git describe --tags `git rev-list --tags --max-count=1`)
-   
+
    # Iniciar el backend
    cd backend
    npm run build
    pm2 restart pingvin-share-backend
-   
+
    # Iniciar frontend
    cd ../frontend
    npm run build

docs/README.zh-cn.md

@@ -0,0 +1,126 @@
+# <div align="center"><img  src="https://user-images.githubusercontent.com/58886915/166198400-c2134044-1198-4647-a8b6-da9c4a204c68.svg" width="40"/> </br>Pingvin Share</div>
+
+---
+
+_选择合适的语言阅读: [西班牙语](/docs/README.es.md), [英语](/README.md), [简体中文](/docs/README.zh-cn.md)_
+
+---
+
+Pingvin Share 是一个可自建的文件分享平台，是 WeTransfer 的一个替代品
+
+## ✨ 特性
+
+- 通过可自定义后缀的链接分享文件
+- 可自定义任意大小的文件上传限制 (受制于托管所在的硬盘大小)
+- 对共享链接设置有效期限
+- 对共享链接设置访问次数和访问密码
+- 通过邮件自动发送共享链接
+- 整合 ClamAV 进行反病毒检查
+
+## 🐧 了解一下 Pingvin Share
+
+- [示例网站](https://pingvin-share.dev.eliasschneider.com)
+- [DB Tech 推荐视频](https://www.youtube.com/watch?v=rWwNeZCOPJA)
+
+<img src="https://user-images.githubusercontent.com/58886915/225038319-b2ef742c-3a74-4eb6-9689-4207a36842a4.png" width="700"/>
+
+## ⌨️ 自建指南
+
+> 注意：Pingvin Share 仍处于开发阶段并且可能存在 bugs
+
+### Docker 部署 (推荐)
+
+1. 下载 `docker-compose.yml`
+2. 运行命令 `docker-compose up -d`
+
+现在网站运行在 `http://localhost:3000`，尝试一下你本地的 Pingvin Share 🐧!
+
+### Stand-alone 部署
+
+必须的依赖:
+
+- [Node.js](https://nodejs.org/en/download/) >= 16
+- [Git](https://git-scm.com/downloads)
+- [pm2](https://pm2.keymetrics.io/) 用于后台运行 Pingvin Share
+
+```bash
+git clone https://github.com/stonith404/pingvin-share
+cd pingvin-share
+
+# 获取最新的版本
+git fetch --tags && git checkout $(git describe --tags `git rev-list --tags --max-count=1`)
+
+# 启动后端 backend
+cd backend
+npm install
+npm run build
+pm2 start --name="pingvin-share-backend" npm -- run prod
+
+# 启动前端 frontend
+cd ../frontend
+npm install
+npm run build
+pm2 start --name="pingvin-share-frontend" npm -- run start
+```
+
+现在网站运行在 `http://localhost:3000`，尝试一下你本地的 Pingvin Share 🐧!
+
+### 整合组件
+
+#### ClamAV (仅限 Docker 部署)
+
+扫描上传文件中是否存在可疑文件，如果存在 ClamAV 会自动移除
+
+1. 在 docker-compose 配置中添加 ClamAV 容器 (见 `docker-compose.yml` 注释部分) 并启动容器
+2. Docker 会在启动 Pingvin Share 前启动 ClamAV，也许会花费 1-2 分钟
+3. Pingvin Share 日志中应该有 "ClamAV is active"
+
+请注意 ClamAV 会消耗很多 [系统资源(特别是内存)](https://docs.clamav.net/manual/Installing/Docker.html#memory-ram-requirements)
+
+### 更多资源
+
+- [群晖 NAS 配置](https://mariushosting.com/how-to-install-pingvin-share-on-your-synology-nas/)
+
+### 升级
+
+因为 Pingvin Share 仍处在开发阶段，在升级前请务必阅读 release notes 避免不可逆的改变
+
+#### Docker 升级
+
+```bash
+docker compose pull
+docker compose up -d
+```
+
+#### Stand-alone 升级
+
+1. 停止正在运行的 app
+   ```bash
+   pm2 stop pingvin-share-backend pingvin-share-frontend
+   ```
+2. 重复 [installation guide](#stand-alone-installation) 中的步骤，除了 `git clone` 这一步
+
+   ```bash
+   cd pingvin-share
+
+   # 获取最新的版本
+   git fetch --tags && git checkout $(git describe --tags `git rev-list --tags --max-count=1`)
+
+   # 启动后端 backend
+   cd backend
+   npm run build
+   pm2 restart pingvin-share-backend
+
+   # 启动前端 frontend
+   cd ../frontend
+   npm run build
+   pm2 restart pingvin-share-frontend
+   ```
+
+### 自定义品牌
+
+你可以在管理员配置页面改变网站的名字和 logo
+
+## 🖤 提交贡献
+
+非常欢迎向 Pingvin Share 提交贡献! 请阅读 [contribution guide](/CONTRIBUTING.md) 来提交你的贡献

frontend/.eslintrc.json

@@ -1,11 +1,17 @@
 {
-  "extends": ["eslint-config-next", "eslint:recommended", "prettier"],
+  "extends": [
+    "next",
+    "eslint-config-next",
+    "eslint:recommended",
+    "prettier"
+  ],
   "plugins": ["react"],
   "rules": {
     "quotes": ["warn", "double", { "allowTemplateLiterals": true }],
     "react-hooks/exhaustive-deps": ["off"],
     "import/no-anonymous-default-export": ["off"],
     "no-unused-vars": ["warn"],
-    "react/no-unescaped-entities": ["off"]
+    "react/no-unescaped-entities": ["off"],
+    "@next/next/no-img-element": ["off"]
   }
 }

frontend/.prettierignore

@@ -0,0 +1 @@
+/src/i18n/translations/*

frontend/next.config.js

@@ -1,5 +1,4 @@
 /** @type {import('next').NextConfig} */
-
 const { version } = require('./package.json');
 
 const withPWA = require("next-pwa")({
@@ -19,4 +18,7 @@ module.exports = withPWA({
   output: "standalone", env: {
     VERSION: version,
   },
+  serverRuntimeConfig: {
+    apiURL: process.env.API_URL ?? 'http://localhost:8080',
+  },
 });

frontend/package.json

@@ -1,52 +1,53 @@
 {
   "name": "pingvin-share-frontend",
-  "version": "0.14.0",
+  "version": "0.18.2",
   "scripts": {
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
-    "format": "prettier --write \"src/**/*.ts*\""
+    "format": "prettier --end-of-line=auto --write \"src/**/*.ts*\""
   },
   "dependencies": {
-    "@emotion/react": "^11.10.6",
-    "@emotion/server": "^11.10.0",
-    "@mantine/core": "^6.0.1",
-    "@mantine/dropzone": "^6.0.1",
-    "@mantine/form": "^6.0.1",
-    "@mantine/hooks": "^6.0.1",
-    "@mantine/modals": "^6.0.1",
-    "@mantine/next": "^6.0.1",
-    "@mantine/notifications": "^6.0.1",
-    "axios": "^1.3.4",
-    "cookies-next": "^2.1.1",
+    "@emotion/react": "^11.11.1",
+    "@emotion/server": "^11.11.0",
+    "@mantine/core": "^6.0.17",
+    "@mantine/dropzone": "^6.0.17",
+    "@mantine/form": "^6.0.17",
+    "@mantine/hooks": "^6.0.17",
+    "@mantine/modals": "^6.0.17",
+    "@mantine/next": "^6.0.17",
+    "@mantine/notifications": "^6.0.17",
+    "axios": "^1.4.0",
+    "cookies-next": "^2.1.2",
     "file-saver": "^2.0.5",
-    "jose": "^4.13.1",
+    "jose": "^4.14.4",
     "jwt-decode": "^3.1.2",
     "mime-types": "^2.1.35",
     "moment": "^2.29.4",
-    "next": "^13.2.4",
+    "next": "^13.4.12",
     "next-cookies": "^2.0.3",
     "next-http-proxy-middleware": "^1.2.5",
     "next-pwa": "^5.6.0",
     "p-limit": "^4.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-icons": "^4.8.0",
-    "sharp": "^0.31.3",
-    "yup": "^1.0.2"
+    "react-icons": "^4.10.1",
+    "react-intl": "^6.4.4",
+    "sharp": "^0.32.4",
+    "yup": "^1.2.0"
   },
   "devDependencies": {
     "@types/mime-types": "^2.1.1",
-    "@types/node": "18.15.0",
-    "@types/react": "18.0.28",
-    "@types/react-dom": "18.0.11",
-    "axios": "^1.3.4",
-    "eslint": "8.35.0",
-    "eslint-config-next": "^13.2.4",
-    "eslint-config-prettier": "^8.7.0",
-    "prettier": "^2.8.4",
-    "tar": "^6.1.13",
-    "typescript": "^4.9.5"
+    "@types/node": "20.4.5",
+    "@types/react": "18.2.17",
+    "@types/react-dom": "18.2.7",
+    "axios": "^1.4.0",
+    "eslint": "8.46.0",
+    "eslint-config-next": "^13.4.12",
+    "eslint-config-prettier": "^8.9.0",
+    "prettier": "^3.0.0",
+    "tar": "^6.1.15",
+    "typescript": "^5.1.6"
   }
 }

frontend/src/components/Logo.tsx

@@ -1,6 +1,4 @@
-import Image from "next/image";
-
 const Logo = ({ height, width }: { height: number; width: number }) => {
-  return <Image src="/img/logo.png" alt="logo" height={height} width={width} />;
+  return <img src="/img/logo.png" alt="logo" height={height} width={width} />;
 };
 export default Logo;

frontend/src/components/account/LanguagePicker.tsx

@@ -0,0 +1,36 @@
+import { Select } from "@mantine/core";
+import { getCookie, setCookie } from "cookies-next";
+import { useState } from "react";
+import useTranslate from "../../hooks/useTranslate.hook";
+import { LOCALES } from "../../i18n/locales";
+
+const LanguagePicker = () => {
+  const t = useTranslate();
+  const [selectedLanguage, setSelectedLanguage] = useState(
+    getCookie("language")?.toString(),
+  );
+
+  const languages = Object.values(LOCALES).map((locale) => ({
+    value: locale.code,
+    label: locale.name,
+  }));
+  return (
+    <Select
+      value={selectedLanguage}
+      description={t("account.card.language.description")}
+      onChange={(value) => {
+        setSelectedLanguage(value ?? "en");
+        setCookie("language", value, {
+          sameSite: "lax",
+          expires: new Date(
+            new Date().setFullYear(new Date().getFullYear() + 1),
+          ),
+        });
+        location.reload();
+      }}
+      data={languages}
+    />
+  );
+};
+
+export default LanguagePicker;

frontend/src/components/account/ThemeSwitcher.tsx

@@ -9,12 +9,12 @@ import {
 import { useColorScheme } from "@mantine/hooks";
 import { useState } from "react";
 import { TbDeviceLaptop, TbMoon, TbSun } from "react-icons/tb";
-import usePreferences from "../../hooks/usePreferences";
+import { FormattedMessage } from "react-intl";
+import userPreferences from "../../utils/userPreferences.util";
 
 const ThemeSwitcher = () => {
-  const preferences = usePreferences();
   const [colorScheme, setColorScheme] = useState(
-    preferences.get("colorScheme")
+    userPreferences.get("colorScheme"),
   );
   const { toggleColorScheme } = useMantineColorScheme();
   const systemColorScheme = useColorScheme();
@@ -23,10 +23,10 @@ const ThemeSwitcher = () => {
       <SegmentedControl
         value={colorScheme}
         onChange={(value) => {
-          preferences.set("colorScheme", value);
+          userPreferences.set("colorScheme", value);
           setColorScheme(value);
           toggleColorScheme(
-            value == "system" ? systemColorScheme : (value as ColorScheme)
+            value == "system" ? systemColorScheme : (value as ColorScheme),
           );
         }}
         data={[
@@ -34,7 +34,9 @@ const ThemeSwitcher = () => {
             label: (
               <Center>
                 <TbMoon size={16} />
-                <Box ml={10}>Dark</Box>
+                <Box ml={10}>
+                  <FormattedMessage id="account.theme.dark" />
+                </Box>
               </Center>
             ),
             value: "dark",
@@ -43,7 +45,9 @@ const ThemeSwitcher = () => {
             label: (
               <Center>
                 <TbSun size={16} />
-                <Box ml={10}>Light</Box>
+                <Box ml={10}>
+                  <FormattedMessage id="account.theme.light" />
+                </Box>
               </Center>
             ),
             value: "light",
@@ -52,7 +56,9 @@ const ThemeSwitcher = () => {
             label: (
               <Center>
                 <TbDeviceLaptop size={16} />
-                <Box ml={10}>System</Box>
+                <Box ml={10}>
+                  <FormattedMessage id="account.theme.system" />
+                </Box>
               </Center>
             ),
             value: "system",

frontend/src/components/account/showEnableTotpModal.tsx

@@ -1,8 +1,7 @@
 import {
   Button,
   Center,
-  Col,
-  Grid,
+  Group,
   Image,
   Stack,
   Text,
@@ -12,7 +11,11 @@ import {
 import { useForm, yupResolver } from "@mantine/form";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../hooks/useTranslate.hook";
 import authService from "../../services/auth.service";
 import toast from "../../utils/toast.util";
 
@@ -23,10 +26,11 @@ const showEnableTotpModal = (
     qrCode: string;
     secret: string;
     password: string;
-  }
+  },
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
-    title: "Enable TOTP",
+    title: t("account.modal.totp.title"),
     children: (
       <CreateEnableTotpModal options={options} refreshUser={refreshUser} />
     ),
@@ -45,6 +49,7 @@ const CreateEnableTotpModal = ({
   refreshUser: () => {};
 }) => {
   const modals = useModals();
+  const t = useTranslate();
 
   const validationSchema = yup.object().shape({
     code: yup
@@ -66,14 +71,19 @@ const CreateEnableTotpModal = ({
     <div>
       <Center>
         <Stack>
-          <Text>Step 1: Add your authenticator</Text>
+          <Text>
+            <FormattedMessage id="account.modal.totp.step1" />
+          </Text>
           <Image src={options.qrCode} alt="QR Code" />
 
           <Center>
-            <span>OR</span>
+            <span>
+              {" "}
+              <FormattedMessage id="common.text.or" />
+            </span>
           </Center>
 
-          <Tooltip label="Click to copy">
+          <Tooltip label={t("account.modal.totp.clickToCopy")}>
             <Button
               onClick={() => {
                 navigator.clipboard.writeText(options.secret);
@@ -84,38 +94,42 @@ const CreateEnableTotpModal = ({
             </Button>
           </Tooltip>
           <Center>
-            <Text fz="xs">Enter manually</Text>
+            <Text fz="xs"></Text>
           </Center>
 
-          <Text>Step 2: Validate your code</Text>
+          <Text>
+            <FormattedMessage id="account.modal.totp.step2" />
+          </Text>
 
           <form
             onSubmit={form.onSubmit((values) => {
               authService
                 .verifyTOTP(values.code, options.password)
                 .then(() => {
-                  toast.success("Successfully enabled TOTP");
+                  toast.success(t("account.notify.totp.enable"));
                   modals.closeAll();
                   refreshUser();
                 })
                 .catch(toast.axiosError);
             })}
           >
-            <Grid align="flex-end">
-              <Col xs={9}>
-                <TextInput
-                  variant="filled"
-                  label="Code"
-                  placeholder="******"
-                  {...form.getInputProps("code")}
-                />
-              </Col>
-              <Col xs={3}>
-                <Button variant="outline" type="submit">
-                  Verify
-                </Button>
-              </Col>
-            </Grid>
+            <Group align="end">
+              <TextInput
+                style={{ flex: "1" }}
+                variant="filled"
+                label={t("account.modal.totp.code")}
+                placeholder="******"
+                {...form.getInputProps("code")}
+              />
+
+              <Button
+                style={{ flex: "0 0 auto" }}
+                variant="outline"
+                type="submit"
+              >
+                <FormattedMessage id="account.modal.totp.verify" />
+              </Button>
+            </Group>
           </form>
         </Stack>
       </Center>

frontend/src/components/account/showReverseShareLinkModal.tsx

@@ -0,0 +1,22 @@
+import { Stack, TextInput } from "@mantine/core";
+import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { translateOutsideContext } from "../../hooks/useTranslate.hook";
+
+const showReverseShareLinkModal = (
+  modals: ModalsContextProps,
+  reverseShareToken: string,
+  appUrl: string,
+) => {
+  const t = translateOutsideContext();
+  const link = `${appUrl}/upload/${reverseShareToken}`;
+  return modals.openModal({
+    title: t("account.reverseShares.modal.reverse-share-link"),
+    children: (
+      <Stack align="stretch">
+        <TextInput variant="filled" value={link} />
+      </Stack>
+    ),
+  });
+};
+
+export default showReverseShareLinkModal;

frontend/src/components/account/showShareInformationsModal.tsx

@@ -0,0 +1,99 @@
+import { Divider, Flex, Progress, Stack, Text } from "@mantine/core";
+import { ModalsContextProps } from "@mantine/modals/lib/context";
+import moment from "moment";
+import { FormattedMessage } from "react-intl";
+import { translateOutsideContext } from "../../hooks/useTranslate.hook";
+import { FileMetaData } from "../../types/File.type";
+import { MyShare } from "../../types/share.type";
+import { byteToHumanSizeString } from "../../utils/fileSize.util";
+import CopyTextField from "../upload/CopyTextField";
+
+const showShareInformationsModal = (
+  modals: ModalsContextProps,
+  share: MyShare,
+  appUrl: string,
+  maxShareSize: number,
+) => {
+  const t = translateOutsideContext();
+  const link = `${appUrl}/s/${share.id}`;
+
+  let shareSize: number = 0;
+  for (let file of share.files as FileMetaData[])
+    shareSize += parseInt(file.size);
+
+  const formattedShareSize = byteToHumanSizeString(shareSize);
+  const formattedMaxShareSize = byteToHumanSizeString(maxShareSize);
+  const shareSizeProgress = (shareSize / maxShareSize) * 100;
+
+  const formattedCreatedAt = moment(share.createdAt).format("LLL");
+  const formattedExpiration =
+    moment(share.expiration).unix() === 0
+      ? "Never"
+      : moment(share.expiration).format("LLL");
+
+  return modals.openModal({
+    title: t("account.shares.modal.share-informations"),
+
+    children: (
+      <Stack align="stretch" spacing="md">
+        <Text size="sm" color="lightgray">
+          <b>
+            <FormattedMessage id="account.shares.table.id" />:{" "}
+          </b>
+          {share.id}
+        </Text>
+
+        <Text size="sm" color="lightgray">
+          <b>
+            <FormattedMessage id="account.shares.table.description" />:{" "}
+          </b>
+          {share.description || "No description"}
+        </Text>
+
+        <Text size="sm" color="lightgray">
+          <b>
+            <FormattedMessage id="account.shares.table.createdAt" />:{" "}
+          </b>
+          {formattedCreatedAt}
+        </Text>
+
+        <Text size="sm" color="lightgray">
+          <b>
+            <FormattedMessage id="account.shares.table.expiresAt" />:{" "}
+          </b>
+          {formattedExpiration}
+        </Text>
+        <Divider />
+        <CopyTextField link={link} />
+        <Divider />
+        <Text size="sm" color="lightgray">
+          <b>
+            <FormattedMessage id="account.shares.table.size" />:{" "}
+          </b>
+          {formattedShareSize} / {formattedMaxShareSize} (
+          {shareSizeProgress.toFixed(1)}%)
+        </Text>
+
+        <Flex align="center" justify="center">
+          {shareSize / maxShareSize < 0.1 && (
+            <Text size="xs" color="lightgray" style={{ marginRight: "4px" }}>
+              {formattedShareSize}
+            </Text>
+          )}
+          <Progress
+            value={shareSizeProgress}
+            label={shareSize / maxShareSize >= 0.1 ? formattedShareSize : ""}
+            style={{ width: shareSize / maxShareSize < 0.1 ? "70%" : "80%" }}
+            size="xl"
+            radius="xl"
+          />
+          <Text size="xs" color="lightgray" style={{ marginLeft: "4px" }}>
+            {formattedMaxShareSize}
+          </Text>
+        </Flex>
+      </Stack>
+    ),
+  });
+};
+
+export default showShareInformationsModal;

frontend/src/components/account/showShareLinkModal.tsx

@@ -1,14 +1,16 @@
 import { Stack, TextInput } from "@mantine/core";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { translateOutsideContext } from "../../hooks/useTranslate.hook";
 
 const showShareLinkModal = (
   modals: ModalsContextProps,
   shareId: string,
-  appUrl: string
+  appUrl: string,
 ) => {
-  const link = `${appUrl}/share/${shareId}`;
+  const t = translateOutsideContext();
+  const link = `${appUrl}/s/${shareId}`;
   return modals.openModal({
-    title: "Share link",
+    title: t("account.shares.modal.share-link"),
     children: (
       <Stack align="stretch">
         <TextInput variant="filled" value={link} />

frontend/src/components/admin/configuration/AdminConfigInput.tsx

@@ -21,7 +21,7 @@ const AdminConfigInput = ({
       stringValue: configVariable.value ?? configVariable.defaultValue,
       textValue: configVariable.value ?? configVariable.defaultValue,
       numberValue: parseInt(
-        configVariable.value ?? configVariable.defaultValue
+        configVariable.value ?? configVariable.defaultValue,
       ),
       booleanValue:
         (configVariable.value ?? configVariable.defaultValue) == "true",

frontend/src/components/admin/configuration/ConfigurationHeader.tsx

@@ -9,6 +9,7 @@ import {
 } from "@mantine/core";
 import Link from "next/link";
 import { Dispatch, SetStateAction } from "react";
+import { FormattedMessage } from "react-intl";
 import useConfig from "../../../hooks/config.hook";
 import Logo from "../../Logo";
 
@@ -42,7 +43,7 @@ const ConfigurationHeader = ({
           </Link>
           <MediaQuery smallerThan="sm" styles={{ display: "none" }}>
             <Button variant="light" component={Link} href="/admin">
-              Go back
+              <FormattedMessage id="common.button.go-back" />
             </Button>
           </MediaQuery>
         </Group>

frontend/src/components/admin/configuration/ConfigurationNavBar.tsx

@@ -12,6 +12,7 @@ import {
 import Link from "next/link";
 import { Dispatch, SetStateAction } from "react";
 import { TbAt, TbMail, TbShare, TbSquare } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
 
 const categories = [
   { name: "General", icon: <TbSquare /> },
@@ -53,7 +54,7 @@ const ConfigurationNavBar = ({
     >
       <Navbar.Section>
         <Text size="xs" color="dimmed" mb="sm">
-          Configuration
+          <FormattedMessage id="admin.config.title" />
         </Text>
         <Stack spacing="xs">
           {categories.map((category) => (
@@ -79,7 +80,11 @@ const ConfigurationNavBar = ({
                 >
                   {category.icon}
                 </ThemeIcon>
-                <Text size="sm">{category.name}</Text>
+                <Text size="sm">
+                  <FormattedMessage
+                    id={`admin.config.category.${category.name.toLowerCase()}`}
+                  />
+                </Text>
               </Group>
             </Box>
           ))}
@@ -87,7 +92,7 @@ const ConfigurationNavBar = ({
       </Navbar.Section>
       <MediaQuery largerThan="sm" styles={{ display: "none" }}>
         <Button mt="xl" variant="light" component={Link} href="/admin">
-          Go back
+          <FormattedMessage id="common.button.go-back" />
         </Button>
       </MediaQuery>
     </Navbar>

frontend/src/components/admin/configuration/LogoConfigInput.tsx

@@ -2,6 +2,8 @@ import { Box, FileInput, Group, Stack, Text, Title } from "@mantine/core";
 import { useMediaQuery } from "@mantine/hooks";
 import { Dispatch, SetStateAction } from "react";
 import { TbUpload } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
+import useTranslate from "../../../hooks/useTranslate.hook";
 
 const LogoConfigInput = ({
   logo,
@@ -11,14 +13,16 @@ const LogoConfigInput = ({
   setLogo: Dispatch<SetStateAction<File | null>>;
 }) => {
   const isMobile = useMediaQuery("(max-width: 560px)");
+  const t = useTranslate();
 
   return (
     <Group position="apart">
       <Stack style={{ maxWidth: isMobile ? "100%" : "40%" }} spacing={0}>
-        <Title order={6}>Logo</Title>
+        <Title order={6}>
+          <FormattedMessage id="admin.config.general.logo" />
+        </Title>
         <Text color="dimmed" size="sm" mb="xs">
-          Change your logo by uploading a new image. The image must be a PNG and
-          should have the format 1:1.
+          <FormattedMessage id="admin.config.general.logo.description" />
         </Text>
       </Stack>
       <Stack></Stack>
@@ -29,7 +33,7 @@ const LogoConfigInput = ({
           value={logo}
           onChange={(v) => setLogo(v)}
           accept=".png"
-          placeholder="Pick image"
+          placeholder={t("admin.config.general.logo.placeholder")}
         />
       </Box>
     </Group>

frontend/src/components/admin/configuration/TestEmailButton.tsx

@@ -1,6 +1,7 @@
 import { Button, Stack, Text, Textarea } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import { useState } from "react";
+import { FormattedMessage } from "react-intl";
 import useUser from "../../../hooks/user.hook";
 import configService from "../../../services/config.service";
 import toast from "../../../utils/toast.util";
@@ -32,7 +33,7 @@ const TestEmailButton = ({
               <Textarea minRows={4} readOnly value={e.response.data.message} />
             </Stack>
           ),
-        })
+        }),
       );
   };
 
@@ -65,7 +66,7 @@ const TestEmailButton = ({
         }
       }}
     >
-      Send test email
+      <FormattedMessage id="admin.config.smtp.button.test" />
     </Button>
   );
 };

frontend/src/components/admin/users/ManageUserTable.tsx

@@ -3,6 +3,7 @@ import { useModals } from "@mantine/modals";
 import { TbCheck, TbEdit, TbTrash } from "react-icons/tb";
 import User from "../../../types/user.type";
 import showUpdateUserModal from "./showUpdateUserModal";
+import { FormattedMessage, useIntl } from "react-intl";
 
 const ManageUserTable = ({
   users,
@@ -22,9 +23,15 @@ const ManageUserTable = ({
       <Table verticalSpacing="sm">
         <thead>
           <tr>
-            <th>Username</th>
-            <th>Email</th>
-            <th>Admin</th>
+            <th>
+              <FormattedMessage id="admin.users.table.username" />
+            </th>
+            <th>
+              <FormattedMessage id="admin.users.table.email" />
+            </th>
+            <th>
+              <FormattedMessage id="admin.users.table.admin" />
+            </th>
             <th></th>
           </tr>
         </thead>

frontend/src/components/admin/users/showCreateUserModal.tsx

@@ -8,14 +8,16 @@ import {
 } from "@mantine/core";
 import { useForm, yupResolver } from "@mantine/form";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
+import useTranslate from "../../../hooks/useTranslate.hook";
 import userService from "../../../services/user.service";
 import toast from "../../../utils/toast.util";
 
 const showCreateUserModal = (
   modals: ModalsContextProps,
   smtpEnabled: boolean,
-  getUsers: () => void
+  getUsers: () => void,
 ) => {
   return modals.openModal({
     title: "Create user",
@@ -34,6 +36,7 @@ const Body = ({
   smtpEnabled: boolean;
   getUsers: () => void;
 }) => {
+  const t = useTranslate();
   const form = useForm({
     initialValues: {
       username: "",
@@ -44,10 +47,15 @@ const Body = ({
     },
     validate: yupResolver(
       yup.object().shape({
-        email: yup.string().email(),
-        username: yup.string().min(3),
-        password: yup.string().min(8).optional(),
-      })
+        email: yup.string().email(t("common.error.invalid-email")),
+        username: yup
+          .string()
+          .min(3, t("common.error.too-short", { length: 3 })),
+        password: yup
+          .string()
+          .min(8, t("common.error.too-short", { length: 8 }))
+          .optional(),
+      }),
     ),
   });
 
@@ -65,14 +73,22 @@ const Body = ({
         })}
       >
         <Stack>
-          <TextInput label="Username" {...form.getInputProps("username")} />
-          <TextInput label="Email" {...form.getInputProps("email")} />
+          <TextInput
+            label={t("admin.users.modal.create.username")}
+            {...form.getInputProps("username")}
+          />
+          <TextInput
+            label={t("admin.users.modal.create.email")}
+            {...form.getInputProps("email")}
+          />
           {smtpEnabled && (
             <Switch
               mt="xs"
               labelPosition="left"
-              label="Set password manually"
-              description="If not checked, the user will receive an email with a link to set their password."
+              label={t("admin.users.modal.create.manual-password")}
+              description={t(
+                "admin.users.modal.create.manual-password.description",
+              )}
               {...form.getInputProps("setPasswordManually", {
                 type: "checkbox",
               })}
@@ -80,7 +96,7 @@ const Body = ({
           )}
           {(form.values.setPasswordManually || !smtpEnabled) && (
             <PasswordInput
-              label="Password"
+              label={t("admin.users.modal.create.password")}
               {...form.getInputProps("password")}
             />
           )}
@@ -93,12 +109,14 @@ const Body = ({
             }}
             mt="xs"
             labelPosition="left"
-            label="Admin privileges"
-            description="If checked, the user will be able to access the admin panel."
+            label={t("admin.users.modal.create.admin")}
+            description={t("admin.users.modal.create.admin.description")}
             {...form.getInputProps("isAdmin", { type: "checkbox" })}
           />
           <Group position="right">
-            <Button type="submit">Create</Button>
+            <Button type="submit">
+              <FormattedMessage id="common.button.create" />
+            </Button>
           </Group>
         </Stack>
       </form>

frontend/src/components/admin/users/showUpdateUserModal.tsx

@@ -9,7 +9,11 @@ import {
 } from "@mantine/core";
 import { useForm, yupResolver } from "@mantine/form";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../../hooks/useTranslate.hook";
 import userService from "../../../services/user.service";
 import User from "../../../types/user.type";
 import toast from "../../../utils/toast.util";
@@ -17,10 +21,11 @@ import toast from "../../../utils/toast.util";
 const showUpdateUserModal = (
   modals: ModalsContextProps,
   user: User,
-  getUsers: () => void
+  getUsers: () => void,
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
-    title: `Update ${user.username}`,
+    title: t("admin.users.edit.update.title", { username: user.username }),
     children: <Body user={user} modals={modals} getUsers={getUsers} />,
   });
 };
@@ -34,6 +39,8 @@ const Body = ({
   user: User;
   getUsers: () => void;
 }) => {
+  const t = useTranslate();
+
   const accountForm = useForm({
     initialValues: {
       username: user.username,
@@ -42,9 +49,11 @@ const Body = ({
     },
     validate: yupResolver(
       yup.object().shape({
-        email: yup.string().email(),
-        username: yup.string().min(3),
-      })
+        email: yup.string().email(t("common.error.invalid-email")),
+        username: yup
+          .string()
+          .min(3, t("common.error.too-short", { length: 3 })),
+      }),
     ),
   });
 
@@ -54,8 +63,10 @@ const Body = ({
     },
     validate: yupResolver(
       yup.object().shape({
-        password: yup.string().min(8),
-      })
+        password: yup
+          .string()
+          .min(8, t("common.error.too-short", { length: 8 })),
+      }),
     ),
   });
 
@@ -75,21 +86,26 @@ const Body = ({
       >
         <Stack>
           <TextInput
-            label="Username"
+            label={t("admin.users.table.username")}
             {...accountForm.getInputProps("username")}
           />
-          <TextInput label="Email" {...accountForm.getInputProps("email")} />
+          <TextInput
+            label={t("admin.users.table.email")}
+            {...accountForm.getInputProps("email")}
+          />
           <Switch
             mt="xs"
             labelPosition="left"
-            label="Admin privileges"
+            label={t("admin.users.edit.update.admin-privileges")}
             {...accountForm.getInputProps("isAdmin", { type: "checkbox" })}
           />
         </Stack>
       </form>
       <Accordion>
         <Accordion.Item sx={{ borderBottom: "none" }} value="changePassword">
-          <Accordion.Control px={0}>Change password</Accordion.Control>
+          <Accordion.Control px={0}>
+            <FormattedMessage id="admin.users.edit.update.change-password.title" />
+          </Accordion.Control>
           <Accordion.Panel>
             <form
               onSubmit={passwordForm.onSubmit(async (values) => {
@@ -97,17 +113,21 @@ const Body = ({
                   .update(user.id, {
                     password: values.password,
                   })
-                  .then(() => toast.success("Password changed successfully"))
+                  .then(() =>
+                    toast.success(
+                      t("admin.users.edit.update.notify.password.success"),
+                    ),
+                  )
                   .catch(toast.axiosError);
               })}
             >
               <Stack>
                 <PasswordInput
-                  label="New password"
+                  label={t("admin.users.edit.update.change-password.field")}
                   {...passwordForm.getInputProps("password")}
                 />
                 <Button variant="light" type="submit">
-                  Save new password
+                  <FormattedMessage id="admin.users.edit.update.change-password.button" />
                 </Button>
               </Stack>
             </form>
@@ -116,7 +136,7 @@ const Body = ({
       </Accordion>
       <Group position="right">
         <Button type="submit" form="accountForm">
-          Save
+          <FormattedMessage id="common.button.save" />
         </Button>
       </Group>
     </Stack>

frontend/src/components/auth/SignInForm.tsx

@@ -15,8 +15,10 @@ import Link from "next/link";
 import { useRouter } from "next/router";
 import React from "react";
 import { TbInfoCircle } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
 import useConfig from "../../hooks/config.hook";
+import useTranslate from "../../hooks/useTranslate.hook";
 import useUser from "../../hooks/user.hook";
 import authService from "../../services/auth.service";
 import toast from "../../utils/toast.util";
@@ -24,14 +26,18 @@ import toast from "../../utils/toast.util";
 const SignInForm = ({ redirectPath }: { redirectPath: string }) => {
   const config = useConfig();
   const router = useRouter();
+  const t = useTranslate();
   const { refreshUser } = useUser();
 
   const [showTotp, setShowTotp] = React.useState(false);
   const [loginToken, setLoginToken] = React.useState("");
 
   const validationSchema = yup.object().shape({
-    emailOrUsername: yup.string().required(),
-    password: yup.string().min(8).required(),
+    emailOrUsername: yup.string().required(t("common.error.field-required")),
+    password: yup
+      .string()
+      .min(8, t("common.error.too-short", { length: 8 }))
+      .required(t("common.error.field-required")),
   });
 
   const form = useForm({
@@ -54,8 +60,8 @@ const SignInForm = ({ redirectPath }: { redirectPath: string }) => {
             icon: <TbInfoCircle />,
             color: "blue",
             radius: "md",
-            title: "Two-factor authentication required",
-            message: "Please enter your two-factor authentication code",
+            title: t("signIn.notify.totp-required.title"),
+            message: t("signIn.notify.totp-required.description"),
           });
           setLoginToken(response.data["loginToken"]);
         } else {
@@ -88,13 +94,13 @@ const SignInForm = ({ redirectPath }: { redirectPath: string }) => {
   return (
     <Container size={420} my={40}>
       <Title order={2} align="center" weight={900}>
-        Welcome back
+        <FormattedMessage id="signin.title" />
       </Title>
       {config.get("share.allowRegistration") && (
         <Text color="dimmed" size="sm" align="center" mt={5}>
-          You don't have an account yet?{" "}
+          <FormattedMessage id="signin.description" />{" "}
           <Anchor component={Link} href={"signUp"} size="sm">
-            {"Sign up"}
+            <FormattedMessage id="signin.button.signup" />
           </Anchor>
         </Text>
       )}
@@ -107,20 +113,20 @@ const SignInForm = ({ redirectPath }: { redirectPath: string }) => {
           })}
         >
           <TextInput
-            label="Email or username"
-            placeholder="Your email or username"
+            label={t("signin.input.email-or-username")}
+            placeholder={t("signin.input.email-or-username.placeholder")}
             {...form.getInputProps("emailOrUsername")}
           />
           <PasswordInput
-            label="Password"
-            placeholder="Your password"
+            label={t("signin.input.password")}
+            placeholder={t("signin.input.password.placeholder")}
             mt="md"
             {...form.getInputProps("password")}
           />
           {showTotp && (
             <TextInput
               variant="filled"
-              label="Code"
+              label={t("account.modal.totp.code")}
               placeholder="******"
               mt="md"
               {...form.getInputProps("totp")}
@@ -129,12 +135,12 @@ const SignInForm = ({ redirectPath }: { redirectPath: string }) => {
           {config.get("smtp.enabled") && (
             <Group position="right" mt="xs">
               <Anchor component={Link} href="/auth/resetPassword" size="xs">
-                Forgot password?
+                <FormattedMessage id="resetPassword.title" />
               </Anchor>
             </Group>
           )}
           <Button fullWidth mt="xl" type="submit">
-            Sign in
+            <FormattedMessage id="signin.button.submit" />
           </Button>
         </form>
       </Paper>

frontend/src/components/auth/SignUpForm.tsx

@@ -11,8 +11,10 @@ import {
 import { useForm, yupResolver } from "@mantine/form";
 import Link from "next/link";
 import { useRouter } from "next/router";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
 import useConfig from "../../hooks/config.hook";
+import useTranslate from "../../hooks/useTranslate.hook";
 import useUser from "../../hooks/user.hook";
 import authService from "../../services/auth.service";
 import toast from "../../utils/toast.util";
@@ -20,12 +22,19 @@ import toast from "../../utils/toast.util";
 const SignUpForm = () => {
   const config = useConfig();
   const router = useRouter();
+  const t = useTranslate();
   const { refreshUser } = useUser();
 
   const validationSchema = yup.object().shape({
-    email: yup.string().email().required(),
-    username: yup.string().min(3).required(),
-    password: yup.string().min(8).required(),
+    email: yup.string().email(t("common.error.invalid-email")).required(),
+    username: yup
+      .string()
+      .min(3, t("common.error.too-short", { length: 3 }))
+      .required(t("common.error.field-required")),
+    password: yup
+      .string()
+      .min(8, t("common.error.too-short", { length: 8 }))
+      .required(t("common.error.field-required")),
   });
 
   const form = useForm({
@@ -54,41 +63,41 @@ const SignUpForm = () => {
   return (
     <Container size={420} my={40}>
       <Title order={2} align="center" weight={900}>
-        Sign up
+        <FormattedMessage id="signup.title" />
       </Title>
       {config.get("share.allowRegistration") && (
         <Text color="dimmed" size="sm" align="center" mt={5}>
-          You have an account already?{" "}
+          <FormattedMessage id="signup.description" />{" "}
           <Anchor component={Link} href={"signIn"} size="sm">
-            Sign in
+            <FormattedMessage id="signup.button.signin" />
           </Anchor>
         </Text>
       )}
       <Paper withBorder shadow="md" p={30} mt={30} radius="md">
         <form
           onSubmit={form.onSubmit((values) =>
-            signUp(values.email, values.username, values.password)
+            signUp(values.email, values.username, values.password),
           )}
         >
           <TextInput
-            label="Username"
-            placeholder="Your username"
+            label={t("signup.input.username")}
+            placeholder={t("signup.input.username.placeholder")}
             {...form.getInputProps("username")}
           />
           <TextInput
-            label="Email"
-            placeholder="Your email"
+            label={t("signup.input.email")}
+            placeholder={t("signup.input.email.placeholder")}
             mt="md"
             {...form.getInputProps("email")}
           />
           <PasswordInput
-            label="Password"
-            placeholder="Your password"
+            label={t("signin.input.password")}
+            placeholder={t("signin.input.password.placeholder")}
             mt="md"
             {...form.getInputProps("password")}
           />
           <Button fullWidth mt="xl" type="submit">
-            Let's get started
+            <FormattedMessage id="signup.button.submit" />
           </Button>
         </form>
       </Paper>

frontend/src/components/header/ActionAvatar.tsx

@@ -3,6 +3,7 @@ import Link from "next/link";
 import { TbDoorExit, TbSettings, TbUser } from "react-icons/tb";
 import useUser from "../../hooks/user.hook";
 import authService from "../../services/auth.service";
+import { FormattedMessage, useIntl } from "react-intl";
 
 const ActionAvatar = () => {
   const { user } = useUser();
@@ -16,7 +17,7 @@ const ActionAvatar = () => {
       </Menu.Target>
       <Menu.Dropdown>
         <Menu.Item component={Link} href="/account" icon={<TbUser size={14} />}>
-          My account
+          <FormattedMessage id="navbar.avatar.account" />
         </Menu.Item>
         {user!.isAdmin && (
           <Menu.Item
@@ -24,7 +25,7 @@ const ActionAvatar = () => {
             href="/admin"
             icon={<TbSettings size={14} />}
           >
-            Administration
+            <FormattedMessage id="navbar.avatar.admin" />
           </Menu.Item>
         )}
 
@@ -34,7 +35,7 @@ const ActionAvatar = () => {
           }}
           icon={<TbDoorExit size={14} />}
         >
-          Sign out
+          <FormattedMessage id="navbar.avatar.signout" />
         </Menu.Item>
       </Menu.Dropdown>
     </Menu>

frontend/src/components/header/Header.tsx

@@ -16,6 +16,7 @@ import { useRouter } from "next/router";
 import { ReactNode, useEffect, useState } from "react";
 import useConfig from "../../hooks/config.hook";
 import useUser from "../../hooks/user.hook";
+import useTranslate from "../../hooks/useTranslate.hook";
 import Logo from "../Logo";
 import ActionAvatar from "./ActionAvatar";
 import NavbarShareMenu from "./NavbarShareMenu";
@@ -112,6 +113,7 @@ const Header = () => {
   const { user } = useUser();
   const router = useRouter();
   const config = useConfig();
+  const t = useTranslate();
 
   const [opened, toggleOpened] = useDisclosure(false);
 
@@ -124,7 +126,7 @@ const Header = () => {
   const authenticatedLinks: NavLink[] = [
     {
       link: "/upload",
-      label: "Upload",
+      label: t("navbar.upload"),
     },
     {
       component: <NavbarShareMenu />,
@@ -137,27 +139,27 @@ const Header = () => {
   let unauthenticatedLinks: NavLink[] = [
     {
       link: "/auth/signIn",
-      label: "Sign in",
+      label: t("navbar.signin"),
     },
   ];
 
   if (config.get("share.allowUnauthenticatedShares")) {
     unauthenticatedLinks.unshift({
       link: "/upload",
-      label: "Upload",
+      label: t("navbar.upload"),
     });
   }
 
   if (config.get("general.showHomePage"))
     unauthenticatedLinks.unshift({
       link: "/",
-      label: "Home",
+      label: t("navbar.home"),
     });
 
   if (config.get("share.allowRegistration"))
     unauthenticatedLinks.push({
       link: "/auth/signUp",
-      label: "Sign up",
+      label: t("navbar.signup"),
     });
 
   const { classes, cx } = useStyles();

frontend/src/components/header/NavbarShareMenu.tsx

@@ -1,6 +1,7 @@
 import { ActionIcon, Menu } from "@mantine/core";
 import Link from "next/link";
 import { TbArrowLoopLeft, TbLink } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
 
 const NavbarShareMneu = () => {
   return (
@@ -12,14 +13,14 @@ const NavbarShareMneu = () => {
       </Menu.Target>
       <Menu.Dropdown>
         <Menu.Item component={Link} href="/account/shares" icon={<TbLink />}>
-          My shares
+          <FormattedMessage id="navbar.links.shares" />
         </Menu.Item>
         <Menu.Item
           component={Link}
           href="/account/reverseShares"
           icon={<TbArrowLoopLeft />}
         >
-          Reverse shares
+          <FormattedMessage id="navbar.links.reverse" />
         </Menu.Item>
       </Menu.Dropdown>
     </Menu>

frontend/src/components/share/DownloadAllButton.tsx

@@ -1,11 +1,15 @@
 import { Button } from "@mantine/core";
 import { useEffect, useState } from "react";
+import { FormattedMessage } from "react-intl";
+import useTranslate from "../../hooks/useTranslate.hook";
 import shareService from "../../services/share.service";
 import toast from "../../utils/toast.util";
 
 const DownloadAllButton = ({ shareId }: { shareId: string }) => {
   const [isZipReady, setIsZipReady] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const t = useTranslate();
+
   const downloadAll = async () => {
     setIsLoading(true);
     await shareService
@@ -39,13 +43,13 @@ const DownloadAllButton = ({ shareId }: { shareId: string }) => {
       loading={isLoading}
       onClick={() => {
         if (!isZipReady) {
-          toast.error("The share is preparing. Try again in a few minutes.");
+          toast.error(t("share.notify.download-all-preparing"));
         } else {
           downloadAll();
         }
       }}
     >
-      Download all
+      <FormattedMessage id="share.button.download-all" />
     </Button>
   );
 };

frontend/src/components/share/FileList.tsx

@@ -19,6 +19,8 @@ import { byteToHumanSizeString } from "../../utils/fileSize.util";
 import toast from "../../utils/toast.util";
 import TableSortIcon, { TableSort } from "../core/SortIcon";
 import showFilePreviewModal from "./modals/showFilePreviewModal";
+import useTranslate from "../../hooks/useTranslate.hook";
+import { FormattedMessage } from "react-intl";
 
 const FileList = ({
   files,
@@ -34,6 +36,7 @@ const FileList = ({
   const clipboard = useClipboard();
   const config = useConfig();
   const modals = useModals();
+  const t = useTranslate();
 
   const [sort, setSort] = useState<TableSort>({
     property: undefined,
@@ -68,10 +71,10 @@ const FileList = ({
 
     if (window.isSecureContext) {
       clipboard.copy(link);
-      toast.success("Your file link was copied to the keyboard.");
+      toast.success(t("common.notify.copied"));
     } else {
       modals.openModal({
-        title: "File link",
+        title: t("share.modal.file-link"),
         children: (
           <Stack align="stretch">
             <TextInput variant="filled" value={link} />
@@ -90,13 +93,13 @@ const FileList = ({
           <tr>
             <th>
               <Group spacing="xs">
-                Name
+                <FormattedMessage id="share.table.name" />
                 <TableSortIcon sort={sort} setSort={setSort} property="name" />
               </Group>
             </th>
             <th>
               <Group spacing="xs">
-                Size
+                <FormattedMessage id="share.table.size" />
                 <TableSortIcon sort={sort} setSort={setSort} property="size" />
               </Group>
             </th>

frontend/src/components/share/FilePreview.tsx

@@ -2,6 +2,7 @@ import { Button, Center, Stack, Text, Title } from "@mantine/core";
 import { modals } from "@mantine/modals";
 import Link from "next/link";
 import React, { Dispatch, SetStateAction, useEffect, useState } from "react";
+import { FormattedMessage } from "react-intl";
 import api from "../../services/api.service";
 
 const FilePreviewContext = React.createContext<{
@@ -43,6 +44,7 @@ const FilePreview = ({
         href={`/api/shares/${shareId}/files/${fileId}?download=false`}
       >
         View original file
+        {/* Add translation? */}
       </Button>
     </Stack>
   );
@@ -116,10 +118,9 @@ const TextPreview = () => {
   const [text, setText] = useState<string | null>(null);
 
   useEffect(() => {
-    api.get(`/shares/${shareId}/files/${fileId}?download=false`).then((res) => {
-      console.log(res.data);
-      setText(res.data);
-    });
+    api
+      .get(`/shares/${shareId}/files/${fileId}?download=false`)
+      .then((res) => setText(res.data));
   }, [shareId, fileId]);
 
   return (
@@ -145,10 +146,11 @@ const UnSupportedFile = () => {
   return (
     <Center style={{ minHeight: 200 }}>
       <Stack align="center" spacing={10}>
-        <Title order={3}>Preview not supported</Title>
+        <Title order={3}>
+          <FormattedMessage id="share.modal.file-preview.error.not-supported.title" />
+        </Title>
         <Text>
-          A preview for thise file type is unsupported. Please download the file
-          to view it.
+          <FormattedMessage id="share.modal.file-preview.error.not-supported.description" />
         </Text>
       </Stack>
     </Center>

frontend/src/components/share/modals/showCompletedReverseShareModal.tsx

@@ -1,20 +1,21 @@
-import { ActionIcon, Button, Stack, TextInput } from "@mantine/core";
-import { useClipboard } from "@mantine/hooks";
+import { Button, Stack } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
-import { TbCopy } from "react-icons/tb";
-import toast from "../../../utils/toast.util";
+import { FormattedMessage } from "react-intl";
+import { translateOutsideContext } from "../../../hooks/useTranslate.hook";
+import CopyTextField from "../../upload/CopyTextField";
 
 const showCompletedReverseShareModal = (
   modals: ModalsContextProps,
   link: string,
-  getReverseShares: () => void
+  getReverseShares: () => void,
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
     closeOnClickOutside: false,
     withCloseButton: false,
     closeOnEscape: false,
-    title: "Reverse share link",
+    title: t("account.reverseShares.modal.reverse-share-link"),
     children: <Body link={link} getReverseShares={getReverseShares} />,
   });
 };
@@ -26,28 +27,11 @@ const Body = ({
   link: string;
   getReverseShares: () => void;
 }) => {
-  const clipboard = useClipboard({ timeout: 500 });
   const modals = useModals();
 
   return (
     <Stack align="stretch">
-      <TextInput
-        readOnly
-        variant="filled"
-        value={link}
-        rightSection={
-          window.isSecureContext && (
-            <ActionIcon
-              onClick={() => {
-                clipboard.copy(link);
-                toast.success("Your link was copied to the keyboard.");
-              }}
-            >
-              <TbCopy />
-            </ActionIcon>
-          )
-        }
-      />
+      <CopyTextField link={link} />
 
       <Button
         onClick={() => {
@@ -55,7 +39,7 @@ const Body = ({
           getReverseShares();
         }}
       >
-        Done
+        <FormattedMessage id="common.button.done" />
       </Button>
     </Stack>
   );

frontend/src/components/share/modals/showCreateReverseShareModal.tsx

@@ -12,6 +12,10 @@ import {
 import { useForm } from "@mantine/form";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
+import { FormattedMessage } from "react-intl";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../../hooks/useTranslate.hook";
 import shareService from "../../../services/share.service";
 import { getExpirationPreview } from "../../../utils/date.util";
 import toast from "../../../utils/toast.util";
@@ -21,10 +25,11 @@ import showCompletedReverseShareModal from "./showCompletedReverseShareModal";
 const showCreateReverseShareModal = (
   modals: ModalsContextProps,
   showSendEmailNotificationOption: boolean,
-  getReverseShares: () => void
+  getReverseShares: () => void,
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
-    title: "Create reverse share",
+    title: t("account.reverseShares.modal.title"),
     children: (
       <Body
         showSendEmailNotificationOption={showSendEmailNotificationOption}
@@ -42,6 +47,7 @@ const Body = ({
   showSendEmailNotificationOption: boolean;
 }) => {
   const modals = useModals();
+  const t = useTranslate();
 
   const form = useForm({
     initialValues: {
@@ -61,7 +67,7 @@ const Body = ({
               values.expiration_num + values.expiration_unit,
               values.maxShareSize,
               values.maxUseCount,
-              values.sendEmailNotification
+              values.sendEmailNotification,
             )
             .then(({ link }) => {
               modals.closeAll();
@@ -79,7 +85,7 @@ const Body = ({
                   max={99999}
                   precision={0}
                   variant="filled"
-                  label="Share expiration"
+                  label={t("account.reverseShares.modal.expiration.label")}
                   {...form.getInputProps("expiration_num")}
                 />
               </Col>
@@ -91,27 +97,44 @@ const Body = ({
                     {
                       value: "-minutes",
                       label:
-                        "Minute" + (form.values.expiration_num == 1 ? "" : "s"),
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.minute-singular")
+                          : t("upload.modal.expires.minute-plural"),
                     },
                     {
                       value: "-hours",
                       label:
-                        "Hour" + (form.values.expiration_num == 1 ? "" : "s"),
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.hour-singular")
+                          : t("upload.modal.expires.hour-plural"),
                     },
                     {
                       value: "-days",
                       label:
-                        "Day" + (form.values.expiration_num == 1 ? "" : "s"),
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.day-singular")
+                          : t("upload.modal.expires.day-plural"),
                     },
                     {
                       value: "-weeks",
                       label:
-                        "Week" + (form.values.expiration_num == 1 ? "" : "s"),
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.week-singular")
+                          : t("upload.modal.expires.week-plural"),
                     },
                     {
                       value: "-months",
                       label:
-                        "Month" + (form.values.expiration_num == 1 ? "" : "s"),
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.month-singular")
+                          : t("upload.modal.expires.month-plural"),
+                    },
+                    {
+                      value: "-years",
+                      label:
+                        form.values.expiration_num == 1
+                          ? t("upload.modal.expires.year-singular")
+                          : t("upload.modal.expires.year-plural"),
                     },
                   ]}
                 />
@@ -125,11 +148,17 @@ const Body = ({
                 color: theme.colors.gray[6],
               })}
             >
-              {getExpirationPreview("reverse share", form)}
+              {getExpirationPreview(
+                {
+                  expiresOn: t("account.reverseShare.expires-on"),
+                  neverExpires: t("account.reverseShare.never-expires"),
+                },
+                form,
+              )}
             </Text>
           </div>
           <FileSizeInput
-            label="Max share size"
+            label={t("account.reverseShares.modal.max-size.label")}
             value={form.values.maxShareSize}
             onChange={(number) => form.setFieldValue("maxShareSize", number)}
           />
@@ -138,16 +167,18 @@ const Body = ({
             max={1000}
             precision={0}
             variant="filled"
-            label="Max use count"
-            description="The maximum number of times this reverse share link can be used"
+            label={t("account.reverseShares.modal.max-use.label")}
+            description={t("account.reverseShares.modal.max-use.description")}
             {...form.getInputProps("maxUseCount")}
           />
           {showSendEmailNotificationOption && (
             <Switch
               mt="xs"
               labelPosition="left"
-              label="Send email notification"
-              description="Send an email notification when a share is created with this reverse share link"
+              label={t("account.reverseShares.modal.send-email")}
+              description={t(
+                "account.reverseShares.modal.send-email.description",
+              )}
               {...form.getInputProps("sendEmailNotification", {
                 type: "checkbox",
               })}
@@ -155,7 +186,7 @@ const Body = ({
           )}
 
           <Button mt="md" type="submit">
-            Create
+            <FormattedMessage id="common.button.create" />
           </Button>
         </Stack>
       </form>

frontend/src/components/share/modals/showFilePreviewModal.tsx

@@ -6,7 +6,7 @@ import FilePreview from "../FilePreview";
 const showFilePreviewModal = (
   shareId: string,
   file: FileMetaData,
-  modals: ModalsContextProps
+  modals: ModalsContextProps,
 ) => {
   const mimeType = (mime.contentType(file.name) || "").split(";")[0];
   return modals.openModal({

frontend/src/components/share/showEnterPasswordModal.tsx

@@ -1,16 +1,21 @@
 import { Button, PasswordInput, Stack, Text } from "@mantine/core";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
 import { useState } from "react";
+import { FormattedMessage } from "react-intl";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../hooks/useTranslate.hook";
 
 const showEnterPasswordModal = (
   modals: ModalsContextProps,
-  submitCallback: (password: string) => Promise<void>
+  submitCallback: (password: string) => Promise<void>,
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
     closeOnClickOutside: false,
     withCloseButton: false,
     closeOnEscape: false,
-    title: "Password required",
+    title: t("share.modal.password.title"),
     children: <Body submitCallback={submitCallback} />,
   });
 };
@@ -22,10 +27,11 @@ const Body = ({
 }) => {
   const [password, setPassword] = useState("");
   const [passwordWrong, setPasswordWrong] = useState(false);
+  const t = useTranslate();
   return (
     <Stack align="stretch">
       <Text size="sm">
-        This access this share please enter the password for the share.
+        <FormattedMessage id="share.modal.password.description" />
       </Text>
 
       <form
@@ -37,13 +43,15 @@ const Body = ({
         <Stack>
           <PasswordInput
             variant="filled"
-            placeholder="Password"
-            error={passwordWrong && "Wrong password"}
+            placeholder={t("share.modal.password")}
+            error={passwordWrong && t("share.modal.error.invalid-password")}
             onFocus={() => setPasswordWrong(false)}
             onChange={(e) => setPassword(e.target.value)}
             value={password}
           />
-          <Button type="submit">Submit</Button>
+          <Button type="submit">
+            <FormattedMessage id="common.button.submit" />
+          </Button>
         </Stack>
       </form>
     </Stack>

frontend/src/components/share/showErrorModal.tsx

@@ -2,11 +2,12 @@ import { Button, Stack, Text } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
 import { useRouter } from "next/router";
+import { FormattedMessage } from "react-intl";
 
 const showErrorModal = (
   modals: ModalsContextProps,
   title: string,
-  text: string
+  text: string,
 ) => {
   return modals.openModal({
     closeOnClickOutside: false,
@@ -31,7 +32,7 @@ const Body = ({ text }: { text: string }) => {
             router.back();
           }}
         >
-          Go back
+          <FormattedMessage id="common.button.go-back" />
         </Button>
       </Stack>
     </>

frontend/src/components/upload/CopyTextField.tsx

@@ -0,0 +1,51 @@
+import { ActionIcon, TextInput } from "@mantine/core";
+import { useClipboard } from "@mantine/hooks";
+import { useRef, useState } from "react";
+import { TbCheck, TbCopy } from "react-icons/tb";
+import useTranslate from "../../hooks/useTranslate.hook";
+import toast from "../../utils/toast.util";
+
+function CopyTextField(props: { link: string }) {
+  const clipboard = useClipboard({ timeout: 500 });
+  const t = useTranslate();
+
+  const [checkState, setCheckState] = useState(false);
+  const [textClicked, setTextClicked] = useState(false);
+  const timerRef = useRef<number | ReturnType<typeof setTimeout> | undefined>(
+    undefined,
+  );
+
+  const copyLink = () => {
+    clipboard.copy(props.link);
+    toast.success(t("common.notify.copied"));
+    if (timerRef.current) clearTimeout(timerRef.current);
+    timerRef.current = setTimeout(() => {
+      setCheckState(false);
+    }, 1500);
+    setCheckState(true);
+  };
+
+  return (
+    <TextInput
+      readOnly
+      label={t("common.text.link")}
+      variant="filled"
+      value={props.link}
+      onClick={() => {
+        if (!textClicked) {
+          copyLink();
+          setTextClicked(true);
+        }
+      }}
+      rightSection={
+        window.isSecureContext && (
+          <ActionIcon onClick={copyLink}>
+            {checkState ? <TbCheck /> : <TbCopy />}
+          </ActionIcon>
+        )
+      }
+    />
+  );
+}
+
+export default CopyTextField;

frontend/src/components/upload/Dropzone.tsx

@@ -1,8 +1,9 @@
 import { Button, Center, createStyles, Group, Text } from "@mantine/core";
 import { Dropzone as MantineDropzone } from "@mantine/dropzone";
-import { Dispatch, ForwardedRef, SetStateAction, useRef } from "react";
+import { ForwardedRef, useRef } from "react";
 import { TbCloudUpload, TbUpload } from "react-icons/tb";
-import useConfig from "../../hooks/config.hook";
+import { FormattedMessage } from "react-intl";
+import useTranslate from "../../hooks/useTranslate.hook";
 import { FileUpload } from "../../types/File.type";
 import { byteToHumanSizeString } from "../../utils/fileSize.util";
 import toast from "../../utils/toast.util";
@@ -34,15 +35,13 @@ const useStyles = createStyles((theme) => ({
 const Dropzone = ({
   isUploading,
   maxShareSize,
-  files,
-  setFiles,
+  showCreateUploadModalCallback,
 }: {
   isUploading: boolean;
   maxShareSize: number;
-  files: FileUpload[];
-  setFiles: Dispatch<SetStateAction<FileUpload[]>>;
+  showCreateUploadModalCallback: (files: FileUpload[]) => void;
 }) => {
-  const config = useConfig();
+  const t = useTranslate();
 
   const { classes } = useStyles();
   const openRef = useRef<() => void>();
@@ -54,24 +53,21 @@ const Dropzone = ({
         }}
         disabled={isUploading}
         openRef={openRef as ForwardedRef<() => void>}
-        onDrop={(newFiles: FileUpload[]) => {
-          const fileSizeSum = [...newFiles, ...files].reduce(
-            (n, { size }) => n + size,
-            0
-          );
+        onDrop={(files: FileUpload[]) => {
+          const fileSizeSum = files.reduce((n, { size }) => n + size, 0);
 
           if (fileSizeSum > maxShareSize) {
             toast.error(
-              `Your files exceed the maximum share size of ${byteToHumanSizeString(
-                maxShareSize
-              )}.`
+              t("upload.dropzone.notify.file-too-big", {
+                maxSize: byteToHumanSizeString(maxShareSize),
+              })
             );
           } else {
-            newFiles = newFiles.map((newFile) => {
+            files = files.map((newFile) => {
               newFile.uploadingProgress = 0;
               return newFile;
             });
-            setFiles([...newFiles, ...files]);
+            showCreateUploadModalCallback(files);
           }
         }}
         className={classes.dropzone}
@@ -82,12 +78,13 @@ const Dropzone = ({
             <TbCloudUpload size={50} />
           </Group>
           <Text align="center" weight={700} size="lg" mt="xl">
-            Upload files
+            <FormattedMessage id="upload.dropzone.title" />
           </Text>
           <Text align="center" size="sm" mt="xs" color="dimmed">
-            Drag&apos;n&apos;drop files here to start your share. We can accept
-            only files that are less than {byteToHumanSizeString(maxShareSize)}{" "}
-            in total.
+            <FormattedMessage
+              id="upload.dropzone.description"
+              values={{ maxSize: byteToHumanSizeString(maxShareSize) }}
+            />
           </Text>
         </div>
       </MantineDropzone>

frontend/src/components/upload/FileList.tsx

@@ -4,6 +4,7 @@ import { TbTrash } from "react-icons/tb";
 import { FileUpload } from "../../types/File.type";
 import { byteToHumanSizeString } from "../../utils/fileSize.util";
 import UploadProgressIndicator from "./UploadProgressIndicator";
+import { FormattedMessage } from "react-intl";
 
 const FileList = ({
   files,
@@ -41,8 +42,12 @@ const FileList = ({
     <Table>
       <thead>
         <tr>
-          <th>Name</th>
-          <th>Size</th>
+          <th>
+            <FormattedMessage id="upload.filelist.name" />
+          </th>
+          <th>
+            <FormattedMessage id="upload.filelist.size" />
+          </th>
           <th></th>
         </tr>
       </thead>

frontend/src/components/upload/modals/showCompletedUploadModal.tsx

@@ -1,52 +1,40 @@
-import { ActionIcon, Button, Stack, Text, TextInput } from "@mantine/core";
-import { useClipboard } from "@mantine/hooks";
+import { Button, Stack, Text } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
 import moment from "moment";
 import { useRouter } from "next/router";
-import { TbCopy } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../../hooks/useTranslate.hook";
 import { Share } from "../../../types/share.type";
-import toast from "../../../utils/toast.util";
+import CopyTextField from "../CopyTextField";
 
 const showCompletedUploadModal = (
   modals: ModalsContextProps,
   share: Share,
-  appUrl: string
+  appUrl: string,
 ) => {
+  const t = translateOutsideContext();
   return modals.openModal({
     closeOnClickOutside: false,
     withCloseButton: false,
     closeOnEscape: false,
-    title: "Share ready",
+    title: t("upload.modal.completed.share-ready"),
     children: <Body share={share} appUrl={appUrl} />,
   });
 };
 
 const Body = ({ share, appUrl }: { share: Share; appUrl: string }) => {
-  const clipboard = useClipboard({ timeout: 500 });
   const modals = useModals();
   const router = useRouter();
+  const t = useTranslate();
+
+  const link = `${appUrl}/s/${share.id}`;
 
-  const link = `${appUrl}/share/${share.id}`;
   return (
     <Stack align="stretch">
-      <TextInput
-        readOnly
-        variant="filled"
-        value={link}
-        rightSection={
-          window.isSecureContext && (
-            <ActionIcon
-              onClick={() => {
-                clipboard.copy(link);
-                toast.success("Your link was copied to the keyboard.");
-              }}
-            >
-              <TbCopy />
-            </ActionIcon>
-          )
-        }
-      />
+      <CopyTextField link={link} />
       <Text
         size="xs"
         sx={(theme) => ({
@@ -55,10 +43,10 @@ const Body = ({ share, appUrl }: { share: Share; appUrl: string }) => {
       >
         {/* If our share.expiration is timestamp 0, show a different message */}
         {moment(share.expiration).unix() === 0
-          ? "This share will never expire."
-          : `This share will expire on ${moment(share.expiration).format(
-              "LLL"
-            )}`}
+          ? t("upload.modal.completed.never-expires")
+          : t("upload.modal.completed.expires-on", {
+              expiration: moment(share.expiration).format("LLL"),
+            })}
       </Text>
 
       <Button
@@ -67,7 +55,7 @@ const Body = ({ share, appUrl }: { share: Share; appUrl: string }) => {
           router.push("/upload");
         }}
       >
-        Done
+        <FormattedMessage id="common.button.done" />
       </Button>
     </Stack>
   );

frontend/src/components/upload/modals/showCreateUploadModal.tsx

@@ -5,6 +5,7 @@ import {
   Checkbox,
   Col,
   Grid,
+  Group,
   MultiSelect,
   NumberInput,
   PasswordInput,
@@ -13,15 +14,19 @@ import {
   Text,
   Textarea,
   TextInput,
-  Title,
 } from "@mantine/core";
 import { useForm, yupResolver } from "@mantine/form";
 import { useModals } from "@mantine/modals";
 import { ModalsContextProps } from "@mantine/modals/lib/context";
 import { useState } from "react";
 import { TbAlertCircle } from "react-icons/tb";
+import { FormattedMessage } from "react-intl";
 import * as yup from "yup";
+import useTranslate, {
+  translateOutsideContext,
+} from "../../../hooks/useTranslate.hook";
 import shareService from "../../../services/share.service";
+import { FileUpload } from "../../../types/File.type";
 import { CreateShare } from "../../../types/share.type";
 import { getExpirationPreview } from "../../../utils/date.util";
 
@@ -34,13 +39,17 @@ const showCreateUploadModal = (
     allowUnauthenticatedShares: boolean;
     enableEmailRecepients: boolean;
   },
-  uploadCallback: (createShare: CreateShare) => void
+  files: FileUpload[],
+  uploadCallback: (createShare: CreateShare, files: FileUpload[]) => void
 ) => {
+  const t = translateOutsideContext();
+
   return modals.openModal({
-    title: "Share",
+    title: t("upload.modal.title"),
     children: (
       <CreateUploadModalBody
         options={options}
+        files={files}
         uploadCallback={uploadCallback}
       />
     ),
@@ -49,9 +58,11 @@ const showCreateUploadModal = (
 
 const CreateUploadModalBody = ({
   uploadCallback,
+  files,
   options,
 }: {
-  uploadCallback: (createShare: CreateShare) => void;
+  files: FileUpload[];
+  uploadCallback: (createShare: CreateShare, files: FileUpload[]) => void;
   options: {
     isUserSignedIn: boolean;
     isReverseShare: boolean;
@@ -61,24 +72,29 @@ const CreateUploadModalBody = ({
   };
 }) => {
   const modals = useModals();
+  const t = useTranslate();
+
+  const generatedLink = Buffer.from(Math.random().toString(), "utf8")
+    .toString("base64")
+    .substr(10, 7);
 
   const [showNotSignedInAlert, setShowNotSignedInAlert] = useState(true);
 
   const validationSchema = yup.object().shape({
     link: yup
       .string()
-      .required()
-      .min(3)
-      .max(50)
+      .required(t("common.error.field-required"))
+      .min(3, t("common.error.too-short", { length: 3 }))
+      .max(50, t("common.error.too-long", { length: 50 }))
       .matches(new RegExp("^[a-zA-Z0-9_-]*$"), {
-        message: "Can only contain letters, numbers, underscores and hyphens",
+        message: t("upload.modal.link.error.invalid"),
       }),
     password: yup.string().min(3).max(30),
     maxViews: yup.number().min(1),
   });
   const form = useForm({
     initialValues: {
-      link: "",
+      link: generatedLink,
       recipients: [] as string[],
       password: undefined,
       maxViews: undefined,
@@ -96,61 +112,61 @@ const CreateUploadModalBody = ({
           withCloseButton
           onClose={() => setShowNotSignedInAlert(false)}
           icon={<TbAlertCircle size={16} />}
-          title="You're not signed in"
+          title={t("upload.modal.not-signed-in")}
           color="yellow"
         >
-          You will be unable to delete your share manually and view the visitor
-          count.
+          <FormattedMessage id="upload.modal.not-signed-in-description" />
         </Alert>
       )}
       <form
         onSubmit={form.onSubmit(async (values) => {
           if (!(await shareService.isShareIdAvailable(values.link))) {
-            form.setFieldError("link", "This link is already in use");
+            form.setFieldError("link", t("upload.modal.link.error.taken"));
           } else {
             const expiration = form.values.never_expires
               ? "never"
               : form.values.expiration_num + form.values.expiration_unit;
-            uploadCallback({
-              id: values.link,
-              expiration: expiration,
-              recipients: values.recipients,
-              description: values.description,
-              security: {
-                password: values.password,
-                maxViews: values.maxViews,
+            uploadCallback(
+              {
+                id: values.link,
+                expiration: expiration,
+                recipients: values.recipients,
+                description: values.description,
+                security: {
+                  password: values.password,
+                  maxViews: values.maxViews,
+                },
               },
-            });
+              files
+            );
             modals.closeAll();
           }
         })}
       >
         <Stack align="stretch">
-          <Grid align={form.errors.link ? "center" : "flex-end"}>
-            <Col xs={9}>
-              <TextInput
-                variant="filled"
-                label="Link"
-                placeholder="myAwesomeShare"
-                {...form.getInputProps("link")}
-              />
-            </Col>
-            <Col xs={3}>
-              <Button
-                variant="outline"
-                onClick={() =>
-                  form.setFieldValue(
-                    "link",
-                    Buffer.from(Math.random().toString(), "utf8")
-                      .toString("base64")
-                      .substr(10, 7)
-                  )
-                }
-              >
-                Generate
-              </Button>
-            </Col>
-          </Grid>
+          <Group align="end">
+            <TextInput
+              style={{ flex: "1" }}
+              variant="filled"
+              label={t("upload.modal.link.label")}
+              placeholder="myAwesomeShare"
+              {...form.getInputProps("link")}
+            />
+            <Button
+              style={{ flex: "0 0 auto" }}
+              variant="outline"
+              onClick={() =>
+                form.setFieldValue(
+                  "link",
+                  Buffer.from(Math.random().toString(), "utf8")
+                    .toString("base64")
+                    .substr(10, 7)
+                )
+              }
+            >
+              <FormattedMessage id="common.button.generate" />
+            </Button>
+          </Group>
 
           <Text
             italic
@@ -159,8 +175,7 @@ const CreateUploadModalBody = ({
               color: theme.colors.gray[6],
             })}
           >
-            {options.appUrl}/share/
-            {form.values.link == "" ? "myAwesomeShare" : form.values.link}
+            {`${options.appUrl}/s/${form.values.link}`}
           </Text>
           {!options.isReverseShare && (
             <>
@@ -171,8 +186,7 @@ const CreateUploadModalBody = ({
                     max={99999}
                     precision={0}
                     variant="filled"
-                    label="Expiration"
-                    placeholder="n"
+                    label={t("upload.modal.expires.label")}
                     disabled={form.values.never_expires}
                     {...form.getInputProps("expiration_num")}
                   />
@@ -186,41 +200,51 @@ const CreateUploadModalBody = ({
                       {
                         value: "-minutes",
                         label:
-                          "Minute" +
-                          (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.minute-singular")
+                            : t("upload.modal.expires.minute-plural"),
                       },
                       {
                         value: "-hours",
                         label:
-                          "Hour" + (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.hour-singular")
+                            : t("upload.modal.expires.hour-plural"),
                       },
                       {
                         value: "-days",
                         label:
-                          "Day" + (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.day-singular")
+                            : t("upload.modal.expires.day-plural"),
                       },
                       {
                         value: "-weeks",
                         label:
-                          "Week" + (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.week-singular")
+                            : t("upload.modal.expires.week-plural"),
                       },
                       {
                         value: "-months",
                         label:
-                          "Month" +
-                          (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.month-singular")
+                            : t("upload.modal.expires.month-plural"),
                       },
                       {
                         value: "-years",
                         label:
-                          "Year" + (form.values.expiration_num == 1 ? "" : "s"),
+                          form.values.expiration_num == 1
+                            ? t("upload.modal.expires.year-singular")
+                            : t("upload.modal.expires.year-plural"),
                       },
                     ]}
                   />
                 </Col>
               </Grid>
               <Checkbox
-                label="Never Expires"
+                label={t("upload.modal.expires.never-long")}
                 {...form.getInputProps("never_expires")}
               />
               <Text
@@ -230,18 +254,28 @@ const CreateUploadModalBody = ({
                   color: theme.colors.gray[6],
                 })}
               >
-                {getExpirationPreview("share", form)}
+                {getExpirationPreview(
+                  {
+                    neverExpires: t("upload.modal.completed.never-expires"),
+                    expiresOn: t("upload.modal.completed.expires-on"),
+                  },
+                  form
+                )}
               </Text>
             </>
           )}
           <Accordion>
             <Accordion.Item value="description" sx={{ borderBottom: "none" }}>
-              <Accordion.Control>Description</Accordion.Control>
+              <Accordion.Control>
+                <FormattedMessage id="upload.modal.accordion.description.title" />
+              </Accordion.Control>
               <Accordion.Panel>
                 <Stack align="stretch">
                   <Textarea
                     variant="filled"
-                    placeholder="Note for the recepients"
+                    placeholder={t(
+                      "upload.modal.accordion.description.placeholder"
+                    )}
                     {...form.getInputProps("description")}
                   />
                 </Stack>
@@ -249,20 +283,22 @@ const CreateUploadModalBody = ({
             </Accordion.Item>
             {options.enableEmailRecepients && (
               <Accordion.Item value="recipients" sx={{ borderBottom: "none" }}>
-                <Accordion.Control>Email recipients</Accordion.Control>
+                <Accordion.Control>
+                  <FormattedMessage id="upload.modal.accordion.email.title" />
+                </Accordion.Control>
                 <Accordion.Panel>
                   <MultiSelect
                     data={form.values.recipients}
-                    placeholder="Enter email recipients"
+                    placeholder={t("upload.modal.accordion.email.placeholder")}
                     searchable
-                    {...form.getInputProps("recipients")}
                     creatable
+                    autoComplete="email-recipients"
                     getCreateLabel={(query) => `+ ${query}`}
                     onCreate={(query) => {
                       if (!query.match(/^\S+@\S+\.\S+$/)) {
                         form.setFieldError(
                           "recipients",
-                          "Invalid email address"
+                          t("upload.modal.accordion.email.invalid-email")
                         );
                       } else {
                         form.setFieldError("recipients", null);
@@ -273,34 +309,44 @@ const CreateUploadModalBody = ({
                         return query;
                       }
                     }}
+                    {...form.getInputProps("recipients")}
                   />
                 </Accordion.Panel>
               </Accordion.Item>
             )}
 
             <Accordion.Item value="security" sx={{ borderBottom: "none" }}>
-              <Accordion.Control>Security options</Accordion.Control>
+              <Accordion.Control>
+                <FormattedMessage id="upload.modal.accordion.security.title" />
+              </Accordion.Control>
               <Accordion.Panel>
                 <Stack align="stretch">
                   <PasswordInput
                     variant="filled"
-                    placeholder="No password"
-                    label="Password protection"
+                    placeholder={t(
+                      "upload.modal.accordion.security.password.placeholder"
+                    )}
+                    label={t("upload.modal.accordion.security.password.label")}
+                    autoComplete="off"
                     {...form.getInputProps("password")}
                   />
                   <NumberInput
                     min={1}
                     type="number"
                     variant="filled"
-                    placeholder="No limit"
-                    label="Maximal views"
+                    placeholder={t(
+                      "upload.modal.accordion.security.max-views.placeholder"
+                    )}
+                    label={t("upload.modal.accordion.security.max-views.label")}
                     {...form.getInputProps("maxViews")}
                   />
                 </Stack>
               </Accordion.Panel>
             </Accordion.Item>
           </Accordion>
-          <Button type="submit">Share</Button>
+          <Button type="submit" data-autofocus>
+            <FormattedMessage id="common.button.share" />
+          </Button>
         </Stack>
       </form>
     </>

frontend/src/hooks/useTranslate.hook.ts

@@ -0,0 +1,39 @@
+import { getCookie } from "cookies-next";
+import { createIntl, createIntlCache, useIntl } from "react-intl";
+import i18nUtil from "../utils/i18n.util";
+
+const useTranslate = () => {
+  const intl = useIntl();
+  return (
+    id: string,
+    values?: Parameters<typeof intl.formatMessage>[1],
+    opts?: Parameters<typeof intl.formatMessage>[2],
+  ) => {
+    return intl.formatMessage({ id }, values, opts) as string;
+  };
+};
+
+const cache = createIntlCache();
+
+export const translateOutsideContext = () => {
+  const locale =
+    getCookie("language")?.toString() ?? navigator.language.split("-")[0];
+
+  const intl = createIntl(
+    {
+      locale,
+      messages: i18nUtil.getLocaleByCode(locale)?.messages,
+      defaultLocale: "en",
+    },
+    cache,
+  );
+  return (
+    id: string,
+    values?: Parameters<typeof intl.formatMessage>[1],
+    opts?: Parameters<typeof intl.formatMessage>[2],
+  ) => {
+    return intl.formatMessage({ id }, values, opts) as string;
+  };
+};
+
+export default useTranslate;

frontend/src/i18n/locales.ts

@@ -0,0 +1,81 @@
+import danish from "./translations/da-DK";
+import german from "./translations/de-DE";
+import english from "./translations/en-US";
+import spanish from "./translations/es-ES";
+import finnish from "./translations/fi-FI";
+import french from "./translations/fr-FR";
+import japanese from "./translations/ja-JP";
+import dutch from "./translations/nl-BE";
+import portuguese from "./translations/pt-BR";
+import russian from "./translations/ru-RU";
+import serbian from "./translations/sr-SP";
+import thai from "./translations/th-TH";
+import chineseSimplified from "./translations/zh-CN";
+
+export const LOCALES = {
+  ENGLISH: {
+    name: "English",
+    code: "en-US",
+    messages: english,
+  },
+  GERMAN: {
+    name: "Deutsch",
+    code: "de-DE",
+    messages: german,
+  },
+  FRENCH: {
+    name: "Français",
+    code: "fr-FR",
+    messages: french,
+  },
+  PORTUGUESE_BRAZIL: {
+    name: "Português (Brasil)",
+    code: "pt-BR",
+    messages: portuguese,
+  },
+  DANISH: {
+    name: "Dansk",
+    code: "da-DK",
+    messages: danish,
+  },
+  SPANISH: {
+    name: "Español",
+    code: "es-ES",
+    messages: spanish,
+  },
+  CHINESE_SIMPLIFIED: {
+    name: "简体中文",
+    code: "zh-CN",
+    messages: chineseSimplified,
+  },
+  FINNISH: {
+    name: "Suomi",
+    code: "fi-FI",
+    messages: finnish,
+  },
+  RUSSIAN: {
+    name: "Русский",
+    code: "ru-RU",
+    messages: russian,
+  },
+  THAI: {
+    name: "ไทย",
+    code: "th-TH",
+    messages: thai,
+  },
+  SERBIAN: {
+    name: "Srpski",
+    code: "sr-SP",
+    messages: serbian,
+  },
+  DUTCH: {
+    name: "Nederlands",
+    code: "nl-BE",
+    messages: dutch,
+  },
+  JAPANESE: {
+    name: "日本語",
+    code: "ja-JP",
+    messages: japanese,
+  },
+};

frontend/src/i18n/translations/da-DK.ts

@@ -0,0 +1,324 @@
+export default {
+  // Navbar
+  "navbar.upload": "Upload",
+  "navbar.signin": "Log ind",
+  "navbar.home": "Hjem",
+  "navbar.signup": "Opret bruger",
+  "navbar.links.shares": "Mine delte filer",
+  "navbar.links.reverse": "Omvendt deling",
+  "navbar.avatar.account": "Min bruger",
+  "navbar.avatar.admin": "Administration",
+  "navbar.avatar.signout": "Log ud",
+  // END navbar
+  // /
+  "home.title": "En <h>self-hosted</h> fildelingsplatform.",
+  "home.description": "Er du sikker på, at du vil overlade dine personlige filer til tredjeparter som WeTransfer?",
+  "home.bullet.a.name": "Self-Hosted",
+  "home.bullet.a.description": "Host Pingvin Share på din egen maskine.",
+  "home.bullet.b.name": "Privatliv",
+  "home.bullet.b.description": "Dine filer er dine filer og bør ikke komme i hænderne på tredjeparter.",
+  "home.bullet.c.name": "Ingen irriterende grænse for filstørrelse",
+  "home.bullet.c.description": "Upload så store filer, som du vil. Kun din harddisk sætter grænsen.",
+  "home.button.start": "Kom i gang",
+  "home.button.source": "Source code",
+  // END /
+  // /auth/signin
+  "signin.title": "Velkommen tilbage",
+  "signin.description": "Har du ikke en bruger endnu?",
+  "signin.button.signup": "Opret bruger",
+  "signin.input.email-or-username": "E-mail eller brugernavn",
+  "signin.input.email-or-username.placeholder": "Din e-mail eller dit brugernavn",
+  "signin.input.password": "Adgangskode",
+  "signin.input.password.placeholder": "Din adgangskode",
+  "signin.button.submit": "Log ind",
+  "signIn.notify.totp-required.title": "2-faktor login påkrævet",
+  "signIn.notify.totp-required.description": "Indtast den aktuelle engangskode fra din 2-faktor Authenticator",
+  // END /auth/signin
+  // /auth/signup
+  "signup.title": "Opret en bruger",
+  "signup.description": "Har du allerede en bruger?",
+  "signup.button.signin": "Log ind",
+  "signup.input.username": "Brugernavn",
+  "signup.input.username.placeholder": "Dit brugernavn",
+  "signup.input.email": "E-mail",
+  "signup.input.email.placeholder": "Din e-mail",
+  "signup.button.submit": "Lad os komme i gang",
+  // END /auth/signup
+  // /auth/reset-password
+  "resetPassword.title": "Glemt din adgangskode?",
+  "resetPassword.description": "Indtast din e-mail for at nulstille din adgangskode.",
+  "resetPassword.notify.success": "En e-mail er blevet sendt med et link til at nulstille din adgangskode.",
+  "resetPassword.button.back": "Tilbage til login",
+  "resetPassword.text.resetPassword": "Nulstil adgangskode",
+  "resetPassword.text.enterNewPassword": "Indtast din nye adgangskode",
+  "resetPassword.input.password": "Ny adgangskode",
+  "resetPassword.notify.passwordReset": "Adgangskoden er blevet nulstillet.",
+  // /account
+  "account.title": "Min bruger",
+  "account.card.info.title": "Brugerinfo",
+  "account.card.info.username": "Brugernavn",
+  "account.card.info.email": "E-mail",
+  "account.notify.info.success": "Brugeren blev opdateret med succes",
+  "account.card.password.title": "Adgangskode",
+  "account.card.password.old": "Gammel adgangskode",
+  "account.card.password.new": "Ny adgangskode",
+  "account.notify.password.success": "Adgangskoden er ændret",
+  "account.card.security.title": "Sikkerhed",
+  "account.card.security.totp.enable.description": "Indtast din nuværende adgangskode for at begynde opsætningen af 2-faktor login",
+  "account.card.security.totp.disable.description": "Indtast din nuværende adgangskode for at begynde opsætningen af 2-faktor login",
+  "account.card.security.totp.button.start": "Start",
+  "account.modal.totp.title": "Aktiver 2-faktor login",
+  "account.modal.totp.step1": "Trin 1: Tilføj din 2-faktor Authenticator",
+  "account.modal.totp.step2": "Trin 2: Valider din kode",
+  "account.modal.totp.enterManually": "Indtast manuelt",
+  "account.modal.totp.code": "Kode",
+  "account.modal.totp.clickToCopy": "Klik for at kopiere",
+  "account.modal.totp.verify": "Bekræft",
+  "account.notify.totp.disable": "2-faktor blev deaktiveret",
+  "account.notify.totp.enable": "2-faktor blev deaktiveret",
+  "account.card.language.title": "Sprog",
+  "account.card.language.description": "The project is translated by the community. Some languages might be incomplete.",
+  "account.card.color.title": "Farveskema",
+  // ThemeSwitcher.tsx
+  "account.theme.dark": "Mørkt",
+  "account.theme.light": "Lyst",
+  "account.theme.system": "System",
+  "account.button.delete": "Slet bruger",
+  "account.modal.delete.title": "Slet bruger",
+  "account.modal.delete.description": "Er du sikker på at du vil slette din bruger, herunder alle dine aktive delinger?",
+  // END /account
+  // /account/shares
+  "account.shares.title": "Mine delte filer",
+  "account.shares.title.empty": "Der er tomt her 👀",
+  "account.shares.description.empty": "Du har ingen delinger.",
+  "account.shares.button.create": "Opret en",
+  "account.shares.info.title": "Share informations",
+  "account.shares.table.id": "ID",
+  "account.shares.table.name": "Navn",
+  "account.shares.table.description": "Beskrivelse",
+  "account.shares.table.visitors": "Besøgende",
+  "account.shares.table.expiresAt": "Udløber d",
+  "account.shares.table.createdAt": "Oprettet d.",
+  "account.shares.table.size": "Størrelse",
+  "account.shares.modal.share-informations": "Share informations",
+  "account.shares.modal.share-link": "Del link",
+  "account.shares.modal.delete.title": "Slet share {share}",
+  "account.shares.modal.delete.description": "Ønsker du virkelig at slette denne deling?",
+  // END /account/shares
+  // /account/reverseShares
+  "account.reverseShares.title": "Omvendt deling",
+  "account.reverseShares.description": "A reverse share allows you to generate a unique URL that allows external users to create a share.",
+  "account.reverseShares.title.empty": "Der er tomt her 👀",
+  "account.reverseShares.description.empty": "You don't have any reverse shares.",
+  // showCreateReverseShareModal.tsx
+  "account.reverseShares.modal.title": "Create reverse share",
+  "account.reverseShares.modal.expiration.label": "Udløb",
+  "account.reverseShares.modal.expiration.minute-singular": "Minut",
+  "account.reverseShares.modal.expiration.minute-plural": "Minutter",
+  "account.reverseShares.modal.expiration.hour-singular": "Time",
+  "account.reverseShares.modal.expiration.hour-plural": "Timer",
+  "account.reverseShares.modal.expiration.day-singular": "Dag",
+  "account.reverseShares.modal.expiration.day-plural": "Dage",
+  "account.reverseShares.modal.expiration.week-singular": "Uge",
+  "account.reverseShares.modal.expiration.week-plural": "Uger",
+  "account.reverseShares.modal.expiration.month-singular": "Måned",
+  "account.reverseShares.modal.expiration.month-plural": "Måneder",
+  "account.reverseShares.modal.expiration.year-singular": "År",
+  "account.reverseShares.modal.expiration.year-plural": "År",
+  "account.reverseShares.modal.max-size.label": "Maksimal størrelse for deling",
+  "account.reverseShares.modal.send-email": "Send e-mail notifikation",
+  "account.reverseShares.modal.send-email.description": "Send en e-mail notifikation, når der oprettes en deling med dette omvendte delingslink.",
+  "account.reverseShares.modal.max-use.label": "Maksimal anvendelser",
+  "account.reverseShares.modal.max-use.description": "Det maksimale antal gange, denne URL kan bruges til at oprette en deling.",
+  "account.reverseShare.never-expires": "Denne omvendte deling udløber aldrig.",
+  "account.reverseShare.expires-on": "Denne omvendte deling udløber den {expiration}.",
+  "account.reverseShares.table.no-shares": "Der er ikke oprettet nogle delinger endnu",
+  "account.reverseShares.table.count.singular": "del",
+  "account.reverseShares.table.count.plural": "shares",
+  "account.reverseShares.table.shares": "Delinger",
+  "account.reverseShares.table.remaining": "Resterende anvendelser",
+  "account.reverseShares.table.max-size": "Maksimal størrelse for deling",
+  "account.reverseShares.table.expires": "Udløber d",
+  "account.reverseShares.modal.reverse-share-link": "Reverse share link",
+  "account.reverseShares.modal.delete.title": "Delete reverse share",
+  "account.reverseShares.modal.delete.description": "Ønsker du virkelig at slette denne omvendte deling? Hvis du gør det, vil de tilknyttede delinger også blive slettet.",
+  // END /account/reverseShares
+  // /admin
+  "admin.title": "Administration",
+  "admin.button.users": "Brugeradministration",
+  "admin.button.config": "Konfiguration",
+  "admin.version": "Version",
+  // END /admin
+  // /admin/users
+  "admin.users.title": "Brugeradministration",
+  "admin.users.table.username": "Brugernavn",
+  "admin.users.table.email": "E-mail",
+  "admin.users.table.admin": "Admin",
+  "admin.users.edit.update.title": "Opdater bruger {username}",
+  "admin.users.edit.update.admin-privileges": "Admin rettigheder",
+  "admin.users.edit.update.change-password.title": "Skift adgangskode",
+  "admin.users.edit.update.change-password.field": "Ny adgangskode",
+  "admin.users.edit.update.change-password.button": "Gem ny adgangskode",
+  "admin.users.edit.update.notify.password.success": "Adgangskoden er ændret",
+  "admin.users.edit.delete.title": "Slet bruger {username}",
+  "admin.users.edit.delete.description": "Er du sikker på du vil slette denne bruger og tilhørende delinger?",
+  // showCreateUserModal.tsx
+  "admin.users.modal.create.title": "Opret bruger",
+  "admin.users.modal.create.username": "Brugernavn",
+  "admin.users.modal.create.email": "E-mail",
+  "admin.users.modal.create.password": "Adgangskode",
+  "admin.users.modal.create.manual-password": "Angiv adgangskode manuelt",
+  "admin.users.modal.create.manual-password.description": "If not checked, the user will receive an email with a link to set their password.",
+  "admin.users.modal.create.admin": "Admin rettigheder",
+  "admin.users.modal.create.admin.description": "If checked, the user will be able to access the admin panel.",
+  // END /admin/users
+  // /upload
+  "upload.title": "Upload",
+  "upload.notify.generic-error": "Der opstod en fejl under afslutningen af din deling.",
+  "upload.notify.count-failed": "{count} files failed to upload. Trying again.",
+  // Dropzone.tsx
+  "upload.dropzone.title": "Upload filer",
+  "upload.dropzone.description": "Drag'n'drop files here to start your share. We can accept only files that are less than {maxSize} in total.",
+  "upload.dropzone.notify.file-too-big": "Your files exceed the maximum share size of {maxSize}.",
+  // FileList.tsx
+  "upload.filelist.name": "Navn",
+  "upload.filelist.size": "Størrelse",
+  // showCreateUploadModal.tsx
+  "upload.modal.title": "Opret Deling",
+  "upload.modal.link.error.invalid": "Can only contain letters, numbers, underscores, and hyphens",
+  "upload.modal.link.error.taken": "Det valgte link er allerede i brug",
+  "upload.modal.not-signed-in": "Du er ikke logget ind",
+  "upload.modal.not-signed-in-description": "Du vil ikke være i stand til at slette din deling manuelt og se antallet af besøgende.",
+  "upload.modal.expires.never": "aldrig",
+  "upload.modal.expires.never-long": "Udløber aldrig",
+  "upload.modal.link.label": "Link",
+  "upload.modal.expires.label": "Udløb",
+  "upload.modal.expires.minute-singular": "Minut",
+  "upload.modal.expires.minute-plural": "Minutter",
+  "upload.modal.expires.hour-singular": "Time",
+  "upload.modal.expires.hour-plural": "Timer",
+  "upload.modal.expires.day-singular": "Dag",
+  "upload.modal.expires.day-plural": "Dage",
+  "upload.modal.expires.week-singular": "Uge",
+  "upload.modal.expires.week-plural": "Uger",
+  "upload.modal.expires.month-singular": "Måned",
+  "upload.modal.expires.month-plural": "Måneder",
+  "upload.modal.expires.year-singular": "År",
+  "upload.modal.expires.year-plural": "År",
+  "upload.modal.accordion.description.title": "Beskrivelse",
+  "upload.modal.accordion.description.placeholder": "Bemærkning til modtagerne af dette share",
+  "upload.modal.accordion.email.title": "E-mail modtagere",
+  "upload.modal.accordion.email.placeholder": "Indtast e-mail modtagere",
+  "upload.modal.accordion.email.invalid-email": "Ugyldig e-mailadresse",
+  "upload.modal.accordion.security.title": "Sikkerhedsindstillinger",
+  "upload.modal.accordion.security.password.label": "Adgangskodebeskyttelse",
+  "upload.modal.accordion.security.password.placeholder": "Ingen adgangskode",
+  "upload.modal.accordion.security.max-views.label": "Max antal visninger",
+  "upload.modal.accordion.security.max-views.placeholder": "Ingen begrænsning",
+  // showCompletedUploadModal.tsx
+  "upload.modal.completed.never-expires": "Denne deling vil aldrig udløbe.",
+  "upload.modal.completed.expires-on": "Denne omvendte deling udløber den {expiration}.",
+  "upload.modal.completed.share-ready": "Delingen er klar",
+  // END /upload
+  // /share/[id]
+  "share.title": "Del {shareId}",
+  "share.description": "Se hvad jeg har delt med dig!",
+  "share.error.visitor-limit-exceeded.title": "Grænsen for besøgende overskredet",
+  "share.error.visitor-limit-exceeded.description": "Besøgsgrænsen for denne deling er blevet overskredet.",
+  "share.error.removed.title": "Deling fjernet",
+  "share.error.not-found.title": "Delingen blev ikke fundet",
+  "share.error.not-found.description": "Den deling, du leder efter, eksisterer ikke.",
+  "share.modal.password.title": "Adgangskode påkrævet",
+  "share.modal.password.description": "For at få adgang til denne deling, indtast venligst adgangskoden til delingen.",
+  "share.modal.password": "Adgangskode",
+  "share.modal.error.invalid-password": "Ugyldig adgangskode",
+  "share.button.download-all": "Download alle",
+  "share.notify.download-all-preparing": "Delingen forberedes. Prøv igen om et par minutter.",
+  "share.modal.file-link": "Fil link",
+  "share.table.name": "Navn",
+  "share.table.size": "Størrelse",
+  "share.modal.file-preview.error.not-supported.title": "Forhåndsvisning ikke understøttet",
+  "share.modal.file-preview.error.not-supported.description": "En forhåndsvisning for thise filtype er ikke understøttet. Download venligst filen for at se den.",
+  // END /share/[id]
+  // /admin/config
+  "admin.config.title": "Konfiguration",
+  "admin.config.category.general": "Generelt",
+  "admin.config.category.share": "Del",
+  "admin.config.category.email": "E-mail",
+  "admin.config.category.smtp": "SMTP",
+  "admin.config.general.app-name": "App-navn",
+  "admin.config.general.app-name.description": "Navnet på applikationen",
+  "admin.config.general.app-url": "App URL",
+  "admin.config.general.app-url.description": "På hvilken URL Pingvin Share er tilgængelig",
+  "admin.config.general.show-home-page": "Vis forside",
+  "admin.config.general.show-home-page.description": "Om forsiden skal vises",
+  "admin.config.general.logo": "Logo",
+  "admin.config.general.logo.description": "Skift dit logo ved at uploade et nyt billede. Billedet skal være PNG og skal have formatet 1:1.",
+  "admin.config.general.logo.placeholder": "Vælg billede",
+  "admin.config.email.enable-share-email-recipients": "Aktiver deling til e-mail modtagere",
+  "admin.config.email.enable-share-email-recipients.description": "Whether to allow emails to share recipients. Only enable this if you have enabled SMTP.",
+  "admin.config.email.share-recipients-subject": "Share recipients subject",
+  "admin.config.email.share-recipients-subject.description": "Subject of the email which gets sent to the share recipients.",
+  "admin.config.email.share-recipients-message": "Share recipients message",
+  "admin.config.email.share-recipients-message.description": "Message which gets sent to the share recipients. Available variables:\n {creator} - The username of the creator of the share\n {shareUrl} - The URL of the share\n {desc} - The description of the share\n {expires} - The expiration date of the share\n The variables will be replaced with the actual value.",
+  "admin.config.email.reverse-share-subject": "Reverse share subject",
+  "admin.config.email.reverse-share-subject.description": "Subject of the email which gets sent when someone created a share with your reverse share link.",
+  "admin.config.email.reverse-share-message": "Reverse share message",
+  "admin.config.email.reverse-share-message.description": "Message which gets sent when someone created a share with your reverse share link. {shareUrl} will be replaced with the creator's name and the share URL.",
+  "admin.config.email.reset-password-subject": "Reset password subject",
+  "admin.config.email.reset-password-subject.description": "Subject of the email which gets sent when a user requests a password reset.",
+  "admin.config.email.reset-password-message": "Nulstil adgangskode besked",
+  "admin.config.email.reset-password-message.description": "Message which gets sent when a user requests a password reset. {url} will be replaced with the reset password URL.",
+  "admin.config.email.invite-subject": "Invitations emne",
+  "admin.config.email.invite-subject.description": "Emne for den e-mail, der sendes, når en administrator inviterer en ny bruger.",
+  "admin.config.email.invite-message": "Invitations besked",
+  "admin.config.email.invite-message.description": "Besked som bliver sendt, når en administrator inviterer en bruger. {url} vil blive erstattet med invitations-URL'en og {password} med adgangskoden.",
+  "admin.config.share.allow-registration": "Tillad oprettelser",
+  "admin.config.share.allow-registration.description": "Om alle skal kunne oprette en bruger",
+  "admin.config.share.allow-unauthenticated-shares": "Tillad uautoriserede delinger",
+  "admin.config.share.allow-unauthenticated-shares.description": "Whether unauthenticated users can create shares",
+  "admin.config.share.max-size": "Maks. størrelse",
+  "admin.config.share.max-size.description": "Maksimal filstørrelse i bytes",
+  "admin.config.share.zip-compression-level": "Zip compression level",
+  "admin.config.share.zip-compression-level.description": "Adjust the level to balance between file size and compression speed. Valid values range from 0 to 9, with 0 being no compression and 9 being maximum compression. ",
+  "admin.config.smtp.enabled": "Aktiveret",
+  "admin.config.smtp.enabled.description": "Om SMTP er aktiveret. Aktiver kun SMTP, hvis du har indtastet SMTP-server vært, port, e-mail, bruger og adgangskode.",
+  "admin.config.smtp.host": "Vært",
+  "admin.config.smtp.host.description": "Vært for SMTP serveren",
+  "admin.config.smtp.port": "Port",
+  "admin.config.smtp.port.description": "Porten til SMTP serveren",
+  "admin.config.smtp.email": "E-mail",
+  "admin.config.smtp.email.description": "E-mail adressen som der skal afsendes fra",
+  "admin.config.smtp.username": "Brugernavn",
+  "admin.config.smtp.username.description": "Brugernavnet til SMTP serveren",
+  "admin.config.smtp.password": "Adgangskode",
+  "admin.config.smtp.password.description": "Adgangskoden til SMTP serveren",
+  "admin.config.smtp.button.test": "Send test e-mail",
+  // 404
+  "404.description": "Ups! Denne side findes ikke.",
+  "404.button.home": "Gå tilbage",
+  // Common translations
+  "common.button.save": "Gem",
+  "common.button.create": "Opret",
+  "common.button.submit": "Submit",
+  "common.button.delete": "Slet",
+  "common.button.cancel": "Annuller",
+  "common.button.confirm": "Bekræft",
+  "common.button.disable": "Deaktiver",
+  "common.button.share": "Del",
+  "common.button.generate": "Generer",
+  "common.button.done": "Færdig",
+  "common.text.link": "Link",
+  "common.text.or": "eller",
+  "common.button.go-back": "Gå tilbage",
+  "common.notify.copied": "Linket blev kopieret til udklipsholderen",
+  "common.success": "Success",
+  "common.error": "Fejl",
+  "common.error.unknown": "En ukendt fejl opstod",
+  "common.error.invalid-email": "Ugyldig e-mail",
+  "common.error.too-short": "Skal være på mindst {length} tegn",
+  "common.error.too-long": "Må højst være {length} tegn",
+  "common.error.exact-length": "Skal være præcis {length} tegn",
+  "common.error.invalid-number": "Skal være et tal",
+  "common.error.field-required": "Dette felt er påkrævet"
+};

frontend/src/i18n/translations/de-DE.ts

@@ -0,0 +1,324 @@
+export default {
+  // Navbar
+  "navbar.upload": "Hochladen",
+  "navbar.signin": "Anmelden",
+  "navbar.home": "Startseite",
+  "navbar.signup": "Registrieren",
+  "navbar.links.shares": "Meine Freigaben",
+  "navbar.links.reverse": "Externe Freigaben",
+  "navbar.avatar.account": "Mein Konto",
+  "navbar.avatar.admin": "Verwaltung",
+  "navbar.avatar.signout": "Abmelden",
+  // END navbar
+  // /
+  "home.title": "Eine <h>selbst gehostete</h> Dateifreigabe-Plattform.",
+  "home.description": "Möchtest du wirklich deine persönlichen Dateien an Drittanbieter wie WeTransfer weitergeben?",
+  "home.bullet.a.name": "Selbst gehostet",
+  "home.bullet.a.description": "Betreibe Pingvin Share auf deinem eigenen Server.",
+  "home.bullet.b.name": "Privatsphäre",
+  "home.bullet.b.description": "Deine Dateien gehören dir und sollten niemals in die Hände Dritter gelangen.",
+  "home.bullet.c.name": "Keine lästige Dateigrößenbegrenzung",
+  "home.bullet.c.description": "Lade Dateien beliebiger Größe hoch. Nur dein Festplattenspeicher stellt die Grenze dar.",
+  "home.button.start": "Lege los",
+  "home.button.source": "Quellcode",
+  // END /
+  // /auth/signin
+  "signin.title": "Willkommen zurück",
+  "signin.description": "Du hast noch kein Konto?",
+  "signin.button.signup": "Registrieren",
+  "signin.input.email-or-username": "Email oder Benutzername",
+  "signin.input.email-or-username.placeholder": "Deine Email Adresse oder Benutzername",
+  "signin.input.password": "Passwort",
+  "signin.input.password.placeholder": "Dein Passwort",
+  "signin.button.submit": "Anmelden",
+  "signIn.notify.totp-required.title": "Zwei-Faktor-Authentifizierung benötigt",
+  "signIn.notify.totp-required.description": "Bitte füge deinen Zwei-Faktor-Authentifizierungscode ein",
+  // END /auth/signin
+  // /auth/signup
+  "signup.title": "Erstelle ein Konto",
+  "signup.description": "Besitzt du bereits ein Konto?",
+  "signup.button.signin": "Anmelden",
+  "signup.input.username": "Benutzername",
+  "signup.input.username.placeholder": "Dein Benutzername",
+  "signup.input.email": "Email",
+  "signup.input.email.placeholder": "Deine Emailadresse",
+  "signup.button.submit": "Lass uns loslegen",
+  // END /auth/signup
+  // /auth/reset-password
+  "resetPassword.title": "Passwort vergessen?",
+  "resetPassword.description": "Gib deine Email Adresse ein, um dein Passwort zurückzusetzen.",
+  "resetPassword.notify.success": "Ein Link zum Rücksetzen des Passwortes wurde an deine Emailadresse versandt.",
+  "resetPassword.button.back": "Zurück zur Anmeldeseite",
+  "resetPassword.text.resetPassword": "Passwort zurücksetzen",
+  "resetPassword.text.enterNewPassword": "Gib dein neues Passwort ein",
+  "resetPassword.input.password": "Neues Passwort",
+  "resetPassword.notify.passwordReset": "Dein Passwort wurde erfolgreich zurückgesetzt.",
+  // /account
+  "account.title": "Mein Konto",
+  "account.card.info.title": "Kontoinformationen",
+  "account.card.info.username": "Benutzername",
+  "account.card.info.email": "Email",
+  "account.notify.info.success": "Konto erfolgreich aktualisiert",
+  "account.card.password.title": "Passwort",
+  "account.card.password.old": "Altes Passwort",
+  "account.card.password.new": "Neues Passwort",
+  "account.notify.password.success": "Passwort erfolgreich geändert",
+  "account.card.security.title": "Sicherheit",
+  "account.card.security.totp.enable.description": "Gib dein aktuelles Passwort ein, um TOTP zu aktivieren",
+  "account.card.security.totp.disable.description": "Gib dein aktuelles Passwort ein, um TOTP zu deaktivieren",
+  "account.card.security.totp.button.start": "Starten",
+  "account.modal.totp.title": "TOTP aktivieren",
+  "account.modal.totp.step1": "Schritt 1: Füge deinen Authenticator hinzu",
+  "account.modal.totp.step2": "Schritt 2: Bestätige deinen Code",
+  "account.modal.totp.enterManually": "Manuell eingeben",
+  "account.modal.totp.code": "Code",
+  "account.modal.totp.clickToCopy": "Klicken zum Kopieren",
+  "account.modal.totp.verify": "Überprüfen",
+  "account.notify.totp.disable": "TOTP erfolgreich deaktiviert",
+  "account.notify.totp.enable": "TOTP erfolgreich aktiviert",
+  "account.card.language.title": "Sprache",
+  "account.card.language.description": "Das Projekt wird von der Community übersetzt. Einige Sprachen könnten unvollständig sein.",
+  "account.card.color.title": "Farbschema",
+  // ThemeSwitcher.tsx
+  "account.theme.dark": "Dunkel",
+  "account.theme.light": "Hell",
+  "account.theme.system": "System",
+  "account.button.delete": "Konto löschen",
+  "account.modal.delete.title": "Konto löschen",
+  "account.modal.delete.description": "Möchtest du wirklich dein Konto inklusive aller aktiven Freigaben löschen?",
+  // END /account
+  // /account/shares
+  "account.shares.title": "Meine Freigaben",
+  "account.shares.title.empty": "Es ist so leer hier 👀",
+  "account.shares.description.empty": "Du hast keine Freigaben eingerichtet.",
+  "account.shares.button.create": "Erstelle eine",
+  "account.shares.info.title": "Teile deine Information",
+  "account.shares.table.id": "ID",
+  "account.shares.table.name": "Name",
+  "account.shares.table.description": "Beschreibung",
+  "account.shares.table.visitors": "Besucher",
+  "account.shares.table.expiresAt": "Läuft ab am",
+  "account.shares.table.createdAt": "Erstellt am",
+  "account.shares.table.size": "Größe",
+  "account.shares.modal.share-informations": "Teile deine Information",
+  "account.shares.modal.share-link": "Freigabe teilen",
+  "account.shares.modal.delete.title": "Lösche Freigabe {share}",
+  "account.shares.modal.delete.description": "Möchtest du wirklich diese Freigabe löschen?",
+  // END /account/shares
+  // /account/reverseShares
+  "account.reverseShares.title": "Externe Freigaben",
+  "account.reverseShares.description": "Eine externe Freigabe erlaubt dir eine einzigartige URL zu erstellen, die externen Benutzern erlaubt Dateien hochzuladen.",
+  "account.reverseShares.title.empty": "Es ist leer hier 👀",
+  "account.reverseShares.description.empty": "Du hast keine externen Freigaben erstellt.",
+  // showCreateReverseShareModal.tsx
+  "account.reverseShares.modal.title": "Externe Freigabe erstellen",
+  "account.reverseShares.modal.expiration.label": "Gültig bis",
+  "account.reverseShares.modal.expiration.minute-singular": "Minute",
+  "account.reverseShares.modal.expiration.minute-plural": "Minuten",
+  "account.reverseShares.modal.expiration.hour-singular": "Stunde",
+  "account.reverseShares.modal.expiration.hour-plural": "Stunden",
+  "account.reverseShares.modal.expiration.day-singular": "Tag",
+  "account.reverseShares.modal.expiration.day-plural": "Tage",
+  "account.reverseShares.modal.expiration.week-singular": "Woche",
+  "account.reverseShares.modal.expiration.week-plural": "Wochen",
+  "account.reverseShares.modal.expiration.month-singular": "Monat",
+  "account.reverseShares.modal.expiration.month-plural": "Monate",
+  "account.reverseShares.modal.expiration.year-singular": "Jahr",
+  "account.reverseShares.modal.expiration.year-plural": "Jahre",
+  "account.reverseShares.modal.max-size.label": "Max. Freigabengröße",
+  "account.reverseShares.modal.send-email": "Email Benachrichtigung senden",
+  "account.reverseShares.modal.send-email.description": "Sendet eine Email Benachrichtigung, wenn eine Datei auf einer externen Freigabe hochgeladen wurde.",
+  "account.reverseShares.modal.max-use.label": "Maximale Nutzungen",
+  "account.reverseShares.modal.max-use.description": "Die maximale Anzahl von Verwendungen der URL, um Dateien hochzuladen.",
+  "account.reverseShare.never-expires": "Diese externe Freigabe wird nicht ablaufen.",
+  "account.reverseShare.expires-on": "Diese externe Freigabe wird am {expiration} ablaufen.",
+  "account.reverseShares.table.no-shares": "Noch keine Freigaben erstellt",
+  "account.reverseShares.table.count.singular": "Freigabe",
+  "account.reverseShares.table.count.plural": "Freigaben",
+  "account.reverseShares.table.shares": "Freigaben",
+  "account.reverseShares.table.remaining": "Verbleibende Verwendungen",
+  "account.reverseShares.table.max-size": "Maximale Freigabegröße",
+  "account.reverseShares.table.expires": "Läuft ab am",
+  "account.reverseShares.modal.reverse-share-link": "Link zu externer Freigabe",
+  "account.reverseShares.modal.delete.title": "Lösche externe Freigabe",
+  "account.reverseShares.modal.delete.description": "Möchtest du wirklich diese externe Freigabe löschen? In diesem Falle werden auch hiermit verbundene Freigaben gelöscht.",
+  // END /account/reverseShares
+  // /admin
+  "admin.title": "Verwaltung",
+  "admin.button.users": "Benutzerverwaltung",
+  "admin.button.config": "Konfiguration",
+  "admin.version": "Version",
+  // END /admin
+  // /admin/users
+  "admin.users.title": "Benutzerverwaltung",
+  "admin.users.table.username": "Benutzername",
+  "admin.users.table.email": "Email",
+  "admin.users.table.admin": "Administrator",
+  "admin.users.edit.update.title": "Benutzer {username} aktualisieren",
+  "admin.users.edit.update.admin-privileges": "Administratorrechte",
+  "admin.users.edit.update.change-password.title": "Passwort ändern",
+  "admin.users.edit.update.change-password.field": "Neues Passwort",
+  "admin.users.edit.update.change-password.button": "Neues Passwort speichern",
+  "admin.users.edit.update.notify.password.success": "Passwort erfolgreich geändert",
+  "admin.users.edit.delete.title": "Löschen des Nutzers {username}",
+  "admin.users.edit.delete.description": "Möchtest du wirklich diesen Benutzer und all seine Freigaben löschen?",
+  // showCreateUserModal.tsx
+  "admin.users.modal.create.title": "Benutzer erstellen",
+  "admin.users.modal.create.username": "Benutzername",
+  "admin.users.modal.create.email": "Email",
+  "admin.users.modal.create.password": "Passwort",
+  "admin.users.modal.create.manual-password": "Passwort manuell festlegen",
+  "admin.users.modal.create.manual-password.description": "Wenn nicht aktiviert, erhält der Benutzer eine Email mit einem Link, um sein Passwort festzulegen.",
+  "admin.users.modal.create.admin": "Administratorrechte",
+  "admin.users.modal.create.admin.description": "Wenn aktiviert, kann der Benutzer auf das Administrator-Panel zugreifen.",
+  // END /admin/users
+  // /upload
+  "upload.title": "Upload",
+  "upload.notify.generic-error": "Während der Erstellung der Freigabe ist ein Fehler aufgetreten.",
+  "upload.notify.count-failed": "{count} Dateien konnten nicht hochgeladen werden. Wird erneut versucht.",
+  // Dropzone.tsx
+  "upload.dropzone.title": "Dateien hochladen",
+  "upload.dropzone.description": "Ziehe Dateien hierher, um deine Freigabe zu starten. Wir können nur Dateien akzeptieren, die insgesamt weniger als {maxSize} groß sind.",
+  "upload.dropzone.notify.file-too-big": "Ihre Dateien überschreiten die maximale Freigabegröße von {maxSize}.",
+  // FileList.tsx
+  "upload.filelist.name": "Name",
+  "upload.filelist.size": "Größe",
+  // showCreateUploadModal.tsx
+  "upload.modal.title": "Erstelle Freigabe",
+  "upload.modal.link.error.invalid": "Darf nur Buchstaben, Zahlen, Unterstriche und Bindestriche enthalten",
+  "upload.modal.link.error.taken": "Dieser Link wird bereits verwendet",
+  "upload.modal.not-signed-in": "Du bist nicht angemeldet",
+  "upload.modal.not-signed-in-description": "Du wirst deine Freigabe nicht löschen können oder die Besucheranzahl sehen.",
+  "upload.modal.expires.never": "niemals",
+  "upload.modal.expires.never-long": "Läuft nicht ab",
+  "upload.modal.link.label": "Link",
+  "upload.modal.expires.label": "Gültig bis",
+  "upload.modal.expires.minute-singular": "Minute",
+  "upload.modal.expires.minute-plural": "Minuten",
+  "upload.modal.expires.hour-singular": "Stunde",
+  "upload.modal.expires.hour-plural": "Stunden",
+  "upload.modal.expires.day-singular": "Tag",
+  "upload.modal.expires.day-plural": "Tage",
+  "upload.modal.expires.week-singular": "Woche",
+  "upload.modal.expires.week-plural": "Wochen",
+  "upload.modal.expires.month-singular": "Monat",
+  "upload.modal.expires.month-plural": "Monate",
+  "upload.modal.expires.year-singular": "Jahr",
+  "upload.modal.expires.year-plural": "Year",
+  "upload.modal.accordion.description.title": "Beschreibung",
+  "upload.modal.accordion.description.placeholder": "Hinweis für die Empfänger dieser Freigabe",
+  "upload.modal.accordion.email.title": "Email Empfänger",
+  "upload.modal.accordion.email.placeholder": "Email der Empfänger eingeben",
+  "upload.modal.accordion.email.invalid-email": "Ungültige Emailadresse",
+  "upload.modal.accordion.security.title": "Sicherheitseinstellungen",
+  "upload.modal.accordion.security.password.label": "Passwortschutz",
+  "upload.modal.accordion.security.password.placeholder": "Kein Passwort",
+  "upload.modal.accordion.security.max-views.label": "Maximale Aufrufe",
+  "upload.modal.accordion.security.max-views.placeholder": "Unbegrenzt",
+  // showCompletedUploadModal.tsx
+  "upload.modal.completed.never-expires": "Diese Freigabe läuft niemals ab.",
+  "upload.modal.completed.expires-on": "Diese Freigabe wird am {expiration} ablaufen.",
+  "upload.modal.completed.share-ready": "Freigabe bereit",
+  // END /upload
+  // /share/[id]
+  "share.title": "Freigabe {shareId}",
+  "share.description": "Schau, was ich mit dir geteilt habe!",
+  "share.error.visitor-limit-exceeded.title": "Besucher Limit erreicht",
+  "share.error.visitor-limit-exceeded.description": "Die maximale Besucheranzahl für diese Freigabe ist überschritten.",
+  "share.error.removed.title": "Freigabe entfernt",
+  "share.error.not-found.title": "Freigabe nicht gefunden",
+  "share.error.not-found.description": "Die gesuchte Freigabe existiert nicht.",
+  "share.modal.password.title": "Passwort erforderlich",
+  "share.modal.password.description": "Um auf diese Freigabe zuzugreifen, gib bitte das Passwort für die Freigabe ein.",
+  "share.modal.password": "Passwort",
+  "share.modal.error.invalid-password": "Ungültiges Passwort",
+  "share.button.download-all": "Alles herunterladen",
+  "share.notify.download-all-preparing": "Die Freigabe wird vorbereitet. Versuche es in ein paar Minuten erneut.",
+  "share.modal.file-link": "Dateilink",
+  "share.table.name": "Name",
+  "share.table.size": "Größe",
+  "share.modal.file-preview.error.not-supported.title": "Vorschau wird nicht unterstützt",
+  "share.modal.file-preview.error.not-supported.description": "Eine Vorschau für diesen Dateityp wird nicht unterstützt. Bitte lade die Datei herunter, um sie anzuzeigen.",
+  // END /share/[id]
+  // /admin/config
+  "admin.config.title": "Einstellungen",
+  "admin.config.category.general": "Allgemein",
+  "admin.config.category.share": "Freigabe",
+  "admin.config.category.email": "E-Mail",
+  "admin.config.category.smtp": "SMTP",
+  "admin.config.general.app-name": "App-Name",
+  "admin.config.general.app-name.description": "Name der Applikation",
+  "admin.config.general.app-url": "App-URL",
+  "admin.config.general.app-url.description": "Auf welcher URL Pingvin Share verfügbar ist",
+  "admin.config.general.show-home-page": "Startseite anzeigen",
+  "admin.config.general.show-home-page.description": "Ob die Startseite angezeigt werden soll",
+  "admin.config.general.logo": "Logo",
+  "admin.config.general.logo.description": "Ändere dein Logo durch Hochladen eines Bildes. Das Bild muss im PNG-Format vorliegen und sollte mit Seitenverhältnis 1:1 sein.",
+  "admin.config.general.logo.placeholder": "Bild auswählen",
+  "admin.config.email.enable-share-email-recipients": "Erlaube das Teilen der Freigabe via Email",
+  "admin.config.email.enable-share-email-recipients.description": "Gibt an, ob Emails an Freigabe-Empfänger ermöglicht werden sollen. Aktiviere dies nur, wenn Du SMTP aktivierst hast.",
+  "admin.config.email.share-recipients-subject": "Betreff für Freigabe-Empfänger",
+  "admin.config.email.share-recipients-subject.description": "Betreff der E-Mail, die an die Freigabe-Empfänger gesendet wird.",
+  "admin.config.email.share-recipients-message": "Nachricht für Freigabe-Empfänger",
+  "admin.config.email.share-recipients-message.description": "Nachricht, die an die Freigabe-Empfänger gesendet wird. Verfügbare Variablen:\n- {creator} - Der Benutzername des Erstellers der Freigabe\n- {shareUrl} - Die URL der Freigabe\n- {desc} - Die Beschreibung der Freigabe\n- {expires} - Das Ablaufdatum der Freigabe\nVariablen werden durch die tatsächlichen Werte ersetzt.",
+  "admin.config.email.reverse-share-subject": "Name der externen Freigabe",
+  "admin.config.email.reverse-share-subject.description": "Betreff der Email, die gesendet wird, wenn jemand eine Datei mit deinem externen Freigabe-Link hochlädt.",
+  "admin.config.email.reverse-share-message": "Nachricht für externe Freigabe",
+  "admin.config.email.reverse-share-message.description": "Nachricht, die gesendet wird, wenn jemand eine Freigabe mit deinem externen Freigabe-Link erstellt. {shareUrl} wird durch den Namen des Erstellers und die Freigabe-URL ersetzt.",
+  "admin.config.email.reset-password-subject": "Betreff für Passwortzurücksetzung",
+  "admin.config.email.reset-password-subject.description": "Betreff der E-Mail, die gesendet wird, wenn ein Benutzer eine Passwortzurücksetzung anfordert.",
+  "admin.config.email.reset-password-message": "Nachricht für Passwortzurücksetzung",
+  "admin.config.email.reset-password-message.description": "Nachricht, die gesendet wird, wenn ein Benutzer eine Passwortzurücksetzung anfordert. {url} wird durch die URL für das Zurücksetzen des Passworts ersetzt.",
+  "admin.config.email.invite-subject": "Betreff für Einladung",
+  "admin.config.email.invite-subject.description": "Betreff der E-Mail, die gesendet wird, wenn ein Administrator einen Benutzer einlädt.",
+  "admin.config.email.invite-message": "Nachricht für Einladung",
+  "admin.config.email.invite-message.description": "Nachricht, die gesendet wird, wenn ein Administrator einen Benutzer einlädt. {url} wird durch die Einladungs-URL und {password} durch das Passwort ersetzt.",
+  "admin.config.share.allow-registration": "Registrierung erlauben",
+  "admin.config.share.allow-registration.description": "Gibt an, ob eine Registrierung erlaubt ist",
+  "admin.config.share.allow-unauthenticated-shares": "Nicht authentifizierte Freigaben erlauben",
+  "admin.config.share.allow-unauthenticated-shares.description": "Gibt an, ob nicht authentifizierte Benutzer Freigaben erstellen können",
+  "admin.config.share.max-size": "Maximale Größe",
+  "admin.config.share.max-size.description": "Maximale Größe einer Freigabe in Bytes",
+  "admin.config.share.zip-compression-level": "Zip Komprimierungsstufe",
+  "admin.config.share.zip-compression-level.description": "Passe den Wert an, um ein Gleichgewicht zwischen Dateigröße und Komprimierungsgeschwindigkeit herzustellen. Gültige Werte liegen zwischen 0 und 9, wobei 0 für keine Komprimierung und 9 für maximale Komprimierung steht.",
+  "admin.config.smtp.enabled": "Aktiviert",
+  "admin.config.smtp.enabled.description": "Gibt an, ob SMTP aktiviert ist. Aktiviere dies nur, wenn Du den Host, den Port, die Email, den Benutzernamen und das Passwort deines SMTP-Servers eingegeben hast.",
+  "admin.config.smtp.host": "Host",
+  "admin.config.smtp.host.description": "Host des SMTP-Servers",
+  "admin.config.smtp.port": "Port",
+  "admin.config.smtp.port.description": "Port des SMTP-Servers",
+  "admin.config.smtp.email": "E-Mail",
+  "admin.config.smtp.email.description": "E-Mail-Adresse, von der die E-Mails gesendet werden",
+  "admin.config.smtp.username": "Benutzername",
+  "admin.config.smtp.username.description": "Benutzername des SMTP-Servers",
+  "admin.config.smtp.password": "Passwort",
+  "admin.config.smtp.password.description": "Passwort des SMTP-Servers",
+  "admin.config.smtp.button.test": "Test-E-Mail senden",
+  // 404
+  "404.description": "Ups, diese Seite existiert nicht.",
+  "404.button.home": "Zurück zur Startseite",
+  // Common translations
+  "common.button.save": "Speichern",
+  "common.button.create": "Erstellen",
+  "common.button.submit": "Bestätigen",
+  "common.button.delete": "Löschen",
+  "common.button.cancel": "Abbrechen",
+  "common.button.confirm": "Bestätigen",
+  "common.button.disable": "Deaktivieren",
+  "common.button.share": "Teilen",
+  "common.button.generate": "Generieren",
+  "common.button.done": "Fertig",
+  "common.text.link": "Link",
+  "common.text.or": "oder",
+  "common.button.go-back": "Zurück",
+  "common.notify.copied": "Dein Link wurde in die Zwischenablage kopiert",
+  "common.success": "Erfolg",
+  "common.error": "Fehler",
+  "common.error.unknown": "Ein unbekannter Fehler ist aufgetreten",
+  "common.error.invalid-email": "Ungültige E-Mail-Adresse",
+  "common.error.too-short": "Muss mindestens {length} Zeichen enthalten",
+  "common.error.too-long": "Muss maximal {length} Zeichen enthalten",
+  "common.error.exact-length": "Muss genau {length} Zeichen lang sein",
+  "common.error.invalid-number": "Muss eine Zahl sein",
+  "common.error.field-required": "Dieses Feld ist erforderlich"
+};