Compare commits

...

75 Commits

Author SHA1 Message Date
Bernd Storath 9368b857e8 Bump version to 15.1.0 2025-07-01 08:50:21 +02:00
Bernd Storath 0f663df7f6 Add option to disable ipv6 (#1951)
* add option to disable ipv6

* don't add ipv6 address

* update docs
2025-07-01 07:57:14 +02:00
Kirill Dvoretskov 68fde7d165 Updated container launch commands (#1989)
* Updated container launch commands

* one more occurrence

---------

Co-authored-by: Bernd Storath <999999bst@gmail.com>
2025-06-30 08:01:26 +02:00
杨黄林 501a784264 Add Chinese Simplified (#1990)
* Add Chinese Simplified

* fix formatting

---------

Co-authored-by: Bernd Storath <999999bst@gmail.com>
2025-06-30 07:55:00 +02:00
Bernd Storath 629c184195 update packages 2025-06-30 07:54:45 +02:00
Rayyamhk 76b8818a33 feat: Add Traditional Chinese (zh-HK) i18n Support (#1988)
* feat:add translation for zh-hk

* fix formatting issues
2025-06-27 08:25:02 +02:00
Pascal Dietrich 6c52301a64 Add german translations (#1889) 2025-06-26 16:05:44 +02:00
Bernd Storath be26db63ca add docs on how to add/update translation 2025-06-26 15:27:27 +02:00
Bernd Storath 962bfa213f update screenshot 2025-06-26 14:56:15 +02:00
Bernd Storath ee00e5c914 update packages 2025-06-23 09:53:30 +02:00
Bernd Storath 6343213538 v14 migration env vars
make note that the env vars from v14 won't be migrated
2025-06-11 11:14:13 +02:00
Bernd Storath 187bdc0836 update packages 2025-06-11 07:42:21 +02:00
wh!le f2520f0481 docs for caddy example (#1939) 2025-06-09 16:04:59 +02:00
Ezmana 5e9a73645b Add French language (#1924)
* French translation file creation

* Add French language
2025-06-09 15:55:12 +02:00
Bernd Storath 783fa3286c update packages
removed override as every package updated
2025-06-02 08:23:26 +02:00
Nikolas 77b4f9db65 Added Ukrainian language (#1906)
* Add files via upload

Ukrainian language

* Update ua.json

* Update i18n.config.ts

* Update i18n.config.ts

* Rename ua.json to uk.json

* Update i18n.config.ts

* Update nuxt.config.ts

* Update uk.json
2025-06-01 16:40:31 +02:00
Bernd Storath 0f6f07161b update docker compose 2025-05-28 13:50:13 +02:00
Bernd Storath d75a836de9 update changelog 2025-05-28 12:33:44 +02:00
Bernd Storath f79b0fd025 Bump version to 15.0.0 2025-05-28 12:22:42 +02:00
Bernd Storath d2ce82241b Bump version to 15.0.0-beta.13 2025-05-28 12:11:03 +02:00
Bernd Storath 8c395ec275 fix pre-release 2025-05-28 12:10:47 +02:00
Bernd Storath 10f42170f3 Bump version to 15.0.0-beta.13 2025-05-28 11:59:38 +02:00
Bernd Storath a8aa85bdaa Feat: map client to interface (#1886)
map client to interface
2025-05-28 11:58:33 +02:00
Bernd Storath 7e1aa5807d Feat: variants (#1885)
add primary & secondary button & actionfield
2025-05-28 11:44:16 +02:00
Bernd Storath df57921b8e update packages 2025-05-27 09:39:37 +02:00
Bernd Storath 4fbf059e61 add armv7 support
override until
- https://github.com/nuxt/nuxt/issues/32124
- https://github.com/nuxt-modules/i18n/issues/3605
are fixed
2025-05-16 09:11:50 +02:00
Bernd Storath b150e3f3b4 update packages 2025-05-16 08:54:52 +02:00
Bernd Storath aed10ab0bd update packages 2025-05-12 07:41:40 +02:00
Bernd Storath 478e7207b2 don't hoist libsql
not needed anymore
2025-05-05 11:15:24 +02:00
Bernd Storath c8dc710435 update packages 2025-05-05 10:25:28 +02:00
Bernd Storath 19d9e3b7d7 update packages
this greatly improves qr code size and quality
2025-04-26 16:49:51 +02:00
Bernd Storath c4efb1d03a update packages
argon2 now prebuilds for armv7
only libsql is missing: https://github.com/tursodatabase/libsql-js/pull/169
2025-04-24 11:50:35 +02:00
Bernd Storath 529b9eeb88 improve image size 2025-04-22 16:09:18 +02:00
Bernd Storath 69ee741d7e Feat: distributed build (#1829)
* distribute build across runners

* better formatting

* fix issues

* fix matrix

* retrigger build
2025-04-22 14:11:28 +02:00
Bernd Storath f2dc38e91b add setup guide 2025-04-22 10:47:55 +02:00
Bernd Storath 64e9484331 update packages 2025-04-22 07:46:33 +02:00
Bernd Storath c777fa30b3 publish stable docker compose (#1828) 2025-04-22 07:44:28 +02:00
Bernd Storath 734d91fd98 replace nightly with edge (#1819) 2025-04-17 15:58:45 +02:00
Bernd Storath 84ed7b299f Feat: Cli (#1818)
* add cli

* fix lint

* add docs, include cli packages

* fix docs, username instead of name
2025-04-16 14:17:02 +02:00
Bernd Storath 1cfe6404b2 Feat docs (#1814)
* improve docs and formatting

* lint in ci

avoid using bundled prettier from vscode extension

* fix action, typos

* remove header

* remove unused deps
2025-04-15 12:43:57 +02:00
Bernd Storath 2a32c1b9c0 remove unused dependencies 2025-04-14 08:36:07 +02:00
Bernd Storath 3ef258a28a Bump version to 15.0.0-beta.12 2025-04-11 23:35:51 +02:00
Bernd Storath ff783fd4d1 Feat: Improve Docs (#1791)
* improve docs

* preplan guides

* fix spelling

* fix nftables rules

* consistent wg-easy code block

* fix grammar
2025-04-11 23:25:58 +02:00
Bernd Storath 65aa067100 update packages 2025-04-11 22:46:03 +02:00
Edgars 48e6949a4d Update docker-run.md (#1804)
Small fixes were made to:

- adjust indentation for the first line in code blocks;
- fix backticks;
- make the URL interactive.
2025-04-09 11:25:30 +02:00
Bernd Storath 9ebf2c1d33 chore: disable latest tag for docker
so old installations wont break until v15 is stable enough
2025-04-02 09:32:52 +02:00
Bernd Storath d0f85316a6 chore: delete changelog from docs 2025-04-02 09:20:18 +02:00
Bernd Storath ff9fd553c5 Fix: sync / rekey issue (#1789)
only sync if needed
2025-04-02 08:49:04 +02:00
Bernd Storath e92ee0464e Feat: Server Endpoint (#1785)
* add server endpoint to client

* be able to update endpoint over api
2025-04-01 16:13:51 +02:00
Bernd Storath 9df049d3f4 Feat: startup info (#1784)
add startup info
2025-04-01 15:18:13 +02:00
Bernd Storath 32b73b850a Feat: 2fa (#1783)
* preplan otp, better qrcode library

* add 2fa as feature

* add totp generation

* working totp lifecycle

* don't allow disabled user to log in

not a security issue as permission handler would fail anyway

* require 2fa on login

if enabled

* update packages

* fix typo

* remove console.logs
2025-04-01 14:43:48 +02:00
Bernd Storath 1c7f64ebd5 Bump version to 15.0.0-beta.11 2025-03-31 10:32:27 +02:00
Bernd Storath 589ec1fe9a Feat: Show insecure warning (#1779)
show insecure warning
2025-03-31 10:29:22 +02:00
Bernd Storath 6e0d758e36 Feat: Hash metrics password (#1778)
hash the metrics password

if it is not already hashed
2025-03-31 09:58:02 +02:00
Pokydko Oleksandr 940edb2b0c Improvements to username and password validations (#1745)
* Fix: Improve special character regex (#1744)
* update password special character regex to support
( `-` `_` `=` `+` `[` `]` `;` `'` `\` `/` )

* Fix: Allow usernames starting from 2 characters (#1744)
* update username validation to support short usernames starting from 2 characters

* remove char validation altogether

---------

Co-authored-by: Bernd Storath <999999bst@gmail.com>
2025-03-31 08:58:24 +02:00
Bernd Storath d51f12a82f update packages 2025-03-31 07:51:21 +02:00
Bernd Storath 4a3747fa12 update packages 2025-03-24 07:53:02 +01:00
Bernd Storath 499fb096b6 Fix: button triggering form (#1750)
prevent button from triggering form
2025-03-19 11:50:48 +01:00
Bernd Storath c5c3a65bbf Fix: slow suggest Host Address (#1746)
load on client instead of block
2025-03-17 14:28:03 +01:00
Bernd Storath c133446f9c Bump version to 15.0.0-beta.10 2025-03-14 14:28:12 +01:00
Bernd Storath e8b3e54228 fix libsql bundling issue 2025-03-14 14:26:08 +01:00
Bernd Storath a9a51337da Bump version to 15.0.0-beta.9 2025-03-14 12:22:43 +01:00
Bernd Storath bbee7e04ed Feat: add ability to restart interface (#1740)
add ability to restart interface
2025-03-14 12:19:26 +01:00
Bernd Storath 198b240755 Feat: Suggest IP or Hostname (#1739)
* get ip and hostnames

* use heroicons

* add host field

* get private info

* unstyled prototype

* styled select

* add to setup

* fix types
2025-03-14 10:33:02 +01:00
Bernd Storath 86bdbe4c3d Feat: Initial Setup through env vars (#1736)
* initial support for initial setup

* improve setup

* improve mobile view

* move base admin route

* admin panel mobile view

* set initial host and port

* add docs

* properly setup everything, use for dev env

* change userconfig and interface port on setup, note users afterwards
2025-03-13 11:28:05 +01:00
Bernd Storath 4890bb28e5 Bump version to 15.0.0-beta.8 2025-03-12 13:47:46 +01:00
Bernd Storath c3dbd3a815 Fix: Add ui port to template (#1735)
* add ui port to template

* update changelog
2025-03-12 13:44:45 +01:00
Bernd Storath fc480df910 Fix: Update ip outside of cidr (#1733)
* update packages

* check if ip is included on update

* update package manager
2025-03-12 12:47:12 +01:00
dependabot[bot] b3bd2502af build(deps): bump nuxt from 3.15.4 to 3.16.0 in /src (#1727)
Bumps [nuxt](https://github.com/nuxt/nuxt/tree/HEAD/packages/nuxt) from 3.15.4 to 3.16.0.
- [Release notes](https://github.com/nuxt/nuxt/releases)
- [Commits](https://github.com/nuxt/nuxt/commits/v3.16.0/packages/nuxt)

---
updated-dependencies:
- dependency-name: nuxt
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2025-03-10 12:26:21 +01:00
dependabot[bot] eb5ad91022 build(deps-dev): bump eslint from 9.21.0 to 9.22.0 in /src (#1726)
Bumps [eslint](https://github.com/eslint/eslint) from 9.21.0 to 9.22.0.
- [Release notes](https://github.com/eslint/eslint/releases)
- [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md)
- [Commits](https://github.com/eslint/eslint/compare/v9.21.0...v9.22.0)

---
updated-dependencies:
- dependency-name: eslint
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2025-03-10 08:11:31 +01:00
dependabot[bot] f2955a1278 build(deps): bump @nuxtjs/i18n from 9.2.1 to 9.3.1 in /src (#1728)
Bumps [@nuxtjs/i18n](https://github.com/nuxt-modules/i18n) from 9.2.1 to 9.3.1.
- [Release notes](https://github.com/nuxt-modules/i18n/releases)
- [Changelog](https://github.com/nuxt-modules/i18n/blob/main/CHANGELOG.md)
- [Commits](https://github.com/nuxt-modules/i18n/compare/v9.2.1...v9.3.1)

---
updated-dependencies:
- dependency-name: "@nuxtjs/i18n"
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2025-03-10 07:34:37 +01:00
dependabot[bot] 1b76c066e0 build(deps-dev): bump @nuxt/eslint from 1.1.0 to 1.2.0 in /src (#1729)
Bumps [@nuxt/eslint](https://github.com/nuxt/eslint/tree/HEAD/packages/module) from 1.1.0 to 1.2.0.
- [Release notes](https://github.com/nuxt/eslint/releases)
- [Commits](https://github.com/nuxt/eslint/commits/v1.2.0/packages/module)

---
updated-dependencies:
- dependency-name: "@nuxt/eslint"
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2025-03-10 07:27:29 +01:00
Bernd Storath 5b68cc7311 Feat: Confirm setup password (#1722)
confirm setup password
2025-03-07 16:05:40 +01:00
Bernd Storath 0597470f4c Bump version to 15.0.0-beta.7 2025-03-07 15:00:12 +01:00
Bernd Storath 159a51cff4 Feat: Global config override (#1720)
* be able to change dns. implement global override

* link donate to readme

* implement global config for allowed ips

* change translations, fix generation

* improve docs
2025-03-07 14:59:06 +01:00
160 changed files with 8516 additions and 4700 deletions
-23
View File
@@ -1,23 +0,0 @@
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
# The JSON files contain newlines inconsistently
[*.json]
insert_final_newline = ignore
# Minified JavaScript files shouldn't be changed
[**.min.js]
indent_style = ignore
insert_final_newline = ignore
[*.md]
trim_trailing_whitespace = false
+100 -15
View File
@@ -4,21 +4,38 @@ on:
workflow_dispatch:
jobs:
docker:
name: Build & Deploy Docker
runs-on: ubuntu-latest
docker-build:
name: Build Docker
runs-on: ${{ matrix.arch.os }}
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
contents: read
strategy:
fail-fast: false
matrix:
arch:
- platform: linux/amd64
os: ubuntu-latest
- platform: linux/arm64
os: ubuntu-24.04-arm
- platform: linux/arm/v7
os: ubuntu-24.04-arm
steps:
- uses: actions/checkout@v4
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Prepare
run: |
platform=${{ matrix.arch.platform }}
echo "PLATFORM_PAIR=${platform//\//-}" >> $GITHUB_ENV
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
@@ -27,15 +44,83 @@ jobs:
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Build & Publish Docker Image
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and push by digest
id: build
uses: docker/build-push-action@v6
with:
context: .
push: true
platforms: linux/amd64,linux/arm64
tags: ghcr.io/wg-easy/wg-easy:development
cache-from: type=gha
cache-to: type=gha,mode=min
platforms: ${{ matrix.arch.platform }}
labels: ${{ steps.meta.outputs.labels }}
tags: ghcr.io/wg-easy/wg-easy
outputs: type=image,push-by-digest=true,name-canonical=true,push=true
cache-from: type=gha,scope=build-${{ env.PLATFORM_PAIR }}
cache-to: type=gha,mode=min,scope=build-${{ env.PLATFORM_PAIR }}
- name: Export digest
run: |
mkdir -p ${{ runner.temp }}/digests
digest="${{ steps.build.outputs.digest }}"
touch "${{ runner.temp }}/digests/${digest#sha256:}"
- name: Upload digest
uses: actions/upload-artifact@v4
with:
name: digests-${{ env.PLATFORM_PAIR }}
path: ${{ runner.temp }}/digests/*
if-no-files-found: error
retention-days: 1
docker-merge:
name: Merge & Deploy Docker
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
needs: docker-build
steps:
- name: Download digests
uses: actions/download-artifact@v4
with:
path: ${{ runner.temp }}/digests
pattern: digests-*
merge-multiple: true
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
tags: |
type=raw,value=development
- name: Create manifest list and push
working-directory: ${{ runner.temp }}/digests
run: |
docker buildx imagetools create $(jq -cr '.tags | map("-t " + .) | join(" ")' <<< "$DOCKER_METADATA_OUTPUT_JSON") \
$(printf 'ghcr.io/wg-easy/wg-easy@sha256:%s ' *)
- name: Inspect image
run: |
docker buildx imagetools inspect ghcr.io/wg-easy/wg-easy:${{ steps.meta.outputs.version }}
docs:
name: Build & Deploy Docs
@@ -43,7 +128,7 @@ jobs:
if: github.repository_owner == 'wg-easy'
permissions:
contents: write
needs: docker
needs: docker-merge
steps:
- uses: actions/checkout@v4
+167
View File
@@ -0,0 +1,167 @@
name: Edge
on:
workflow_dispatch:
push:
branches:
- master
concurrency:
group: ${{ github.workflow }}-${{ github.ref }}
cancel-in-progress: true
jobs:
docker-build:
name: Build Docker
runs-on: ${{ matrix.arch.os }}
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
strategy:
fail-fast: false
matrix:
arch:
- platform: linux/amd64
os: ubuntu-latest
- platform: linux/arm64
os: ubuntu-24.04-arm
- platform: linux/arm/v7
os: ubuntu-24.04-arm
steps:
- uses: actions/checkout@v4
with:
ref: master
- name: Prepare
run: |
platform=${{ matrix.arch.platform }}
echo "PLATFORM_PAIR=${platform//\//-}" >> $GITHUB_ENV
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and push by digest
id: build
uses: docker/build-push-action@v6
with:
context: .
platforms: ${{ matrix.arch.platform }}
labels: ${{ steps.meta.outputs.labels }}
tags: ghcr.io/wg-easy/wg-easy
outputs: type=image,push-by-digest=true,name-canonical=true,push=true
cache-from: type=gha,scope=build-${{ env.PLATFORM_PAIR }}
cache-to: type=gha,mode=min,scope=build-${{ env.PLATFORM_PAIR }}
- name: Export digest
run: |
mkdir -p ${{ runner.temp }}/digests
digest="${{ steps.build.outputs.digest }}"
touch "${{ runner.temp }}/digests/${digest#sha256:}"
- name: Upload digest
uses: actions/upload-artifact@v4
with:
name: digests-${{ env.PLATFORM_PAIR }}
path: ${{ runner.temp }}/digests/*
if-no-files-found: error
retention-days: 1
docker-merge:
name: Merge & Deploy Docker
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
needs: docker-build
steps:
- name: Download digests
uses: actions/download-artifact@v4
with:
path: ${{ runner.temp }}/digests
pattern: digests-*
merge-multiple: true
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
tags: |
type=raw,value=edge
- name: Create manifest list and push
working-directory: ${{ runner.temp }}/digests
run: |
docker buildx imagetools create $(jq -cr '.tags | map("-t " + .) | join(" ")' <<< "$DOCKER_METADATA_OUTPUT_JSON") \
$(printf 'ghcr.io/wg-easy/wg-easy@sha256:%s ' *)
- name: Inspect image
run: |
docker buildx imagetools inspect ghcr.io/wg-easy/wg-easy:${{ steps.meta.outputs.version }}
docs:
name: Build & Deploy Docs
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
permissions:
contents: write
needs: docker-merge
steps:
- uses: actions/checkout@v4
with:
ref: master
- name: Setup Python
uses: actions/setup-python@v5
with:
python-version: 3.11.9
cache: "pip"
cache-dependency-path: docs/requirements.txt
- name: Install Dependencies
run: |
pip install -r docs/requirements.txt
- name: Setup Git User
run: |
git config --global user.name 'github-actions[bot]'
git config --global user.email 'github-actions[bot]@users.noreply.github.com'
- name: Build Docs Website
run: |
cd docs
git fetch origin gh-pages --depth=1 || true
mike deploy --push --update-aliases edge
-77
View File
@@ -1,77 +0,0 @@
name: Nightly
on:
workflow_dispatch:
schedule:
- cron: "0 0 * * *"
jobs:
docker:
name: Build & Deploy Docker
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
contents: read
steps:
- uses: actions/checkout@v4
with:
ref: master
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Build & Publish Docker Image
uses: docker/build-push-action@v6
with:
context: .
push: true
platforms: linux/amd64,linux/arm64
tags: ghcr.io/wg-easy/wg-easy:nightly
cache-from: type=gha
cache-to: type=gha,mode=min
docs:
name: Build & Deploy Docs
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
permissions:
contents: write
needs: docker
steps:
- uses: actions/checkout@v4
with:
ref: master
- name: Setup Python
uses: actions/setup-python@v5
with:
python-version: 3.11.9
cache: "pip"
cache-dependency-path: docs/requirements.txt
- name: Install Dependencies
run: |
pip install -r docs/requirements.txt
- name: Setup Git User
run: |
git config --global user.name 'github-actions[bot]'
git config --global user.email 'github-actions[bot]@users.noreply.github.com'
- name: Build Docs Website
run: |
cd docs
git fetch origin gh-pages --depth=1 || true
mike deploy --push --update-aliases nightly
+18 -6
View File
@@ -11,14 +11,26 @@ concurrency:
jobs:
docker:
name: Build Docker
runs-on: ubuntu-latest
runs-on: ${{ matrix.arch.os }}
if: github.repository_owner == 'wg-easy'
permissions:
packages: write
contents: read
strategy:
fail-fast: false
matrix:
arch:
- platform: linux/amd64
os: ubuntu-latest
- platform: linux/arm64
os: ubuntu-24.04-arm
- platform: linux/arm/v7
os: ubuntu-24.04-arm
steps:
- uses: actions/checkout@v4
- name: Prepare
run: |
platform=${{ matrix.arch.platform }}
echo "PLATFORM_PAIR=${platform//\//-}" >> $GITHUB_ENV
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
@@ -37,7 +49,7 @@ jobs:
with:
context: .
push: false
platforms: linux/amd64,linux/arm64
platforms: ${{ matrix.arch.platform }}
tags: ghcr.io/wg-easy/wg-easy:pr
cache-from: type=gha
cache-to: type=gha,mode=min
cache-to: type=gha,mode=min,scope=build-${{ env.PLATFORM_PAIR }}
+105 -27
View File
@@ -6,21 +6,107 @@ on:
tags:
- "v*"
# This workflow does not support fixing old versions
# as this will break the latest and major tags
jobs:
docker:
name: Build & Deploy Docker
docker-build:
name: Build Docker
runs-on: ${{ matrix.arch.os }}
if: |
github.repository_owner == 'wg-easy' &&
startsWith(github.ref, 'refs/tags/v')
permissions:
packages: write
strategy:
fail-fast: false
matrix:
arch:
- platform: linux/amd64
os: ubuntu-latest
- platform: linux/arm64
os: ubuntu-24.04-arm
- platform: linux/arm/v7
os: ubuntu-24.04-arm
steps:
- uses: actions/checkout@v4
- name: Prepare
run: |
platform=${{ matrix.arch.platform }}
echo "PLATFORM_PAIR=${platform//\//-}" >> $GITHUB_ENV
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and push by digest
id: build
uses: docker/build-push-action@v6
with:
context: .
platforms: ${{ matrix.arch.platform }}
labels: ${{ steps.meta.outputs.labels }}
tags: ghcr.io/wg-easy/wg-easy
outputs: type=image,push-by-digest=true,name-canonical=true,push=true
cache-from: type=gha,scope=build-${{ env.PLATFORM_PAIR }}
cache-to: type=gha,mode=min,scope=build-${{ env.PLATFORM_PAIR }}
- name: Export digest
run: |
mkdir -p ${{ runner.temp }}/digests
digest="${{ steps.build.outputs.digest }}"
touch "${{ runner.temp }}/digests/${digest#sha256:}"
- name: Upload digest
uses: actions/upload-artifact@v4
with:
name: digests-${{ env.PLATFORM_PAIR }}
path: ${{ runner.temp }}/digests/*
if-no-files-found: error
retention-days: 1
docker-merge:
name: Merge & Deploy Docker
runs-on: ubuntu-latest
if: |
github.repository_owner == 'wg-easy' &&
startsWith(github.ref, 'refs/tags/v')
permissions:
packages: write
contents: read
needs: docker-build
steps:
- uses: actions/checkout@v4
- name: Download digests
uses: actions/download-artifact@v4
with:
path: ${{ runner.temp }}/digests
pattern: digests-*
merge-multiple: true
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
@@ -31,28 +117,22 @@ jobs:
with:
images: |
ghcr.io/wg-easy/wg-easy
flavor: |
latest=false
tags: |
type=semver,pattern={{version}}
type=semver,pattern={{major}}
type=semver,pattern={{major}}.{{minor}}
- name: Login to GitHub Container Registry
uses: docker/login-action@v3
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Create manifest list and push
working-directory: ${{ runner.temp }}/digests
run: |
docker buildx imagetools create $(jq -cr '.tags | map("-t " + .) | join(" ")' <<< "$DOCKER_METADATA_OUTPUT_JSON") \
$(printf 'ghcr.io/wg-easy/wg-easy@sha256:%s ' *)
- name: Build & Publish Docker Image
uses: docker/build-push-action@v6
with:
context: .
push: true
platforms: linux/amd64,linux/arm64
tags: ${{ steps.meta.outputs.tags }}
labels: ${{ steps.meta.outputs.labels }}
cache-from: type=gha
cache-to: type=gha,mode=min
- name: Inspect image
run: |
docker buildx imagetools inspect ghcr.io/wg-easy/wg-easy:${{ steps.meta.outputs.version }}
docs:
name: Build & Deploy Docs
@@ -62,7 +142,7 @@ jobs:
startsWith(github.ref, 'refs/tags/v')
permissions:
contents: write
needs: docker
needs: docker-merge
steps:
- uses: actions/checkout@v4
@@ -87,11 +167,9 @@ jobs:
cd docs
git fetch origin gh-pages --depth=1 || true
# latest will point to old docs if old tag is pushed
# Extract version numbers
DOCS_VERSION=${GITHUB_REF#refs/tags/} # e.g. v1.2.3 or v1.2.3-beta
MINOR_VERSION=$(echo $DOCS_VERSION | cut -d. -f1,2) # e.g. v1.2
DOCS_VERSION=${GITHUB_REF#refs/tags/} # e.g. v1.2.3 or v1.2.3-beta
MINOR_VERSION=$(echo $DOCS_VERSION | cut -d. -f1,2) # e.g. v1.2
# Check if it's a stable release (only numbers, no '-')
if [[ "$DOCS_VERSION" =~ ^v[0-9]+\.[0-9]+\.[0-9]+$ ]]; then
+27
View File
@@ -7,9 +7,36 @@ on:
pull_request:
jobs:
docs:
name: Check Docs
runs-on: ubuntu-latest
if: github.repository_owner == 'wg-easy'
steps:
- name: Checkout repository
uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
name: Install pnpm
with:
run_install: false
- name: Setup Node
uses: actions/setup-node@v4
with:
node-version: "lts/*"
check-latest: true
cache: "pnpm"
- name: Check docs formatting
run: |
pnpm install
pnpm format:check:docs
lint:
name: Lint
runs-on: ubuntu-latest
needs: docs
if: github.repository_owner == 'wg-easy'
strategy:
+1
View File
@@ -1,2 +1,3 @@
.DS_Store
*.swp
node_modules
+2 -1
View File
@@ -9,6 +9,7 @@
"yoavbls.pretty-ts-errors",
"bradlc.vscode-tailwindcss",
"vue.volar",
"lokalise.i18n-ally"
"lokalise.i18n-ally",
"DavidAnson.vscode-markdownlint"
]
}
+8
View File
@@ -6,6 +6,9 @@
"nuxtr.vueFiles.style.addStyleTag": false,
"nuxtr.piniaFiles.defaultTemplate": "setup",
"nuxtr.monorepoMode.DirectoryName": "src",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "always"
},
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
@@ -15,6 +18,11 @@
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[markdown]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.tabSize": 4,
"editor.useTabStops": false
},
"typescript.tsdk": "./src/node_modules/typescript/lib",
"i18n-ally.enabledFrameworks": ["vue"],
"i18n-ally.localesPaths": ["src/i18n/locales"],
+34 -2
View File
@@ -5,11 +5,37 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
## [Unreleased]
## [15.1.0] - 2025-07-01
## Added
- Added Ukrainian language (#1906)
- Add French language (#1924)
- docs for caddy example (#1939)
- add docs on how to add/update translation (be26db6)
- Add german translations (#1889)
- feat: Add Traditional Chinese (zh-HK) i18n Support (#1988)
- Add Chinese Simplified (#1990)
- Add option to disable ipv6 (#1951)
## Fixed
- Updated container launch commands (#1989)
- update screenshot (962bfa2)
## Changed
- Updated dependencies
## [15.0.0] - 2025-05-28
We're super excited to announce v15!
This update is an entire rewrite to make it even easier to set up your own VPN.
## Breaking Changes
As the whole setup has changed, we recommend to start from scratch. And import your existing configs.
## Major Changes
- Almost all Environment variables removed
@@ -23,7 +49,13 @@ This update is an entire rewrite to make it even easier to set up your own VPN.
- SQLite Database
- Deprecated Dockerless Installations
- Added Docker Volume Mount (`/lib/modules`)
- Removed ARMv6 and ARMv7 support
- Removed ARMv6 support
- Connections over HTTP require setting the `INSECURE` env var
- Changed license from CC BY-NC-SA 4.0 to AGPL-3.0-only
- Added 2FA using TOTP
- Improved mobile support
- CLI
- Replaced `nightly` with `edge`
## [14.0.0] - 2024-09-04
+10 -2
View File
@@ -25,8 +25,13 @@ HEALTHCHECK --interval=1m --timeout=5s --retries=3 CMD /usr/bin/timeout 5s /bin/
COPY --from=build /app/.output /app
# Copy migrations
COPY --from=build /app/server/database/migrations /app/server/database/migrations
# libsql
RUN npm install --no-save libsql
# libsql (https://github.com/nitrojs/nitro/issues/3328)
RUN cd /app/server && \
npm install --no-save libsql && \
npm cache clean --force
# cli
COPY --from=build /app/cli/cli.sh /usr/local/bin/cli
RUN chmod +x /usr/local/bin/cli
# Install Linux packages
RUN apk add --no-cache \
@@ -34,6 +39,7 @@ RUN apk add --no-cache \
dumb-init \
iptables \
ip6tables \
nftables \
kmod \
iptables-legacy \
wireguard-tools
@@ -47,6 +53,8 @@ ENV DEBUG=Server,WireGuard,Database,CMD
ENV PORT=51821
ENV HOST=0.0.0.0
ENV INSECURE=false
ENV INIT_ENABLED=false
ENV DISABLE_IPV6=false
LABEL org.opencontainers.image.source=https://github.com/wg-easy/wg-easy
+4 -1
View File
@@ -26,7 +26,9 @@ RUN update-alternatives --install /usr/sbin/ip6tables ip6tables /usr/sbin/ip6tab
ENV DEBUG=Server,WireGuard,Database,CMD
ENV PORT=51821
ENV HOST=0.0.0.0
ENV INSECURE=false
ENV INSECURE=true
ENV INIT_ENABLED=false
ENV DISABLE_IPV6=false
# Install Dependencies
COPY src/package.json src/pnpm-lock.yaml ./
@@ -35,3 +37,4 @@ RUN pnpm install
# Copy Project
COPY src ./
ENTRYPOINT [ "pnpm", "run" ]
+20 -39
View File
@@ -5,20 +5,14 @@
[![GitHub Stars](https://img.shields.io/github/stars/wg-easy/wg-easy)](https://github.com/wg-easy/wg-easy/stargazers)
[![License](https://img.shields.io/github/license/wg-easy/wg-easy)](LICENSE)
[![GitHub Release](https://img.shields.io/github/v/release/wg-easy/wg-easy)](https://github.com/wg-easy/wg-easy/releases/latest)
[![Image Pulls](https://img.shields.io/badge/image_pulls-11M-blue)](https://github.com/wg-easy/wg-easy/pkgs/container/wg-easy)
<!-- TODO: remove after release -->
> [!WARNING]
> You are viewing the README of the pre-release of v15.
> If you want to setup wg-easy right now. Read the README in the production branch here: [README](https://github.com/wg-easy/wg-easy/tree/production) or here for the last nightly: [README](https://github.com/wg-easy/wg-easy/tree/c6dce0f6fb2e28e7e40ddac1498bd67e9bb17cba)
[![Image Pulls](https://img.shields.io/badge/image_pulls-12M+-blue)](https://github.com/wg-easy/wg-easy/pkgs/container/wg-easy)
You have found the easiest way to install & manage WireGuard on any Linux host!
<!-- TOOD: update screenshot -->
<p align="center">
<img src="./assets/screenshot.png" width="802" />
<img src="./assets/screenshot.png" width="802" alt="wg-easy Screenshot" />
</p>
## Features
@@ -38,48 +32,27 @@ You have found the easiest way to install & manage WireGuard on any Linux host!
- Prometheus metrics support
- IPv6 support
- CIDR support
- 2FA support
> [!NOTE]
> To better manage documentation for this project, it has its own site here: [https://wg-easy.github.io/wg-easy/latest](https://wg-easy.github.io/wg-easy/latest)
<!-- TODO: remove after release -->
> [!WARNING]
> As the Docs are still in Pre-release, you can access them here [https://wg-easy.github.io/wg-easy/Pre-release](https://wg-easy.github.io/wg-easy/Pre-release)
- [Getting Started](https://wg-easy.github.io/wg-easy/latest/getting-started/)
- [Basic Installation](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/basic-installation/)
- [Caddy](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/caddy/)
- [Nginx](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/nginx/)
- [Traefik](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/traefik/)
- [Podman](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/podman/)
- [Podman](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/podman-nft/)
- [AdGuard Home](https://wg-easy.github.io/wg-easy/latest/examples/tutorials/adguard/)
> [!NOTE]
> If you want to migrate from the old version to the new version, you can find the migration guide here: [Migration Guide](https://wg-easy.github.io/wg-easy/latest/advanced/migrate/)
## Requirements
- A host with a kernel that supports WireGuard (all modern kernels).
- A host with Docker installed.
## Versions
> 💡 We follow semantic versioning (semver)
We offer multiple Docker image tags to suit your needs. The table below is in a particular order, with the first tag being the most recommended:
| tag | Branch | Example | Description |
| ------------- | ---------------------------------------------------------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ |
| `15` | latest minor for that major tag | `ghcr.io/wg-easy/wg-easy:15` | latest features for specific major versions, no breaking changes |
| `latest` | latest tag | `ghcr.io/wg-easy/wg-easy:latest` or `ghcr.io/wg-easy/wg-easy` | stable as possible get bug fixes quickly when needed, see Releases for more information. |
| `15.0` | latest patch for that minor tag | `ghcr.io/wg-easy/wg-easy:15.0` | latest patches for specific minor version |
| `15.0.0` | specific tag | `ghcr.io/wg-easy/wg-easy:15.0.0` | specific release, don't use this as this will not get updated |
| `nightly` | [`master`](https://github.com/wg-easy/wg-easy/tree/master) | `ghcr.io/wg-easy/wg-easy:nightly` | mostly unstable gets frequent package and code updates, deployed against [`master`](https://github.com/wg-easy/wg-easy/tree/master). |
| `development` | pull requests | `ghcr.io/wg-easy/wg-easy:development` | used for development, testing code from PRs before landing into [`master`](https://github.com/wg-easy/wg-easy/tree/master). |
## Installation
This is a quick start guide to get you up and running with WireGuard Easy.
For a more detailed installation guide, please refer to the [Getting Started](https://wg-easy.github.io/wg-easy/latest/getting-started/) page.
### 1. Install Docker
If you haven't installed Docker yet, install it by running as root:
@@ -95,14 +68,13 @@ And log in again.
The easiest way to run WireGuard Easy is with Docker Compose.
Just download [`docker-compose.yml`](docker-compose.yml), make necessary adjustments and
execute `sudo docker compose up -d`.
Just download [`docker-compose.yml`](docker-compose.yml) and execute `sudo docker compose up -d`.
Now setup a reverse proxy to be able to access the Web UI from the internet.
Now setup a reverse proxy to be able to access the Web UI securely from the internet.
If you want to access the Web UI over HTTP, change the env var `INSECURE` to `true`. This is not recommended. Only use this for testing
### 3. Sponsor
## Donate
Are you enjoying this project? Consider donating.
@@ -133,6 +105,15 @@ If you add something that should be auto-importable and VSCode complains, run:
```shell
cd src
pnpm install
cd ..
```
### Test Cli
This starts the cli with docker
```shell
pnpm cli:dev
```
## License
Binary file not shown.

Before

Width:  |  Height:  |  Size: 104 KiB

After

Width:  |  Height:  |  Size: 185 KiB

+7 -1
View File
@@ -2,7 +2,7 @@ services:
wg-easy:
build:
dockerfile: ./Dockerfile.dev
command: pnpm run dev
command: dev
volumes:
- ./src/:/app/
- temp:/app/.nuxt/
@@ -15,6 +15,12 @@ services:
cap_add:
- NET_ADMIN
- SYS_MODULE
environment:
- INIT_ENABLED=true
- INIT_HOST=test
- INIT_PORT=51820
- INIT_USERNAME=testtest
- INIT_PASSWORD=Qweasdyxcv!2
# folders should be generated inside container
volumes:
+1 -1
View File
@@ -25,7 +25,7 @@ services:
cap_add:
- NET_ADMIN
- SYS_MODULE
# - NET_RAW # ⚠️ Uncomment if using Podman Compose
# - NET_RAW # ⚠️ Uncomment if using Podman
sysctls:
- net.ipv4.ip_forward=1
- net.ipv4.conf.all.src_valid_mark=1
+5
View File
@@ -0,0 +1,5 @@
{
"tabWidth": 4,
"semi": true,
"singleQuote": true
}
+39 -1
View File
@@ -2,4 +2,42 @@
title: API
---
TODO
/// warning | Breaking Changes
This API is not yet stable and may change in the future. The API is currently in development and is subject to change without notice. The API is not yet documented, but we will add documentation as the API stabilizes.
///
You can use the API to interact with the application programmatically. The API is available at `/api` and supports both GET and POST requests. The API is designed to be simple and easy to use, with a focus on providing a consistent interface for all endpoints.
There is no documentation for the API yet, but this will be added as the underlying library supports it.
## Authentication
To use the API, you need to authenticate using Basic Authentication. The username and password are the same as the ones you use to log in to the web application.
If you use 2FA, the API will not work. You need to disable 2FA in the web application to use the API.
### Authentication Example
```python
import requests
from requests.auth import HTTPBasicAuth
url = "https://example.com:51821/api/client"
response = requests.get(url, auth=HTTPBasicAuth('username', 'password'))
if response.status_code == 200:
data = response.json()
print(data)
else:
print(f"Error: {response.status_code}")
```
## Endpoints
The Endpoints are not yet documented. But as file-based routing is used, you can find the endpoints in the `src/server/api` folder. The method is defined in the file name.
### Endpoints Example
| File Name | Endpoint | Method |
| -------------------------------- | -------------- | ------ |
| `src/server/api/client.get.ts` | `/api/client` | GET |
| `src/server/api/setup/2.post.ts` | `/api/setup/2` | POST |
@@ -2,10 +2,21 @@
title: Optional Configuration
---
TODO
You can set these environment variables to configure the container. They are not required, but can be useful in some cases.
| Env | Default | Example | Description |
| ---------- | --------- | ----------- | ------------------------------ |
| `PORT` | `51821` | `6789` | TCP port for Web UI. |
| `HOST` | `0.0.0.0` | `localhost` | IP address web UI binds to. |
| `INSECURE` | `false` | `true` | If access over http is allowed |
| Env | Default | Example | Description |
| -------------- | --------- | ----------- | ---------------------------------- |
| `PORT` | `51821` | `6789` | TCP port for Web UI. |
| `HOST` | `0.0.0.0` | `localhost` | IP address web UI binds to. |
| `INSECURE` | `false` | `true` | If access over http is allowed |
| `DISABLE_IPV6` | `false` | `true` | If IPv6 support should be disabled |
/// note | IPv6 Caveats
Disabling IPv6 will disable the creation of the default IPv6 firewall rules and won't add a IPv6 address to the interface and clients.
You will however still see a IPv6 address in the Web UI, but it won't be used.
This option can be removed in the future, as more devices support IPv6.
///
@@ -0,0 +1,32 @@
---
title: Unattended Setup
---
If you want to run the setup without any user interaction, e.g. with a tool like Ansible, you can use these environment variables to configure the setup.
These will only be used during the first start of the container. After that, the setup will be disabled.
| Env | Example | Description | Group |
| ---------------- | ----------------- | --------------------------------------------------------- | ----- |
| `INIT_ENABLED` | `true` | Enables the below env vars | 0 |
| `INIT_USERNAME` | `admin` | Sets admin username | 1 |
| `INIT_PASSWORD` | `Se!ureP%ssw` | Sets admin password | 1 |
| `INIT_HOST` | `vpn.example.com` | Host clients will connect to | 1 |
| `INIT_PORT` | `51820` | Port clients will connect to and wireguard will listen on | 1 |
| `INIT_DNS` | `1.1.1.1,8.8.8.8` | Sets global dns setting | 2 |
| `INIT_IPV4_CIDR` | `10.8.0.0/24` | Sets IPv4 cidr | 3 |
| `INIT_IPV6_CIDR` | `2001:0DB8::/32` | Sets IPv6 cidr | 3 |
/// warning | Variables have to be used together
If variables are in the same group, you have to set all of them. For example, if you set `INIT_IPV4_CIDR`, you also have to set `INIT_IPV6_CIDR`.
If you want to skip the setup process, you have to configure group `1`
///
/// note | Security
The initial username and password is not checked for complexity. Make sure to set a long enough username and password. Otherwise, the user won't be able to log in.
It's recommended to remove the variables after the setup is done to prevent the password from being exposed.
///
+37 -2
View File
@@ -2,6 +2,41 @@
title: Prometheus
---
TODO
To monitor the WireGuard server, you can use [Prometheus](https://prometheus.io/) and [Grafana](https://grafana.com/). The container exposes a `/metrics/prometheus` endpoint that can be scraped by Prometheus.
<!-- TOOD: add to docs: Grafana dashboard [21733](https://grafana.com/grafana/dashboards/21733-wireguard/) -->
## Enable Prometheus
To enable Prometheus metrics, go to Admin Panel > General and enable Prometheus.
You can optionally set a Bearer Password for the metrics endpoints. This is useful if you want to expose the metrics endpoint to the internet.
## Configure Prometheus
You need to add a scrape config to your Prometheus configuration file. Here is an example:
```yaml
scrape_configs:
- job_name: 'wg-easy'
scrape_interval: 30s
metrics_path: /metrics/prometheus
static_configs:
- targets:
- 'localhost:51821'
authorization:
type: Bearer
credentials: 'SuperSecurePassword'
```
## Grafana Dashboard
You can use the following Grafana dashboard to visualize the metrics:
[![Grafana Dashboard](https://grafana.com/api/dashboards/21733/images/16863/image)](https://grafana.com/grafana/dashboards/21733-wireguard/)
[21733](https://grafana.com/grafana/dashboards/21733-wireguard/)
/// note | Unofficial
The Grafana dashboard is not official and is not maintained by the `wg-easy` team. If you have any issues with the dashboard, please contact the author of the dashboard.
See [#1299](https://github.com/wg-easy/wg-easy/pull/1299) for more information.
///
+14 -8
View File
@@ -6,22 +6,24 @@ This guide will help you migrate from `v14` to version `v15` of `wg-easy`.
## Changes
- This is a complete rewrite of the `wg-easy` project. Therefore the configuration files and the way you interact with the project have changed.
- If you use armv6 or armv7, you can't migrate to `v15` yet. We are working on it.
- If you are connecting to the web ui via HTTP, you need to set the `INSECURE` environment variable to `true` in the new container.
- This is a complete rewrite of the `wg-easy` project, therefore the configuration files and the way you interact with the project have changed.
- If you use armv6, you unfortunately won't be able to migrate to `v15`.
- If you are connecting to the Web UI via HTTP, you need to set the `INSECURE` environment variable to `true` in the new container.
## Migration
### Backup
Before you start the migration, make sure to backup your existing configuration files.
Before you start the migration, make sure to back up your existing configuration files.
Go into the Web Ui and click the Backup button, this should download a `wg0.json` file.
Go into the Web UI and click the Backup button, this should download a `wg0.json` file.
Or download the `wg0.json` file from your container volume to your pc.
You will need this file for the migration
You will also need to back up the old environment variables you set for the container, as they will not be automatically migrated.
### Remove old container
1. Stop the running container
@@ -32,21 +34,25 @@ If you are using `docker run`
docker stop wg-easy
```
If you are using `docker-compose`
If you are using `docker compose`
```shell
docker-compose down
docker compose down
```
### Start new container
Follow the instructions in the [Getting Started][docs-getting-started] or [Basic Installation][docs-examples] guide to start the new container.
In the setup wizard, select that you already already have a configuration file and upload the `wg0.json` file you downloaded in the backup step.
In the setup wizard, select that you already have a configuration file and upload the `wg0.json` file you downloaded in the backup step.
[docs-getting-started]: ../../getting-started.md
[docs-examples]: ../../examples/tutorials/basic-installation.md
### Environment Variables
v15 does not use the same environment variables as v14, most of them have been moved to the Admin Panel in the Web UI.
### Done
You have now successfully migrated to `v15` of `wg-easy`.
-16
View File
@@ -1,16 +0,0 @@
{
"1": "Initial version. Enjoy!",
"2": "You can now rename a client & update the address. Enjoy!",
"3": "Many improvements and small changes. Enjoy!",
"4": "Now with pretty charts for client's network speed. Enjoy!",
"5": "Many small improvements & feature requests. Enjoy!",
"6": "Many small performance improvements & bug fixes. Enjoy!",
"7": "Improved the look & performance of the upload/download chart.",
"8": "Updated to Node.js v18.",
"9": "Fixed issue running on devices with older kernels.",
"10": "Added sessionless HTTP API auth & automatic dark mode.",
"11": "Multilanguage Support & various bugfixes.",
"12": "UI_TRAFFIC_STATS, Import json configurations with no PreShared-Key, allow clients with no privateKey & more.",
"13": "New framework (h3), UI_CHART_TYPE, some bugfixes & more.",
"14": "Home Assistent support, PASSWORD_HASH (inc. Helper), translation updates bugfixes & more."
}
+1 -1
View File
@@ -12,7 +12,7 @@ When refactoring, writing or altering files, adhere to these rules:
## Documentation
Make sure to select `nightly` in the dropdown menu at the top. Navigate to the page you would like to edit and click the edit button in the top right. This allows you to make changes and create a pull-request.
Make sure to select `edge` in the dropdown menu at the top. Navigate to the page you would like to edit and click the edit button in the top right. This allows you to make changes and create a pull-request.
Alternatively you can make the changes locally. For that you'll need to have Docker installed. Run
@@ -24,9 +24,9 @@ Maintainers take the time to improve on this project and help by solving issues
### Filing a Bug Report
Thank you for participating in this project and reporting a bug. wg-easy is a community-driven project, and each contribution counts!
Thank you for participating in this project and reporting a bug. `wg-easy` is a community-driven project, and each contribution counts!
Maintainers and moderators are volunteers. We greatly appreciate reports that take the time to provide detailed information via the template, enabling us to help you in the best and quickest way. Ignoring the template provided may seem easier, but discourages receiving any support (_via assignment of the label `meta/no template - no support`_).
Maintainers and moderators are volunteers. We greatly appreciate reports that take the time to provide detailed information via the template, enabling us to help you in the best and quickest way. Ignoring the template provided may seem easier, but discourages receiving any support.
Markdown formatting can be used in almost all text fields (_unless stated otherwise in the description_).
@@ -50,7 +50,7 @@ The development workflow is the following:
3. Document your improvements if necessary
4. [Commit][commit] (and [sign your commit][gpg]), push and create a pull-request to merge into `master`. Please **use the pull-request template** to provide a minimum of contextual information and make sure to meet the requirements of the checklist.
Pull requests are automatically tested against the CI and will be reviewed when tests pass. When your changes are validated, your branch is merged. CI builds the new `:nightly` image every night and your changes will be includes in the next version release.
Pull requests are automatically tested against the CI and will be reviewed when tests pass. When your changes are validated, your branch is merged. CI builds the new `:edge` image on every push to the `master` branch and your changes will be included in the next version release.
[docs-latest]: https://wg-easy.github.io/wg-easy/latest
[github-file-readme]: https://github.com/wg-easy/wg-easy/blob/master/README.md
+27
View File
@@ -0,0 +1,27 @@
---
title: Translation
---
This project supports multiple languages. If you would like to contribute a translation, please follow these steps:
## Add new Translation
Create a new file in `src/i18n/locales`. Name it `<locale_code>.json` (e.g. `fr.json` for French).
Import and add the newly created file in `src/i18n/i18n.config.ts`.
Add your language in the `src/nuxt.config.ts` file. You have to specify code, language and name.
`code` is the name of the translation file without the extension (e.g. `fr` for `fr.json`).
`language` is the BCP 47 language tag with region (e.g. `fr-FR` for French). See [www.lingoes.net](http://www.lingoes.net/en/translator/langcode.htm) for a list of language codes.
`name` is the display name of the language (e.g. `Français` for French).
## Update existing Translation
If you need to update an existing translation, simply edit the corresponding `<locale_code>.json` file in `src/i18n/locales`.
## Contribute changes
See [Pull Requests](./issues-and-pull-requests.md#pull-requests) on how to contribute your translation.
+5 -1
View File
@@ -2,4 +2,8 @@
title: AdGuard Home
---
TODO
It seems like the Docs on how to setup AdGuard Home are not available yet.
Feel free to create a PR and add them here.
<!-- TODO -->
@@ -4,13 +4,51 @@ title: Auto Updates
## Docker Compose
With Docker Compose WireGuard Easy can be updated with a single command:
Replace `$DIR` with the directory where your `docker-compose.yml` is located.
With Docker Compose `wg-easy` can be updated with a single command:
```shell
cd $DIR
sudo docker compose -f up -d --pull always
cd /etc/docker/containers/wg-easy
sudo docker compose up -d --pull always
```
### Watchtower
If you want the updates to be fully automatic you can install Watchtower. This will check for updates every day at 4:00 AM and update the container if a new version is available.
File: `/etc/docker/containers/watchtower/docker-compose.yml`
```yaml
services:
watchtower:
image: containrrr/watchtower:latest
volumes:
- /var/run/docker.sock:/var/run/docker.sock
env_file:
- watchtower.env
restart: unless-stopped
```
File: `/etc/docker/containers/watchtower/watchtower.env`
```env
WATCHTOWER_CLEANUP=true
WATCHTOWER_SCHEDULE=0 0 4 * * *
TZ=Europe/Berlin
# Email
# WATCHTOWER_NOTIFICATIONS_LEVEL=info
# WATCHTOWER_NOTIFICATIONS=email
# WATCHTOWER_NOTIFICATION_EMAIL_FROM=mail@example.com
# WATCHTOWER_NOTIFICATION_EMAIL_TO=mail@example.com
# WATCHTOWER_NOTIFICATION_EMAIL_SERVER=smtp.example.com
# WATCHTOWER_NOTIFICATION_EMAIL_SERVER_USER=mail@example.com
# WATCHTOWER_NOTIFICATION_EMAIL_SERVER_PASSWORD="SuperSecurePassword"
# WATCHTOWER_NOTIFICATION_EMAIL_SERVER_PORT=587
```
```shell
cd /etc/docker/containers/watchtower
sudo docker compose up -d
```
## Docker Run
@@ -27,7 +65,7 @@ And then run the `docker run -d \ ...` command from [Docker Run][docker-run] aga
## Podman
To update `wg-easy` (and every container that has auto updates enabled), you can run the following commands:
To update `wg-easy` (and every container that has auto updates enabled), you can run the following command:
```shell
sudo podman auto-update
@@ -8,7 +8,7 @@ title: Basic Installation
1. You need to have a host that you can manage
2. You need to have a domain name or a public IP address
3. You need a supported architecture (x86_64, arm64)
3. You need a supported architecture (x86_64, arm64, armv7)
4. You need curl installed on your host
## Install Docker
@@ -19,49 +19,45 @@ Follow the Docs here: <https://docs.docker.com/engine/install/> and install Dock
1. Create a directory for the configuration files (you can choose any directory you like):
```shell
DIR=/docker/wg-easy
sudo mkdir -p $DIR
```
```shell
sudo mkdir -p /etc/docker/containers/wg-easy
```
2. Download docker compose file
```shell
sudo curl -o $DIR/docker-compose.yml https://raw.githubusercontent.com/wg-easy/wg-easy/master/docker-compose.yml
```
```shell
sudo curl -o /etc/docker/containers/wg-easy/docker-compose.yml https://raw.githubusercontent.com/wg-easy/wg-easy/master/docker-compose.yml
```
3. Start `wg-easy`
```shell
sudo docker-compose -f $DIR/docker-compose.yml up -d
```
```shell
cd /etc/docker/containers/wg-easy
sudo docker compose up -d
```
## Setup Firewall
If you are using a firewall, you need to open the following ports:
- UDP 51820 (WireGuard)
- TCP 51821 (Web UI)
These ports can be changed, so if you change them you have to update your firewall rules accordingly.
## Setup Reverse Proxy
TODO
## Access the Web UI
Open your browser and navigate to `https://<your-domain>:51821` or `https://<your-ip>:51821`.
Follow the instructions to set up your WireGuard VPN.
- To setup traefik follow the instructions here: [Traefik](./traefik.md)
- To setup caddy follow the instructions here: [Caddy](./caddy.md)
- If you do not want to use a reverse proxy follow the instructions here: [No Reverse Proxy](./reverse-proxyless.md)
## Update `wg-easy`
To update `wg-easy` to the latest version, run:
```shell
sudo docker-compose -f $DIR/docker-compose.yml pull
sudo docker-compose -f $DIR/docker-compose.yml up -d
cd /etc/docker/containers/wg-easy
sudo docker compose pull
sudo docker compose up -d
```
## Auto Update
+98 -1
View File
@@ -2,4 +2,101 @@
title: Caddy
---
TODO
/// note | Opinionated
This guide is opinionated. If you use other conventions or folder layouts, feel free to change the commands and paths.
///
We're using [Caddy](https://caddyserver.com/) here as reserve proxy to serve `wg-easy` on [https://wg-easy.example.com](https://wg-easy.example.com) via TLS.
## Create a docker composition for `caddy`
```txt
.
├── compose.yml
└── Caddyfile
1 directory, 2 files
```
```yaml
# compose.yml
services:
caddy:
container_name: caddy
image: caddy:2.10.0-alpine
# publish everything you deem necessary
ports:
- '80:80/tcp'
- '443:443/tcp'
- '443:443/udp'
networks:
- caddy
restart: unless-stopped
volumes:
- './Caddyfile:/etc/caddy/Caddyfile:ro'
- config:/config
- data:/data
networks:
caddy:
name: caddy
volumes:
config:
data:
```
```txt
# Caddyfile
{
# setup your email address
email mail@example.com
}
wg-easy.example.com {
# since the container will share the network with wg-easy
# we can use the proper container name
reverse_proxy wg-easy:80
tls internal
}
```
...and start it with:
```shell
sudo docker compose up -d
```
## Adapt the docker composition of `wg-easy`
```yaml
services:
wg-easy:
# sync container name and port according to Caddyfile
container_name: wg-easy
environment:
- PORT=80
# no need to publish the HTTP server anymore
ports:
- "51820:51820/udp"
# add to caddy network
networks:
caddy:
...
networks:
caddy:
external: true
...
```
...and restart it with:
```shell
sudo docker compose up -d
```
You can now access `wg-easy` at [https://wg-easy.example.com](https://wg-easy.example.com) and start the setup.
@@ -4,8 +4,8 @@ title: Docker Run
To setup the IPv6 Network, simply run once:
```bash
docker network create \
```shell
docker network create \
-d bridge --ipv6 \
-d default \
--subnet 10.42.42.0/24 \
@@ -14,10 +14,10 @@ To setup the IPv6 Network, simply run once:
<!-- ref: major version -->
To automatically install & run wg-easy, simply run:
To automatically install & run `wg-easy`, simply run:
```bash
docker run -d \
```shell
docker run -d \
--net wg \
-e INSECURE=true \
--name wg-easy \
@@ -38,6 +38,4 @@ To automatically install & run wg-easy, simply run:
ghcr.io/wg-easy/wg-easy:15
```
The Web UI will now be available on `http://0.0.0.0:51821`.
> 💡 Your configuration files will be saved in `~/.wg-easy`
The Web UI will now be available at <http://0.0.0.0:51821>.
@@ -2,4 +2,6 @@
title: Without Docker
---
TODO
This is currently not yet supported.
<!-- TODO -->
-5
View File
@@ -1,5 +0,0 @@
---
title: NGINX
---
TODO
@@ -1,5 +1,5 @@
---
title: Podman
title: Podman + nftables
---
This guide will show you how to run `wg-easy` with rootful Podman and nftables.
@@ -87,15 +87,15 @@ In the Admin Panel of your WireGuard server, go to the `Hooks` tab and add the f
1. PostUp
```shell
apk add nftables; nft add table inet wg_table; nft add chain inet wg_table postrouting { type nat hook postrouting priority 100 \; }; nft add rule inet wg_table postrouting ip saddr {{ipv4Cidr}} oifname {{device}} masquerade; nft add rule inet wg_table postrouting ip6 saddr {{ipv6Cidr}} oifname {{device}} masquerade; nft add chain inet wg_table input { type filter hook input priority 0 \; policy drop \; }; nft add rule inet wg_table input udp dport {{port}} accept; nft add chain inet wg_table forward { type filter hook forward priority 0 \; policy drop \; }; nft add rule inet wg_table forward iifname "wg0" accept; nft add rule inet wg_table forward oifname "wg0" accept;
```
```shell
nft add table inet wg_table; nft add chain inet wg_table prerouting { type nat hook prerouting priority 100 \; }; nft add chain inet wg_table postrouting { type nat hook postrouting priority 100 \; }; nft add rule inet wg_table postrouting ip saddr {{ipv4Cidr}} oifname {{device}} masquerade; nft add rule inet wg_table postrouting ip6 saddr {{ipv6Cidr}} oifname {{device}} masquerade; nft add chain inet wg_table input { type filter hook input priority 0 \; policy accept \; }; nft add rule inet wg_table input udp dport {{port}} accept; nft add rule inet wg_table input tcp dport {{uiPort}} accept; nft add chain inet wg_table forward { type filter hook forward priority 0 \; policy accept \; }; nft add rule inet wg_table forward iifname "wg0" accept; nft add rule inet wg_table forward oifname "wg0" accept;
```
2. PostDown
```shell
nft delete table inet wg_table
```
```shell
nft delete table inet wg_table
```
If you don't have iptables loaded on your server, you could see many errors in the logs or in the UI. You can ignore them.
@@ -106,8 +106,3 @@ Restart the container to apply the new hooks:
```shell
sudo systemctl restart wg-easy
```
<!--
TODO: improve docs after better nftables support
TODO: fix accept web ui port
-->
@@ -0,0 +1,29 @@
---
title: No Reverse Proxy
---
/// warning | Insecure
This is insecure. You should use a reverse proxy to secure the connection.
Only use this method if you know what you are doing.
///
If you only allow access to the web UI from your local network, you can skip the reverse proxy setup. This is not recommended, but it is possible.
## Setup
- Edit the `docker-compose.yml` file and uncomment `environment` and `INSECURE`
- Set `INSECURE` to `true` to allow access to the web UI over a non-secure connection.
- The `docker-compose.yml` file should look something like this:
```yaml
environment:
- INSECURE=true
```
- Save the file and restart `wg-easy`.
- Make sure that the Web UI is not accessible from outside your local network.
+180 -1
View File
@@ -2,4 +2,183 @@
title: Traefik
---
TODO
/// note | Opinionated
This guide is opinionated. If you use other conventions or folder layouts, feel free to change the commands and paths.
///
## Create docker compose project
```shell
sudo mkdir -p /etc/docker/containers/traefik
cd /etc/docker/containers/traefik
```
## Create docker compose file
File: `/etc/docker/containers/traefik/docker-compose.yml`
```yaml
services:
traefik:
image: traefik:3.3
container_name: traefik
restart: unless-stopped
ports:
- '80:80'
- '443:443/tcp'
- '443:443/udp'
volumes:
- /var/run/docker.sock:/var/run/docker.sock
- /etc/docker/volumes/traefik/traefik.yml:/traefik.yml:ro
- /etc/docker/volumes/traefik/traefik_dynamic.yml:/traefik_dynamic.yml:ro
- /etc/docker/volumes/traefik/acme.json:/acme.json
networks:
- traefik
networks:
traefik:
external: true
```
## Create traefik.yml
File: `/etc/docker/volumes/traefik/traefik.yml`
```yaml
log:
level: INFO
entryPoints:
web:
address: ':80/tcp'
http:
redirections:
entryPoint:
to: websecure
scheme: https
websecure:
address: ':443/tcp'
http:
middlewares:
- compress@file
- hsts@file
tls:
certResolver: letsencrypt
http3: {}
api:
dashboard: true
certificatesResolvers:
letsencrypt:
acme:
email: $mail@example.com$
storage: acme.json
httpChallenge:
entryPoint: web
providers:
docker:
watch: true
network: traefik
exposedByDefault: false
file:
filename: traefik_dynamic.yml
serversTransport:
insecureSkipVerify: true
```
## Create traefik_dynamic.yml
File: `/etc/docker/volumes/traefik/traefik_dynamic.yml`
```yaml
http:
middlewares:
services:
basicAuth:
users:
- '$username$:$password$'
compress:
compress: {}
hsts:
headers:
stsSeconds: 2592000
routers:
api:
rule: Host(`traefik.$example.com$`)
entrypoints:
- websecure
middlewares:
- services
service: api@internal
tls:
options:
default:
cipherSuites:
- TLS_ECDHE_RSA_WITH_AES_128_GCM_SHA256
- TLS_ECDHE_RSA_WITH_AES_256_GCM_SHA384
- TLS_ECDHE_RSA_WITH_CHACHA20_POLY1305_SHA256
sniStrict: true
```
## Create acme.json
```shell
sudo touch /etc/docker/volumes/traefik/acme.json
sudo chmod 600 /etc/docker/volumes/traefik/acme.json
```
## Create network
```shell
sudo docker network create traefik
```
## Start traefik
```shell
sudo docker compose up -d
```
You can no access the Traefik dashboard at `https://traefik.$example.com$` with the credentials you set in `traefik_dynamic.yml`.
## Add Labels to `wg-easy`
To add labels to your `wg-easy` service, you can add the following to your `docker-compose.yml` file:
File: `/etc/docker/containers/wg-easy/docker-compose.yml`
```yaml
services:
wg-easy:
...
container_name: wg-easy
networks:
...
traefik: {}
labels:
- "traefik.enable=true"
- "traefik.http.routers.wg-easy.rule=Host(`wg-easy.$example.com$`)"
- "traefik.http.routers.wg-easy.entrypoints=websecure"
- "traefik.http.routers.wg-easy.service=wg-easy"
- "traefik.http.services.wg-easy.loadbalancer.server.port=51821"
...
networks:
...
traefik:
external: true
```
## Restart `wg-easy`
```shell
cd /etc/docker/containers/wg-easy
sudo docker compose up -d
```
You can now access `wg-easy` at `https://wg-easy.$example.com$` and start the setup.
+97
View File
@@ -0,0 +1,97 @@
---
title: FAQ
hide:
- navigation
---
Here are some frequently asked questions or errors about `wg-easy`. If you have a question that is not answered here, please feel free to open a discussion on GitHub.
## Error: WireGuard exited with the error: Cannot find device "wg0"
This error indicates that the WireGuard interface `wg0` does not exist. This can happen if the WireGuard kernel module is not loaded or if the interface was not created properly.
To resolve this issue, you can try the following steps:
1. **Load the WireGuard kernel module**: If the WireGuard kernel module is not loaded, you can load it manually by running:
```shell
sudo modprobe wireguard
```
2. **Load the WireGuard kernel module on boot**: If you want to ensure that the WireGuard kernel module is loaded automatically on boot, you can add it to the `/etc/modules` file:
```shell
echo "wireguard" | sudo tee -a /etc/modules
```
## can't initialize iptables table `nat': Table does not exist (do you need to insmod?)
This error indicates that the `nat` table in `iptables` does not exist. This can happen if the `iptables` kernel module is not loaded or if the `nat` table is not supported by your kernel.
To resolve this issue, you can try the following steps:
1. **Load the `nat` kernel module**: If the `nat` kernel module is not loaded, you can load it manually by running:
```shell
sudo modprobe iptable_nat
```
2. **Load the `nat` kernel module on boot**: If you want to ensure that the `nat` kernel module is loaded automatically on boot, you can add it to the `/etc/modules` file:
```shell
echo "iptable_nat" | sudo tee -a /etc/modules
```
## can't initialize ip6tables table `nat': Table does not exist (do you need to insmod?)
This error indicates that the `nat` table in `ip6tables` does not exist. This can happen if the `ip6tables` kernel module is not loaded or if the `nat` table is not supported by your kernel.
To resolve this issue, you can try the following steps:
1. **Load the `nat` kernel module**: If the `nat` kernel module is not loaded, you can load it manually by running:
```shell
sudo modprobe ip6table_nat
```
2. **Load the `nat` kernel module on boot**: If you want to ensure that the `nat` kernel module is loaded automatically on boot, you can add it to the `/etc/modules` file:
```shell
echo "ip6table_nat" | sudo tee -a /etc/modules
```
## can't initialize iptables table `filter': Permission denied
This error indicates that the `filter` table in `iptables` cannot be initialized due to permission issues. This can happen if you are not running the command with sufficient privileges.
To resolve this issue, you can try the following steps:
1. **Load the `filter` kernel module**: If the `filter` kernel module is not loaded, you can load it manually by running:
```shell
sudo modprobe iptable_filter
```
2. **Load the `filter` kernel module on boot**: If you want to ensure that the `filter` kernel module is loaded automatically on boot, you can add it to the `/etc/modules` file:
```shell
echo "iptable_filter" | sudo tee -a /etc/modules
```
## can't initialize ip6tables table `filter': Permission denied
This error indicates that the `filter` table in `ip6tables` cannot be initialized due to permission issues. This can happen if you are not running the command with sufficient privileges.
To resolve this issue, you can try the following steps:
1. **Load the `filter` kernel module**: If the `filter` kernel module is not loaded, you can load it manually by running:
```shell
sudo modprobe ip6table_filter
```
2. **Load the `filter` kernel module on boot**: If you want to ensure that the `filter` kernel module is loaded automatically on boot, you can add it to the `/etc/modules` file:
```shell
echo "ip6table_filter" | sudo tee -a /etc/modules
```
+19 -39
View File
@@ -1,10 +1,10 @@
---
title: Getting Started
hide:
- navigation
- navigation
---
This page explains how to get started with wg-easy. The guide uses Docker Compose as a reference. In our examples, we mount the named volume `etc_wireguard` to `/etc/wireguard` inside the container.
This page explains how to get started with `wg-easy`. The guide uses Docker Compose as a reference. In our examples, we mount the named volume `etc_wireguard` to `/etc/wireguard` inside the container.
## Preliminary Steps
@@ -12,7 +12,7 @@ Before you can get started with deploying your own VPN, there are some requireme
1. You need to have a host that you can manage
2. You need to have a domain name or a public IP address
3. You need a supported architecture (x86_64, arm64)
3. You need a supported architecture (x86_64, arm64, armv7)
### Host Setup
@@ -29,7 +29,7 @@ If you're using podman, make sure to read the related [documentation][docs-podma
[docker-compose]: https://docs.docker.com/compose/
[docker-compose-installation]: https://docs.docker.com/compose/install/
[docker-compose-specification]: https://docs.docker.com/compose/compose-file/
[docs-podman]: ./examples/tutorials/podman.md
[docs-podman]: ./examples/tutorials/podman-nft.md
## Deploying the Actual Image
@@ -41,10 +41,16 @@ To understand which tags you should use, read this section carefully. [Our CI][g
All workflows are using the tagging convention listed below. It is subsequently applied to all images.
| Event | Image Tags |
| ----------------------- | ----------------------------- |
| `cron` on `master` | `nightly` |
| `push` a tag (`v1.2.3`) | `1.2.3`, `1.2`, `1`, `latest` |
| tag | Type | Example | Description |
| ------------- | ------------------------------- | ------------------------------------------------------------- | ----------------------------------------------------------------------------- |
| `15` | latest minor for that major tag | `ghcr.io/wg-easy/wg-easy:15` | latest features for specific major versions, no breaking changes, recommended |
| `latest` | latest tag | `ghcr.io/wg-easy/wg-easy:latest` or `ghcr.io/wg-easy/wg-easy` | points to latest release, can include breaking changes |
| `15.0` | latest patch for that minor tag | `ghcr.io/wg-easy/wg-easy:15.0` | latest patches for specific minor version |
| `15.0.0` | specific tag | `ghcr.io/wg-easy/wg-easy:15.0.0` | specific release, no updates |
| `edge` | push to `master` | `ghcr.io/wg-easy/wg-easy:edge` | mostly unstable, gets frequent package and code updates |
| `development` | pull requests | `ghcr.io/wg-easy/wg-easy:development` | used for development, testing code from PRs |
<!-- ref: major version -->
When publishing a tag we follow the [Semantic Versioning][semver] specification. The `latest` tag is always pointing to the latest stable release. If you want to avoid breaking changes, use the major version tag (e.g. `15`).
@@ -52,41 +58,15 @@ When publishing a tag we follow the [Semantic Versioning][semver] specification.
[ghcr-image]: https://github.com/wg-easy/wg-easy/pkgs/container/wg-easy
[semver]: https://semver.org/
### Get All Files
### Follow tutorials
Issue the following command to acquire the necessary file:
- [Basic Installation with Docker Compose (Recommended)](./examples/tutorials/basic-installation.md)
- [Simple Installation with Docker Run](./examples/tutorials/docker-run.md)
- [Advanced Installation with Podman](./examples/tutorials/podman-nft.md)
```shell
wget "https://raw.githubusercontent.com/wg-easy/wg-easy/master/docker-compose.yml"
```
### Start the Container
To start the container, issue the following command:
```shell
sudo docker compose up -d
```
### Configuration Steps
Now follow the setup process in your web browser
### Stopping the Container
To stop the container, issue the following command:
```shell
sudo docker compose down
```
/// danger | Using the Correct Commands For Stopping and Starting wg-easy
/// danger | Use the Correct Commands For Stopping and Starting `wg-easy`
**Use `sudo docker compose up / down`, not `sudo docker compose start / stop`**. Otherwise, the container is not properly destroyed and you may experience problems during startup because of inconsistent state.
///
**That's it! It really is that easy**.
If you need more help you can read the [Basic Installation Tutorial][basic-installation].
[basic-installation]: ./examples/tutorials/basic-installation.md
+26
View File
@@ -0,0 +1,26 @@
---
title: 2FA
---
The user can enable 2FA from the Account page. The Account page is accessible from the dropdown menu in the top right corner of the application.
## Enable TOTP
- **Enable Two Factor Authentication**: Enable TOTP for the user.
## Configure TOTP
A QR code will be displayed. Scan the QR code with your TOTP application (e.g., Google Authenticator, Authy, etc.) to add the account.
To verify that the TOTP key is working, the user must enter the TOTP code generated by the TOTP application.
- **TOTP Key**: The TOTP key for the user. This key is used to generate the TOTP code.
- **TOTP Code**: The current TOTP code for the user. This code is used to verify the TOTP key.
- **Enable Two Factor Authentication**: Enable TOTP for the user.
## Disable TOTP
To disable TOTP, the user must enter the current password.
- **Current Password**: The current password of the user.
- **Disable Two Factor Authentication**: Disable TOTP for the user.
+5
View File
@@ -0,0 +1,5 @@
---
title: Admin Panel
---
TODO
+43
View File
@@ -0,0 +1,43 @@
---
title: CLI
---
If you want to use the CLI, you can run it with
### Docker Compose
```shell
cd /etc/docker/containers/wg-easy
docker compose exec -it wg-easy cli
```
### Docker Run
```shell
docker run --rm -it \
-v ~/.wg-easy:/etc/wireguard \
ghcr.io/wg-easy/wg-easy:15 \
cli
```
### Reset Password
If you want to reset the password for the admin user, you can run the following command:
#### By Prompt
```shell
cd /etc/docker/containers/wg-easy
docker compose exec -it wg-easy cli db:admin:reset
```
You are asked to provide the new password
#### By Argument
```shell
cd /etc/docker/containers/wg-easy
docker compose exec -it wg-easy cli db:admin:reset --password <new_password>
```
This will reset the password for the admin user to the new password you provided. If you include special characters in the password, make sure to escape them properly.
+50
View File
@@ -0,0 +1,50 @@
---
title: Edit Client
---
## General
- **Name**: The name of the client.
- **Enabled**: Whether the client can connect to the VPN.
- **Expire Date**: The date the client will be disabled.
## Address
- **IPv4**: The IPv4 address of the client.
- **IPv6**: The IPv6 address of the client.
## Allowed IPs
Which IPs will be routed through the VPN.
This will not prevent the user from modifying it locally and accessing IP ranges that they should not be able to access.
Use firewall rules to prevent access to IP ranges that the user should not be able to access.
## Server Allowed IPs
Which IPs will be routed to the client.
## DNS
The DNS server that the client will use.
## Advanced
- **MTU**: The maximum transmission unit for the client.
- **Persistent Keepalive**: The interval for sending keepalive packets to the server.
## Hooks
This can only be used for clients that use `wg-quick`. Setting this will throw a error when importing the config on other clients.
- **PreUp**: Commands to run before the interface is brought up.
- **PostUp**: Commands to run after the interface is brought up.
- **PreDown**: Commands to run before the interface is brought down.
- **PostDown**: Commands to run after the interface is brought down.
## Actions
- **Save**: Save the changes made in the form.
- **Revert**: Revert the changes made in the form.
- **Delete**: Delete the client.
+24
View File
@@ -0,0 +1,24 @@
---
title: Setup
---
## User Setup
- **Username**: The username of the user.
- **Password**: The password of the user.
- **Confirm Password**: The password of the user.
## Existing Setup
If you have the config from the previous version, you can import it by clicking "Yes". This currently expects a config from v14.
If this is the first time you are using this, you can click "No" to create a new config.
### No - Host Setup
- **Host**: The host of the server. The clients will connect to this address. This can be a domain name or an IP address. Make sure to wrap it in brackets if it is an IPv6 address. For example: `[::1]` or `[2001:db8::1]`.
- **Port**: The port of the server. The clients will connect to this port. The server will listen on this port.
### Yes - Migration
Select the `wg0.json` file from the previous version. Read [Migrate from v14 to v15](../advanced/migrate/from-14-to-15.md) for more information.
+2 -2
View File
@@ -1,7 +1,7 @@
---
title: Home
hide:
- navigation
- navigation
---
# Welcome to the Documentation for `wg-easy`
@@ -11,7 +11,7 @@ hide:
**Make sure** to select the correct version of this documentation! It should match the version of the image you are using. The default version corresponds to the `:latest` image tag - [the most recent stable release][docs-tagging].
///
This documentation provides you not only with the basic setup and configuration of wg-easy but also with advanced configuration, elaborate usage scenarios, detailed examples, hints and more.
This documentation provides you not only with the basic setup and configuration of `wg-easy` but also with advanced configuration, elaborate usage scenarios, detailed examples, hints and more.
[docs-tagging]: ./getting-started.md#tagging-convention
+73 -73
View File
@@ -1,87 +1,87 @@
site_name: "wg-easy"
site_description: "The easiest way to run WireGuard VPN + Web-based Admin UI."
site_author: "WireGuard Easy"
site_name: 'wg-easy'
site_description: 'The easiest way to run WireGuard VPN + Web-based Admin UI.'
site_author: 'WireGuard Easy'
copyright: >
<p>
&copy <a href="https://github.com/wg-easy"><em>Wireguard Easy</em></a><br/>
<span>This project is licensed under AGPL-3.0-only.</span><br/>
<span>This project is not affiliated, associated, authorized, endorsed by, or in any way officially connected with Jason A. Donenfeld, ZX2C4 or Edge Security</span><br/>
<span>"WireGuard" and the "WireGuard" logo are registered trademarks of Jason A. Donenfeld</span>
</p>
<p>
&copy <a href="https://github.com/wg-easy"><em>Wireguard Easy</em></a><br/>
<span>This project is licensed under AGPL-3.0-only.</span><br/>
<span>This project is not affiliated, associated, authorized, endorsed by, or in any way officially connected with Jason A. Donenfeld, ZX2C4 or Edge Security</span><br/>
<span>"WireGuard" and the "WireGuard" logo are registered trademarks of Jason A. Donenfeld</span>
</p>
repo_url: https://github.com/wg-easy/wg-easy
repo_name: wg-easy
edit_uri: "edit/master/docs/content"
edit_uri: 'edit/master/docs/content'
docs_dir: "content/"
docs_dir: 'content/'
site_url: https://wg-easy.github.io/wg-easy
theme:
name: material
favicon: assets/logo/favicon.png
logo: assets/logo/logo.png
icon:
repo: fontawesome/brands/github
features:
- navigation.tabs
- navigation.top
- navigation.expand
- navigation.instant
- content.action.edit
- content.action.view
- content.code.annotate
palette:
# Light mode
- media: "(prefers-color-scheme: light)"
scheme: default
primary: grey
accent: red
toggle:
icon: material/weather-night
name: Switch to dark mode
# Dark mode
- media: "(prefers-color-scheme: dark)"
scheme: slate
primary: grey
accent: red
toggle:
icon: material/weather-sunny
name: Switch to light mode
name: material
favicon: assets/logo/favicon.png
logo: assets/logo/logo.png
icon:
repo: fontawesome/brands/github
features:
- navigation.tabs
- navigation.top
- navigation.expand
- navigation.instant
- content.action.edit
- content.action.view
- content.code.annotate
palette:
# Light mode
- media: '(prefers-color-scheme: light)'
scheme: default
primary: grey
accent: red
toggle:
icon: material/weather-night
name: Switch to dark mode
# Dark mode
- media: '(prefers-color-scheme: dark)'
scheme: slate
primary: grey
accent: red
toggle:
icon: material/weather-sunny
name: Switch to light mode
extra:
version:
provider: mike
version:
provider: mike
markdown_extensions:
- toc:
anchorlink: true
- abbr
- attr_list
- pymdownx.blocks.admonition:
types:
- danger
- note
- info
- question
- warning
- pymdownx.details
- pymdownx.superfences:
custom_fences:
- name: mermaid
class: mermaid
format: !!python/name:pymdownx.superfences.fence_code_format
- pymdownx.tabbed:
alternate_style: true
slugify: !!python/object/apply:pymdownx.slugs.slugify
kwds:
case: lower
- pymdownx.tasklist:
custom_checkbox: true
- pymdownx.magiclink
- pymdownx.inlinehilite
- pymdownx.tilde
- pymdownx.emoji:
emoji_index: !!python/name:material.extensions.emoji.twemoji
emoji_generator: !!python/name:material.extensions.emoji.to_svg
- toc:
anchorlink: true
- abbr
- attr_list
- pymdownx.blocks.admonition:
types:
- danger
- note
- info
- question
- warning
- pymdownx.details
- pymdownx.superfences:
custom_fences:
- name: mermaid
class: mermaid
format: !!python/name:pymdownx.superfences.fence_code_format
- pymdownx.tabbed:
alternate_style: true
slugify: !!python/object/apply:pymdownx.slugs.slugify
kwds:
case: lower
- pymdownx.tasklist:
custom_checkbox: true
- pymdownx.magiclink
- pymdownx.inlinehilite
- pymdownx.tilde
- pymdownx.emoji:
emoji_index: !!python/name:material.extensions.emoji.twemoji
emoji_generator: !!python/name:material.extensions.emoji.to_svg
+8 -3
View File
@@ -2,10 +2,15 @@
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "docker compose -f docker-compose.dev.yml up --build",
"dev": "docker compose -f docker-compose.dev.yml up wg-easy --build",
"cli:dev": "docker compose -f docker-compose.dev.yml run --build --rm -it wg-easy cli:dev",
"build": "docker build -t wg-easy .",
"docs:preview": "docker run --rm -it -p 8080:8080 -v ./docs:/docs squidfunk/mkdocs-material serve -a 0.0.0.0:8080",
"scripts:version": "bash scripts/version.sh"
"scripts:version": "bash scripts/version.sh",
"format:check:docs": "prettier --check docs"
},
"packageManager": "pnpm@10.5.2"
"devDependencies": {
"prettier": "^3.6.2"
},
"packageManager": "pnpm@10.12.4"
}
+16 -1
View File
@@ -6,4 +6,19 @@ settings:
importers:
.: {}
.:
devDependencies:
prettier:
specifier: ^3.6.2
version: 3.6.2
packages:
prettier@3.6.2:
resolution: {integrity: sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==}
engines: {node: '>=14'}
hasBin: true
snapshots:
prettier@3.6.2: {}
-1
View File
@@ -1 +0,0 @@
public-hoist-pattern[]=@libsql/linux*
+3 -3
View File
@@ -10,12 +10,12 @@
</template>
<template #actions>
<DialogClose as-child>
<BaseButton>{{ $t('dialog.cancel') }}</BaseButton>
<BaseSecondaryButton>{{ $t('dialog.cancel') }}</BaseSecondaryButton>
</DialogClose>
<DialogClose as-child>
<BaseButton @click="$emit('change', ipv4Cidr, ipv6Cidr)">
<BasePrimaryButton @click="$emit('change', ipv4Cidr, ipv6Cidr)">
{{ $t('dialog.change') }}
</BaseButton>
</BasePrimaryButton>
</DialogClose>
</template>
</BaseDialog>
@@ -0,0 +1,24 @@
<template>
<BaseDialog :trigger-class="triggerClass">
<template #trigger><slot /></template>
<template #title>{{ $t('admin.interface.restart') }}</template>
<template #description>
{{ $t('admin.interface.restartWarn') }}
</template>
<template #actions>
<DialogClose as-child>
<BaseSecondaryButton>{{ $t('dialog.cancel') }}</BaseSecondaryButton>
</DialogClose>
<DialogClose as-child>
<BasePrimaryButton @click="$emit('restart')">
{{ $t('admin.interface.restart') }}
</BasePrimaryButton>
</DialogClose>
</template>
</BaseDialog>
</template>
<script lang="ts" setup>
defineEmits(['restart']);
defineProps<{ triggerClass?: string }>();
</script>
@@ -0,0 +1,39 @@
<template>
<BaseDialog :trigger-class="triggerClass">
<template #trigger><slot /></template>
<template #title>{{ $t('admin.config.suggest') }}</template>
<template #description>
<div class="flex flex-col items-start gap-2">
<p>{{ $t('admin.config.suggestDesc') }}</p>
<p v-if="!data">
{{ $t('general.loading') }}
</p>
<BaseSelect v-else v-model="selected" :options="data" />
</div>
</template>
<template #actions>
<DialogClose as-child>
<BaseSecondaryButton>{{ $t('dialog.cancel') }}</BaseSecondaryButton>
</DialogClose>
<DialogClose as-child>
<BasePrimaryButton @click="$emit('change', selected)">
{{ $t('dialog.change') }}
</BasePrimaryButton>
</DialogClose>
</template>
</BaseDialog>
</template>
<script lang="ts" setup>
defineEmits(['change']);
const props = defineProps<{
triggerClass?: string;
url: '/api/admin/ip-info' | '/api/setup/4';
}>();
const { data } = useFetch(props.url, {
method: 'get',
});
const selected = ref<string>();
</script>
+26
View File
@@ -0,0 +1,26 @@
<template>
<component
:is="elementType"
role="button"
class="inline-flex items-center rounded border-2 border-red-800 bg-red-800 px-4 py-2 text-white transition hover:border-red-600 hover:bg-red-600"
v-bind="attrs"
>
<slot />
</component>
</template>
<script setup lang="ts">
const props = defineProps({
as: {
type: String,
default: 'button',
},
});
const elementType = computed(() => props.as);
const attrs = computed(() => {
const { as, ...attrs } = props;
return attrs;
});
</script>
@@ -20,7 +20,7 @@ const props = defineProps({
const elementType = computed(() => props.as);
const attrs = computed(() => {
const { as, ...attrs } = props;
return attrs;
const { as, ...rest } = props;
return rest;
});
</script>
+37
View File
@@ -0,0 +1,37 @@
<template>
<SelectRoot v-model="selected">
<SelectTrigger
class="inline-flex h-8 items-center justify-around gap-2 rounded bg-gray-200 px-3 text-sm leading-none dark:bg-neutral-500 dark:text-neutral-200"
aria-label="Choose option"
>
<SelectValue placeholder="Select..." />
<IconsArrowDown class="size-3" />
</SelectTrigger>
<SelectPortal>
<SelectContent
class="z-[100] min-w-28 rounded bg-gray-300 dark:bg-neutral-500"
>
<SelectViewport class="p-2">
<SelectItem
v-for="(option, index) in options"
:key="index"
:value="option.value"
class="relative flex h-6 items-center rounded px-3 text-sm leading-none outline-none hover:bg-red-800 hover:text-white dark:text-white"
>
<SelectItemText>
{{ option.value }} - {{ option.label }}
</SelectItemText>
</SelectItem>
</SelectViewport>
</SelectContent>
</SelectPortal>
</SelectRoot>
</template>
<script lang="ts" setup>
defineProps<{
options: { label: string; value: string }[];
}>();
const selected = defineModel<string>();
</script>
+9 -4
View File
@@ -1,14 +1,17 @@
<template>
<TooltipProvider>
<TooltipRoot>
<TooltipRoot :open="open" @update:open="open = $event">
<TooltipTrigger
class="inline-flex h-8 w-8 items-center justify-center rounded-full text-gray-400 outline-none focus:shadow-sm focus:shadow-black"
class="mx-2 inline-flex h-4 w-4 items-center justify-center rounded-full text-gray-400 outline-none focus:shadow-sm focus:shadow-black"
as-child
>
<slot />
<button type="button" @click="open = !open">
<slot />
</button>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent
class="select-none rounded bg-gray-600 px-3 py-2 text-sm leading-none text-white shadow-lg will-change-[transform,opacity]"
class="select-none whitespace-pre-line rounded bg-gray-600 px-3 py-2 text-sm leading-none text-white shadow-lg will-change-[transform,opacity]"
:side-offset="5"
>
{{ text }}
@@ -21,4 +24,6 @@
<script lang="ts" setup>
defineProps<{ text: string }>();
const open = ref(false);
</script>
+4 -2
View File
@@ -18,10 +18,12 @@
</template>
<template #actions>
<DialogClose as-child>
<BaseButton>{{ $t('dialog.cancel') }}</BaseButton>
<BaseSecondaryButton>{{ $t('dialog.cancel') }}</BaseSecondaryButton>
</DialogClose>
<DialogClose as-child>
<BaseButton @click="createClient">{{ $t('client.create') }}</BaseButton>
<BasePrimaryButton @click="createClient">
{{ $t('client.create') }}
</BasePrimaryButton>
</DialogClose>
</template>
</BaseDialog>
+4 -4
View File
@@ -9,12 +9,12 @@
</template>
<template #actions>
<DialogClose as-child>
<BaseButton>{{ $t('dialog.cancel') }}</BaseButton>
<BasePrimaryButton>{{ $t('dialog.cancel') }}</BasePrimaryButton>
</DialogClose>
<DialogClose as-child>
<BaseButton @click="$emit('delete')">{{
$t('client.deleteClient')
}}</BaseButton>
<BaseSecondaryButton @click="$emit('delete')">
{{ $t('client.deleteClient') }}
</BaseSecondaryButton>
</DialogClose>
</template>
</BaseDialog>
+2 -2
View File
@@ -2,10 +2,10 @@
<p class="m-10 text-center text-sm text-gray-400 dark:text-neutral-400">
{{ $t('client.empty') }}<br /><br />
<ClientsCreateDialog>
<BaseButton as="span">
<BaseSecondaryButton as="span">
<IconsPlus class="w-4 md:mr-2" />
<span class="text-sm">{{ $t('client.new') }}</span>
</BaseButton>
</BaseSecondaryButton>
</ClientsCreateDialog>
</p>
</template>
+2 -2
View File
@@ -1,8 +1,8 @@
<template>
<ClientsCreateDialog>
<BaseButton as="span">
<BaseSecondaryButton as="span">
<IconsPlus class="w-4 md:mr-2" />
<span class="text-sm max-md:hidden">{{ $t('client.newShort') }}</span>
</BaseButton>
</BaseSecondaryButton>
</ClientsCreateDialog>
</template>
+4 -2
View File
@@ -4,11 +4,13 @@
<slot />
</template>
<template #description>
<img :src="qrCode" />
<div class="bg-white">
<img :src="qrCode" />
</div>
</template>
<template #actions>
<DialogClose>
<BaseButton>{{ $t('dialog.cancel') }}</BaseButton>
<BaseSecondaryButton>{{ $t('dialog.cancel') }}</BaseSecondaryButton>
</DialogClose>
</template>
</BaseDialog>
+2 -2
View File
@@ -1,12 +1,12 @@
<template>
<BaseButton @click="toggleSort">
<BasePrimaryButton @click="toggleSort">
<IconsArrowDown
v-if="globalStore.sortClient === true"
class="w-4 md:mr-2"
/>
<IconsArrowUp v-else class="w-4 md:mr-2" />
<span class="text-sm max-md:hidden"> {{ $t('client.sort') }}</span>
</BaseButton>
</BasePrimaryButton>
</template>
<script setup lang="ts">
+2 -2
View File
@@ -12,7 +12,7 @@
class="rounded-lg border-2 border-gray-100 text-gray-500 focus:border-red-800 focus:outline-0 focus:ring-0 dark:border-neutral-800 dark:bg-neutral-700 dark:text-neutral-200 dark:placeholder:text-neutral-400"
@input="update($event, i)"
/>
<BaseButton
<BaseSecondaryButton
as="input"
type="button"
class="rounded-lg"
@@ -22,7 +22,7 @@
</div>
</div>
<div class="mt-2">
<BaseButton
<BasePrimaryButton
as="input"
type="button"
class="rounded-lg"
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<section class="grid grid-cols-1 gap-4 md:grid-cols-2">
<section class="grid grid-cols-2 gap-4">
<slot />
<Separator
decorative
+50
View File
@@ -0,0 +1,50 @@
<template>
<div class="flex items-center">
<FormLabel :for="id">
{{ label }}
</FormLabel>
<BaseTooltip v-if="description" :text="description">
<IconsInfo class="size-4" />
</BaseTooltip>
</div>
<div class="flex gap-1">
<BaseInput
:id="id"
v-model.trim="data"
:name="id"
type="text"
class="w-full"
:placeholder="placeholder"
/>
<ClientOnly>
<AdminSuggestDialog :url="url" @change="data = $event">
<BasePrimaryButton as="span">
<div class="flex items-center gap-3">
<IconsSparkles class="w-4" />
<span>{{ $t('admin.config.suggest') }}</span>
</div>
</BasePrimaryButton>
</AdminSuggestDialog>
</ClientOnly>
</div>
</template>
<script lang="ts" setup>
defineProps<{
id: string;
label: string;
description?: string;
placeholder?: string;
url: '/api/admin/ip-info' | '/api/setup/4';
}>();
const data = defineModel<string | null>({
set(value) {
const temp = value?.trim() ?? null;
if (temp === '') {
return null;
}
return temp;
},
});
</script>
@@ -0,0 +1,68 @@
<template>
<div class="flex flex-col gap-2">
<div v-if="data === null">
{{ emptyText || $t('form.nullNoItems') }}
</div>
<div v-for="(item, i) in data" v-else :key="i">
<div class="mt-1 flex flex-row gap-1">
<input
:value="item"
:name="name"
type="text"
class="rounded-lg border-2 border-gray-100 text-gray-500 focus:border-red-800 focus:outline-0 focus:ring-0 dark:border-neutral-800 dark:bg-neutral-700 dark:text-neutral-200 dark:placeholder:text-neutral-400"
@input="update($event, i)"
/>
<BaseSecondaryButton
as="input"
type="button"
class="rounded-lg"
value="-"
@click="del(i)"
/>
</div>
</div>
<div class="mt-2">
<BasePrimaryButton
as="input"
type="button"
class="rounded-lg"
:value="$t('form.add')"
@click="add"
/>
</div>
</div>
</template>
<script lang="ts" setup>
const data = defineModel<string[] | null>();
defineProps<{ emptyText?: string[]; name: string }>();
function update(e: Event, i: number) {
const v = (e.target as HTMLInputElement).value;
if (!data.value) {
return;
}
data.value[i] = v;
}
function add() {
if (data.value === undefined) {
return;
}
if (data.value === null) {
data.value = [''];
} else {
data.value.push('');
}
}
function del(i: number) {
if (!data.value) {
return;
}
data.value.splice(i, 1);
if (data.value.length === 0) {
data.value = null;
}
}
</script>
+1 -1
View File
@@ -12,7 +12,7 @@
v-model.trim="data"
:name="id"
type="text"
:autcomplete="autocomplete"
:autocomplete="autocomplete"
:placeholder="placeholder"
/>
</template>
@@ -0,0 +1,16 @@
<template>
<input
:value="label"
:type="type ?? 'button'"
class="col-span-2 rounded-lg border-2 border-red-800 bg-red-800 py-2 text-white hover:border-red-600 hover:bg-red-600 focus:border-red-800 focus:outline-0 focus:ring-0"
/>
</template>
<script lang="ts" setup>
import type { InputTypeHTMLAttribute } from 'vue';
defineProps<{
label: string;
type?: InputTypeHTMLAttribute;
}>();
</script>
+3 -1
View File
@@ -12,7 +12,8 @@
v-model.trim="data"
:name="id"
type="text"
:autcomplete="autocomplete"
:autocomplete="autocomplete"
:disabled="disabled"
/>
</template>
@@ -22,6 +23,7 @@ defineProps<{
label: string;
description?: string;
autocomplete?: string;
disabled?: boolean;
}>();
const data = defineModel<string>();
+22
View File
@@ -0,0 +1,22 @@
<template>
<div
v-if="!globalStore.information?.insecure && !https"
class="container mx-auto w-fit rounded-md bg-red-800 p-4 text-white shadow-lg dark:bg-red-100 dark:text-red-600"
>
<p class="text-center">{{ $t('login.insecure') }}</p>
</div>
</template>
<script lang="ts" setup>
const globalStore = useGlobalStore();
const https = ref(false);
onMounted(() => {
if (window.location.protocol === 'https:') {
https.value = true;
} else {
https.value = false;
}
});
</script>
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<NuxtLink to="/" class="mb-4 flex-grow self-start">
<NuxtLink to="/" class="mb-4">
<h1 class="text-4xl font-medium dark:text-neutral-200">
<img
src="/logo.png"
+9 -6
View File
@@ -1,17 +1,21 @@
<template>
<div
v-if="globalStore.release?.updateAvailable"
v-if="
globalStore.information?.updateAvailable &&
authStore.userData &&
hasPermissions(authStore.userData, 'admin', 'any')
"
class="font-small mb-10 rounded-md bg-red-800 p-4 text-sm text-white shadow-lg dark:bg-red-100 dark:text-red-600"
:title="`v${globalStore.release.currentRelease} → v${globalStore.release.latestRelease.version}`"
:title="`v${globalStore.information.currentRelease} → v${globalStore.information.latestRelease.version}`"
>
<div class="container mx-auto flex flex-auto flex-row items-center">
<div class="flex-grow">
<p class="font-bold">{{ $t('update.updateAvailable') }}</p>
<p>{{ globalStore.release.latestRelease.changelog }}</p>
<p>{{ globalStore.information.latestRelease.changelog }}</p>
</div>
<a
:href="`https://github.com/wg-easy/wg-easy/releases/tag/${globalStore.release.latestRelease.version}`"
:href="`https://github.com/wg-easy/wg-easy/releases/tag/${globalStore.information.latestRelease.version}`"
target="_blank"
class="font-sm float-right flex-shrink-0 rounded-md border-2 border-red-800 bg-white p-3 font-semibold text-red-800 transition-all hover:border-white hover:bg-red-800 hover:text-white dark:border-red-600 dark:bg-red-100 dark:text-red-600 dark:hover:border-red-600 dark:hover:bg-red-600 dark:hover:text-red-100"
>
@@ -23,6 +27,5 @@
<script lang="ts" setup>
const globalStore = useGlobalStore();
// TODO: only show this to admins
const authStore = useAuthStore();
</script>
+5 -11
View File
@@ -1,13 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M16.707 10.293a1 1 0 010 1.414l-6 6a1 1 0 01-1.414 0l-6-6a1 1 0 111.414-1.414L9 14.586V3a1 1 0 012 0v11.586l4.293-4.293a1 1 0 011.414 0z"
clip-rule="evenodd"
/>
</svg>
<ArrowDownIcon />
</template>
<script lang="ts" setup>
import ArrowDownIcon from '@heroicons/vue/24/outline/esm/ArrowDownIcon';
</script>
+5 -14
View File
@@ -1,16 +1,7 @@
<template>
<svg
inline
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99"
/>
</svg>
<ArrowPathIcon />
</template>
<script lang="ts" setup>
import ArrowPathIcon from '@heroicons/vue/24/outline/esm/ArrowPathIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m11.25 9-3 3m0 0 3 3m-3-3h7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
/>
</svg>
<ArrowLeftCircleIcon />
</template>
<script lang="ts" setup>
import ArrowLeftCircleIcon from '@heroicons/vue/24/outline/esm/ArrowLeftCircleIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m12.75 15 3-3m0 0-3-3m3 3h-7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
/>
</svg>
<ArrowRightCircleIcon />
</template>
<script lang="ts" setup>
import ArrowRightCircleIcon from '@heroicons/vue/24/outline/esm/ArrowLeftCircleIcon';
</script>
+5 -11
View File
@@ -1,13 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M3.293 9.707a1 1 0 010-1.414l6-6a1 1 0 011.414 0l6 6a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L4.707 9.707a1 1 0 01-1.414 0z"
clip-rule="evenodd"
/>
</svg>
<ArrowUpIcon />
</template>
<script lang="ts" setup>
import ArrowUpIcon from '@heroicons/vue/24/outline/esm/ArrowUpIcon';
</script>
+5 -10
View File
@@ -1,12 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
stroke-width="1.5"
fill="currentColor"
>
<path
d="M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75ZM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 0 1-1.875-1.875V8.625ZM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 0 1 3 19.875v-6.75Z"
/>
</svg>
<ChartBarIcon />
</template>
<script lang="ts" setup>
import ChartBarIcon from '@heroicons/vue/24/outline/esm/ChartBarIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
/>
</svg>
<CheckCircleIcon />
</template>
<script lang="ts" setup>
import CheckCircleIcon from '@heroicons/vue/24/outline/esm/CheckCircleIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
<XMarkIcon />
</template>
<script lang="ts" setup>
import XMarkIcon from '@heroicons/vue/24/outline/esm/XMarkIcon';
</script>
+5 -11
View File
@@ -1,13 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
clip-rule="evenodd"
/>
</svg>
<TrashIcon />
</template>
<script lang="ts" setup>
import TrashIcon from '@heroicons/vue/24/outline/esm/TrashIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"
/>
</svg>
<ArrowDownTrayIcon />
</template>
<script lang="ts" setup>
import ArrowDownTrayIcon from '@heroicons/vue/24/outline/esm/ArrowDownTrayIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
/>
</svg>
<PencilSquareIcon />
</template>
<script lang="ts" setup>
import PencilSquareIcon from '@heroicons/vue/24/outline/esm/PencilSquareIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m11.25 11.25.041-.02a.75.75 0 0 1 1.063.852l-.708 2.836a.75.75 0 0 0 1.063.853l.041-.021M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9-3.75h.008v.008H12V8.25Z"
/>
</svg>
<InformationCircleIcon />
</template>
<script lang="ts" setup>
import InformationCircleIcon from '@heroicons/vue/24/outline/esm/InformationCircleIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m10.5 21 5.25-11.25L21 21m-9-3h7.5M3 5.621a48.474 48.474 0 0 1 6-.371m0 0c1.12 0 2.233.038 3.334.114M9 5.25V3m3.334 2.364C11.176 10.658 7.69 15.08 3 17.502m9.334-12.138c.896.061 1.785.147 2.666.257m-4.589 8.495a18.023 18.023 0 0 1-3.827-5.802"
/>
</svg>
<LanguageIcon />
</template>
<script lang="ts" setup>
import LanguageIcon from '@heroicons/vue/24/outline/esm/LanguageIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13.213 9.787a3.391 3.391 0 0 0-4.795 0l-3.425 3.426a3.39 3.39 0 0 0 4.795 4.794l.321-.304m-.321-4.49a3.39 3.39 0 0 0 4.795 0l3.424-3.426a3.39 3.39 0 0 0-4.794-4.795l-1.028.961"
/>
</svg>
<LinkIcon />
</template>
<script lang="ts" setup>
import LinkIcon from '@heroicons/vue/24/outline/esm/LinkIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
/>
</svg>
<ArrowRightStartOnRectangleIcon />
</template>
<script lang="ts" setup>
import ArrowRightStartOnRectangleIcon from '@heroicons/vue/24/outline/esm/ArrowRightStartOnRectangleIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M21.752 15.002A9.72 9.72 0 0 1 18 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 0 0 3 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 0 0 9.002-5.998Z"
/>
</svg>
<MoonIcon />
</template>
<script lang="ts" setup>
import MoonIcon from '@heroicons/vue/24/outline/esm/MoonIcon';
</script>
+5 -14
View File
@@ -1,16 +1,7 @@
<template>
<svg
inline
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 6v6m0 0v6m0-6h6m-6 0H6"
/>
</svg>
<PlusIcon />
</template>
<script lang="ts" setup>
import PlusIcon from '@heroicons/vue/24/outline/esm/PlusIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 4v1m6 11h2m-6 0h-2v4m0-11v3m0 0h.01M12 12h4.01M16 20h4M4 12h4m12 0h.01M5 8h2a1 1 0 001-1V5a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1zm12 0h2a1 1 0 001-1V5a1 1 0 00-1-1h-2a1 1 0 00-1 1v2a1 1 0 001 1zM5 20h2a1 1 0 001-1v-2a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1z"
/>
</svg>
<QrCodeIcon />
</template>
<script lang="ts" setup>
import QrCodeIcon from '@heroicons/vue/24/outline/esm/QrCodeIcon';
</script>
+7
View File
@@ -0,0 +1,7 @@
<template>
<SparklesIcon />
</template>
<script lang="ts" setup>
import SparklesIcon from '@heroicons/vue/24/outline/esm/SparklesIcon';
</script>
+5 -14
View File
@@ -1,16 +1,7 @@
<template>
<svg
inline
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M5.25 14.25h13.5m-13.5 0a3 3 0 0 1-3-3m3 3a3 3 0 1 0 0 6h13.5a3 3 0 1 0 0-6m-16.5-3a3 3 0 0 1 3-3h13.5a3 3 0 0 1 3 3m-19.5 0a4.5 4.5 0 0 1 .9-2.7L5.737 5.1a3.375 3.375 0 0 1 2.7-1.35h7.126c1.062 0 2.062.5 2.7 1.35l2.587 3.45a4.5 4.5 0 0 1 .9 2.7m0 0a3 3 0 0 1-3 3m0 3h.008v.008h-.008v-.008Zm0-6h.008v.008h-.008v-.008Zm-3 6h.008v.008h-.008v-.008Zm0-6h.008v.008h-.008v-.008Z"
/>
</svg>
<ServerStackIcon />
</template>
<script lang="ts" setup>
import ServerStackIcon from '@heroicons/vue/24/outline/esm/ServerStackIcon';
</script>
+5 -13
View File
@@ -1,15 +1,7 @@
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M12 3v2.25m6.364.386-1.591 1.591M21 12h-2.25m-.386 6.364-1.591-1.591M12 18.75V21m-4.773-4.227-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z"
/>
</svg>
<SunIcon />
</template>
<script lang="ts" setup>
import SunIcon from '@heroicons/vue/24/outline/esm/SunIcon';
</script>
+5 -15
View File
@@ -1,17 +1,7 @@
<template>
<!-- Heroicon name: outline/exclamation -->
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
/>
</svg>
<ExclamationTriangleIcon />
</template>
<script lang="ts" setup>
import ExclamationTriangleIcon from '@heroicons/vue/24/outline/esm/ExclamationTriangleIcon';
</script>
+2 -2
View File
@@ -7,7 +7,7 @@
href="https://github.com/wg-easy/wg-easy"
>WireGuard Easy</a
>
({{ globalStore.release?.currentRelease }}) © 2021-2025 by
({{ globalStore.information?.currentRelease }}) © 2021-2025 by
<a
class="hover:underline"
target="_blank"
@@ -24,7 +24,7 @@
·
<a
class="hover:underline"
href="https://github.com/sponsors/WeeJeWel"
href="https://github.com/wg-easy/wg-easy#donate"
target="_blank"
>{{ $t('layout.donate') }}</a
>
+31 -14
View File
@@ -1,21 +1,42 @@
import type { NitroFetchRequest, NitroFetchOptions } from 'nitropack/types';
import type {
NitroFetchRequest,
NitroFetchOptions,
TypedInternalResponse,
ExtractedRouteMethod,
} from 'nitropack/types';
import { FetchError } from 'ofetch';
type RevertFn = (success: boolean) => Promise<void>;
type RevertFn<
R extends NitroFetchRequest,
T = unknown,
O extends NitroFetchOptions<R> = NitroFetchOptions<R>,
> = (
success: boolean,
data:
| TypedInternalResponse<
R,
T,
NitroFetchOptions<R> extends O ? 'get' : ExtractedRouteMethod<R, O>
>
| undefined
) => Promise<void>;
type SubmitOpts = {
revert: RevertFn;
type SubmitOpts<
R extends NitroFetchRequest,
T = unknown,
O extends NitroFetchOptions<R> = NitroFetchOptions<R>,
> = {
revert: RevertFn<R, T, O>;
successMsg?: string;
errorMsg?: string;
noSuccessToast?: boolean;
};
export function useSubmit<
R extends NitroFetchRequest,
O extends NitroFetchOptions<R> & { body?: never },
>(url: R, options: O, opts: SubmitOpts) {
T = unknown,
>(url: R, options: O, opts: SubmitOpts<R, T, O>) {
const toast = useToast();
const { t: $t } = useI18n();
return async (data: unknown) => {
try {
@@ -24,11 +45,6 @@ export function useSubmit<
body: data,
});
// eslint-disable-next-line @typescript-eslint/no-explicit-any
if (!(res as any).success) {
throw new Error(opts.errorMsg || $t('toast.errored'));
}
if (!opts.noSuccessToast) {
toast.showToast({
type: 'success',
@@ -36,7 +52,8 @@ export function useSubmit<
});
}
await opts.revert(true);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
await opts.revert(true, res as any);
} catch (e) {
if (e instanceof FetchError) {
toast.showToast({
@@ -51,7 +68,7 @@ export function useSubmit<
} else {
console.error(e);
}
await opts.revert(false);
await opts.revert(false, undefined);
}
};
}
+5 -5
View File
@@ -1,23 +1,23 @@
<template>
<div>
<header class="container mx-auto mt-4 max-w-3xl px-3 xs:mt-6 md:px-0">
<header class="mx-auto mt-4 flex max-w-3xl flex-col justify-center">
<div
class="mb-5"
class="mb-5 w-full"
:class="
loggedIn
? 'flex flex-auto flex-col-reverse items-center gap-3 xxs:flex-row'
? 'flex flex-col items-center justify-between sm:flex-row'
: 'flex justify-end'
"
>
<HeaderLogo v-if="loggedIn" />
<div class="flex grow-0 items-center gap-3 self-end xxs:self-center">
<div class="flex flex-row gap-3">
<HeaderLangSelector />
<HeaderThemeSwitch />
<HeaderChartToggle v-if="loggedIn" />
<UiUserMenu v-if="loggedIn" />
</div>
</div>
<HeaderUpdate class="mt-5" />
<HeaderUpdate class="mt-4" />
</header>
<slot />
<UiFooter />
+2 -2
View File
@@ -11,8 +11,8 @@
</header>
<main>
<Panel>
<PanelBody class="mx-auto mt-10 p-4 md:w-[70%] lg:w-[60%]">
<h2 class="mb-16 mt-8 text-3xl font-medium">
<PanelBody class="m-4 mx-auto mt-10 md:w-[70%] lg:w-[60%]">
<h2 class="mb-16 mt-8 text-center text-3xl font-medium">
{{ $t('setup.welcome') }}
</h2>
+12 -7
View File
@@ -1,8 +1,8 @@
<template>
<div>
<div class="container mx-auto p-4">
<div class="flex">
<div class="mr-4 w-64 rounded-lg bg-white p-4 dark:bg-neutral-700">
<div class="flex flex-col gap-4 lg:flex-row">
<div class="rounded-lg bg-white p-4 lg:w-64 dark:bg-neutral-700">
<NuxtLink to="/admin">
<h2 class="mb-4 text-xl font-bold dark:text-neutral-200">
{{ t('pages.admin.panel') }}
@@ -13,13 +13,14 @@
v-for="(item, index) in menuItems"
:key="index"
:to="`/admin/${item.id}`"
active-class="bg-red-800 rounded"
>
<BaseButton
<BaseSecondaryButton
as="span"
class="w-full cursor-pointer rounded p-2 font-medium transition-colors duration-200 hover:bg-red-800 dark:text-neutral-200"
>
{{ item.name }}
</BaseButton>
</BaseSecondaryButton>
</NuxtLink>
</div>
</div>
@@ -27,7 +28,7 @@
<div
class="flex-1 rounded-lg bg-white p-6 dark:bg-neutral-700 dark:text-neutral-200"
>
<h1 class="mb-6 text-3xl font-bold">{{ activeMenuItem?.name }}</h1>
<h1 class="mb-6 text-3xl font-bold">{{ activeMenuItem.name }}</h1>
<NuxtPage />
</div>
</div>
@@ -44,13 +45,17 @@ const { t } = useI18n();
const route = useRoute();
const menuItems = [
{ id: '', name: t('pages.admin.general') },
{ id: 'general', name: t('pages.admin.general') },
{ id: 'config', name: t('pages.admin.config') },
{ id: 'interface', name: t('pages.admin.interface') },
{ id: 'hooks', name: t('pages.admin.hooks') },
];
const defaultItem = { id: '', name: t('pages.admin.panel') };
const activeMenuItem = computed(() => {
return menuItems.find((item) => route.path === `/admin/${item.id}`);
return (
menuItems.find((item) => route.path === `/admin/${item.id}`) ?? defaultItem
);
});
</script>

Some files were not shown because too many files have changed in this diff Show More