Squashed commit of the following:

commit 069f81fc3c87c437eceff756ddca7a4c1b58044d
Author: vnugent <public@vaughnnugent.com>
Date:   Sat Feb 24 22:33:34 2024 -0500

    feat: #3 setup mode, admin signup, fixes, and contianerize!

commit 97ffede9eb312fca0257afa06969d47a12703f3b
Author: vnugent <public@vaughnnugent.com>
Date:   Mon Feb 19 22:26:03 2024 -0500

    feat: new account setup and invitation links

commit 1c8f59bc0a1b25ce5013b0f1fc7fa73c0de415d6
Author: vnugent <public@vaughnnugent.com>
Date:   Thu Feb 15 16:49:59 2024 -0500

    feat: update packages, drag/drop link, and fix some button padding

18 files changed, 835 insertions, 271 deletions

diff --git a/front-end/package-lock.json b/front-end/package-lock.json
index e5afed6..f35132c 100644
--- a/front-end/package-lock.json
+++ b/front-end/package-lock.json
@@ -10,7 +10,7 @@
       "license": "agpl3",
       "dependencies": {
         "@headlessui/vue": "^1.7.17",
-        "@vnuge/vnlib.browser": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/df7dc615532d3441f527374d18664c1a5a336de6/@vnuge-vnlib.browser/release.tgz",
+        "@vnuge/vnlib.browser": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/0d3612601ee2ff42cc72c9a4e29de66ea9cdc3fd/@vnuge-vnlib.browser/release.tgz",
         "@vuelidate/core": "^2.0.2",
         "@vuelidate/validators": "^2.0.2",
         "@vueuse/core": "^10.3.x",
@@ -497,9 +497,9 @@
       }
     },
     "node_modules/@headlessui/vue": {
-      "version": "1.7.17",
-      "resolved": "https://registry.npmjs.org/@headlessui/vue/-/vue-1.7.17.tgz",
-      "integrity": "sha512-hmJChv8HzKorxd9F70RGnECAwZfkvmmwOqreuKLWY/19d5qbWnSdw+DNbuA/Uo6X5rb4U5B3NrT+qBKPmjhRqw==",
+      "version": "1.7.19",
+      "resolved": "https://registry.npmjs.org/@headlessui/vue/-/vue-1.7.19.tgz",
+      "integrity": "sha512-VFjKPybogux/5/QYGSq4zgG/x3RcxId15W8uguAJAjPBxelI23dwjOjTx/mIiMkM/Hd3rzFxcf2aIp56eEWRcA==",
       "dependencies": {
         "@tanstack/vue-virtual": "^3.0.0-beta.60"
       },
@@ -602,9 +602,9 @@
       }
     },
     "node_modules/@jridgewell/resolve-uri": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
-      "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
@@ -686,9 +686,9 @@
       }
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.6.tgz",
-      "integrity": "sha512-MVNXSSYN6QXOulbHpLMKYi60ppyO13W9my1qogeiAqtjb2yR4LSmfU2+POvDkLzhjYLXz9Rf9+9a3zFHW1Lecg==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.11.0.tgz",
+      "integrity": "sha512-BV+u2QSfK3i1o6FucqJh5IK9cjAU6icjFFhvknzFgu472jzl0bBojfDAkJLBEsHFMo+YZg6rthBvBBt8z12IBQ==",
       "cpu": [
         "arm"
       ],
@@ -699,9 +699,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.9.6.tgz",
-      "integrity": "sha512-T14aNLpqJ5wzKNf5jEDpv5zgyIqcpn1MlwCrUXLrwoADr2RkWA0vOWP4XxbO9aiO3dvMCQICZdKeDrFl7UMClw==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.11.0.tgz",
+      "integrity": "sha512-0ij3iw7sT5jbcdXofWO2NqDNjSVVsf6itcAkV2I6Xsq4+6wjW1A8rViVB67TfBEan7PV2kbLzT8rhOVWLI2YXw==",
       "cpu": [
         "arm64"
       ],
@@ -712,9 +712,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.9.6.tgz",
-      "integrity": "sha512-CqNNAyhRkTbo8VVZ5R85X73H3R5NX9ONnKbXuHisGWC0qRbTTxnF1U4V9NafzJbgGM0sHZpdO83pLPzq8uOZFw==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.11.0.tgz",
+      "integrity": "sha512-yPLs6RbbBMupArf6qv1UDk6dzZvlH66z6NLYEwqTU0VHtss1wkI4UYeeMS7TVj5QRVvaNAWYKP0TD/MOeZ76Zg==",
       "cpu": [
         "arm64"
       ],
@@ -725,9 +725,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.9.6.tgz",
-      "integrity": "sha512-zRDtdJuRvA1dc9Mp6BWYqAsU5oeLixdfUvkTHuiYOHwqYuQ4YgSmi6+/lPvSsqc/I0Omw3DdICx4Tfacdzmhog==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.11.0.tgz",
+      "integrity": "sha512-OvqIgwaGAwnASzXaZEeoJY3RltOFg+WUbdkdfoluh2iqatd090UeOG3A/h0wNZmE93dDew9tAtXgm3/+U/B6bw==",
       "cpu": [
         "x64"
       ],
@@ -738,9 +738,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.9.6.tgz",
-      "integrity": "sha512-oNk8YXDDnNyG4qlNb6is1ojTOGL/tRhbbKeE/YuccItzerEZT68Z9gHrY3ROh7axDc974+zYAPxK5SH0j/G+QQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.11.0.tgz",
+      "integrity": "sha512-X17s4hZK3QbRmdAuLd2EE+qwwxL8JxyVupEqAkxKPa/IgX49ZO+vf0ka69gIKsaYeo6c1CuwY3k8trfDtZ9dFg==",
       "cpu": [
         "arm"
       ],
@@ -751,9 +751,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.9.6.tgz",
-      "integrity": "sha512-Z3O60yxPtuCYobrtzjo0wlmvDdx2qZfeAWTyfOjEDqd08kthDKexLpV97KfAeUXPosENKd8uyJMRDfFMxcYkDQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.11.0.tgz",
+      "integrity": "sha512-673Lu9EJwxVB9NfYeA4AdNu0FOHz7g9t6N1DmT7bZPn1u6bTF+oZjj+fuxUcrfxWXE0r2jxl5QYMa9cUOj9NFg==",
       "cpu": [
         "arm64"
       ],
@@ -764,9 +764,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.9.6.tgz",
-      "integrity": "sha512-gpiG0qQJNdYEVad+1iAsGAbgAnZ8j07FapmnIAQgODKcOTjLEWM9sRb+MbQyVsYCnA0Im6M6QIq6ax7liws6eQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.11.0.tgz",
+      "integrity": "sha512-yFW2msTAQNpPJaMmh2NpRalr1KXI7ZUjlN6dY/FhWlOclMrZezm5GIhy3cP4Ts2rIAC+IPLAjNibjp1BsxCVGg==",
       "cpu": [
         "arm64"
       ],
@@ -777,9 +777,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.9.6.tgz",
-      "integrity": "sha512-+uCOcvVmFUYvVDr27aiyun9WgZk0tXe7ThuzoUTAukZJOwS5MrGbmSlNOhx1j80GdpqbOty05XqSl5w4dQvcOA==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.11.0.tgz",
+      "integrity": "sha512-kKT9XIuhbvYgiA3cPAGntvrBgzhWkGpBMzuk1V12Xuoqg7CI41chye4HU0vLJnGf9MiZzfNh4I7StPeOzOWJfA==",
       "cpu": [
         "riscv64"
       ],
@@ -790,9 +790,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.9.6.tgz",
-      "integrity": "sha512-HUNqM32dGzfBKuaDUBqFB7tP6VMN74eLZ33Q9Y1TBqRDn+qDonkAUyKWwF9BR9unV7QUzffLnz9GrnKvMqC/fw==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.11.0.tgz",
+      "integrity": "sha512-6q4ESWlyTO+erp1PSCmASac+ixaDv11dBk1fqyIuvIUc/CmRAX2Zk+2qK1FGo5q7kyDcjHCFVwgGFCGIZGVwCA==",
       "cpu": [
         "x64"
       ],
@@ -803,9 +803,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.9.6.tgz",
-      "integrity": "sha512-ch7M+9Tr5R4FK40FHQk8VnML0Szi2KRujUgHXd/HjuH9ifH72GUmw6lStZBo3c3GB82vHa0ZoUfjfcM7JiiMrQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.11.0.tgz",
+      "integrity": "sha512-vIAQUmXeMLmaDN78HSE4Kh6xqof2e3TJUKr+LPqXWU4NYNON0MDN9h2+t4KHrPAQNmU3w1GxBQ/n01PaWFwa5w==",
       "cpu": [
         "x64"
       ],
@@ -816,9 +816,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.9.6.tgz",
-      "integrity": "sha512-VD6qnR99dhmTQ1mJhIzXsRcTBvTjbfbGGwKAHcu+52cVl15AC/kplkhxzW/uT0Xl62Y/meBKDZvoJSJN+vTeGA==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.11.0.tgz",
+      "integrity": "sha512-LVXo9dDTGPr0nezMdqa1hK4JeoMZ02nstUxGYY/sMIDtTYlli1ZxTXBYAz3vzuuvKO4X6NBETciIh7N9+abT1g==",
       "cpu": [
         "arm64"
       ],
@@ -829,9 +829,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.9.6.tgz",
-      "integrity": "sha512-J9AFDq/xiRI58eR2NIDfyVmTYGyIZmRcvcAoJ48oDld/NTR8wyiPUu2X/v1navJ+N/FGg68LEbX3Ejd6l8B7MQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.11.0.tgz",
+      "integrity": "sha512-xZVt6K70Gr3I7nUhug2dN6VRR1ibot3rXqXS3wo+8JP64t7djc3lBFyqO4GiVrhNaAIhUCJtwQ/20dr0h0thmQ==",
       "cpu": [
         "ia32"
       ],
@@ -842,9 +842,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.9.6.tgz",
-      "integrity": "sha512-jqzNLhNDvIZOrt69Ce4UjGRpXJBzhUBzawMwnaDAwyHriki3XollsewxWzOzz+4yOFDkuJHtTsZFwMxhYJWmLQ==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.11.0.tgz",
+      "integrity": "sha512-f3I7h9oTg79UitEco9/2bzwdciYkWr8pITs3meSDSlr1TdvQ7IxkQaaYN2YqZXX5uZhiYL+VuYDmHwNzhx+HOg==",
       "cpu": [
         "x64"
       ],
@@ -916,9 +916,9 @@
       "peer": true
     },
     "node_modules/@vitejs/plugin-vue": {
-      "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.0.3.tgz",
-      "integrity": "sha512-b8S5dVS40rgHdDrw+DQi/xOM9ed+kSRZzfm1T74bMmBDCd8XO87NKlFYInzCtwvtWwXZvo1QxE2OSspTATWrbA==",
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.0.4.tgz",
+      "integrity": "sha512-WS3hevEszI6CEVEx28F8RjTX97k3KsrcY6kvTg7+Whm5y3oYvcqzVeGCU3hxSAn4uY2CLCkeokkGKpoctccilQ==",
       "dev": true,
       "engines": {
         "node": "^18.0.0 || >=20.0.0"
@@ -930,8 +930,8 @@
     },
     "node_modules/@vnuge/vnlib.browser": {
       "version": "0.1.13",
-      "resolved": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/df7dc615532d3441f527374d18664c1a5a336de6/@vnuge-vnlib.browser/release.tgz",
-      "integrity": "sha512-Ddm0cVV4GeNaO5Dd8ycMklswnXBY4L+7gOSu2W1vOOabc8YDaP2XsTaA+xImFVLXj86hQbBTRUUKF9Ebacx+WQ==",
+      "resolved": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/0d3612601ee2ff42cc72c9a4e29de66ea9cdc3fd/@vnuge-vnlib.browser/release.tgz",
+      "integrity": "sha512-3SG6FehSVGo8p6O4XW7KPdWA19oOOQn5XmAnWHN81LqAMPzn4rwOMTICYomIMhDuxddi5v7lnNUrSCihTnWXlw==",
       "license": "MIT",
       "peerDependencies": {
         "@vueuse/core": "^10.x",
@@ -973,55 +973,55 @@
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.15.tgz",
-      "integrity": "sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.19.tgz",
+      "integrity": "sha512-gj81785z0JNzRcU0Mq98E56e4ltO1yf8k5PQ+tV/7YHnbZkrM0fyFyuttnN8ngJZjbpofWE/m4qjKBiLl8Ju4w==",
       "dependencies": {
-        "@babel/parser": "^7.23.6",
-        "@vue/shared": "3.4.15",
+        "@babel/parser": "^7.23.9",
+        "@vue/shared": "3.4.19",
         "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.15.tgz",
-      "integrity": "sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.19.tgz",
+      "integrity": "sha512-vm6+cogWrshjqEHTzIDCp72DKtea8Ry/QVpQRYoyTIg9k7QZDX6D8+HGURjtmatfgM8xgCFtJJaOlCaRYRK3QA==",
       "dependencies": {
-        "@vue/compiler-core": "3.4.15",
-        "@vue/shared": "3.4.15"
+        "@vue/compiler-core": "3.4.19",
+        "@vue/shared": "3.4.19"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.15.tgz",
-      "integrity": "sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==",
-      "dependencies": {
-        "@babel/parser": "^7.23.6",
-        "@vue/compiler-core": "3.4.15",
-        "@vue/compiler-dom": "3.4.15",
-        "@vue/compiler-ssr": "3.4.15",
-        "@vue/shared": "3.4.15",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.19.tgz",
+      "integrity": "sha512-LQ3U4SN0DlvV0xhr1lUsgLCYlwQfUfetyPxkKYu7dkfvx7g3ojrGAkw0AERLOKYXuAGnqFsEuytkdcComei3Yg==",
+      "dependencies": {
+        "@babel/parser": "^7.23.9",
+        "@vue/compiler-core": "3.4.19",
+        "@vue/compiler-dom": "3.4.19",
+        "@vue/compiler-ssr": "3.4.19",
+        "@vue/shared": "3.4.19",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5",
+        "magic-string": "^0.30.6",
         "postcss": "^8.4.33",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.15.tgz",
-      "integrity": "sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.19.tgz",
+      "integrity": "sha512-P0PLKC4+u4OMJ8sinba/5Z/iDT84uMRRlrWzadgLA69opCpI1gG4N55qDSC+dedwq2fJtzmGald05LWR5TFfLw==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.15",
-        "@vue/shared": "3.4.15"
+        "@vue/compiler-dom": "3.4.19",
+        "@vue/shared": "3.4.19"
       }
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
-      "integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA=="
+      "version": "6.6.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.1.tgz",
+      "integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
     },
     "node_modules/@vue/language-core": {
       "version": "1.8.27",
@@ -1073,48 +1073,48 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.15.tgz",
-      "integrity": "sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.19.tgz",
+      "integrity": "sha512-+VcwrQvLZgEclGZRHx4O2XhyEEcKaBi50WbxdVItEezUf4fqRh838Ix6amWTdX0CNb/b6t3Gkz3eOebfcSt+UA==",
       "dependencies": {
-        "@vue/shared": "3.4.15"
+        "@vue/shared": "3.4.19"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.15.tgz",
-      "integrity": "sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.19.tgz",
+      "integrity": "sha512-/Z3tFwOrerJB/oyutmJGoYbuoadphDcJAd5jOuJE86THNZji9pYjZroQ2NFsZkTxOq0GJbb+s2kxTYToDiyZzw==",
       "dependencies": {
-        "@vue/reactivity": "3.4.15",
-        "@vue/shared": "3.4.15"
+        "@vue/reactivity": "3.4.19",
+        "@vue/shared": "3.4.19"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.15.tgz",
-      "integrity": "sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.19.tgz",
+      "integrity": "sha512-IyZzIDqfNCF0OyZOauL+F4yzjMPN2rPd8nhqPP2N1lBn3kYqJpPHHru+83Rkvo2lHz5mW+rEeIMEF9qY3PB94g==",
       "dependencies": {
-        "@vue/runtime-core": "3.4.15",
-        "@vue/shared": "3.4.15",
+        "@vue/runtime-core": "3.4.19",
+        "@vue/shared": "3.4.19",
         "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.15.tgz",
-      "integrity": "sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==",
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.19.tgz",
+      "integrity": "sha512-eAj2p0c429RZyyhtMRnttjcSToch+kTWxFPHlzGMkR28ZbF1PDlTcmGmlDxccBuqNd9iOQ7xPRPAGgPVj+YpQw==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.4.15",
-        "@vue/shared": "3.4.15"
+        "@vue/compiler-ssr": "3.4.19",
+        "@vue/shared": "3.4.19"
       },
       "peerDependencies": {
-        "vue": "3.4.15"
+        "vue": "3.4.19"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.15.tgz",
-      "integrity": "sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g=="
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.19.tgz",
+      "integrity": "sha512-/KliRRHMF6LoiThEy+4c1Z4KB/gbPrGjWwJR+crg2otgrf/egKzRaCPvJ51S5oetgsgXLfc4Rm5ZgrKHZrtMSw=="
     },
     "node_modules/@vuelidate/core": {
       "version": "2.0.3",
@@ -1471,9 +1471,9 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.22.3",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.3.tgz",
-      "integrity": "sha512-UAp55yfwNv0klWNapjs/ktHoguxuQNGnOzxYmfnXIS+8AsRDZkSDxg7R1AX3GKzn078SBI5dzwzj/Yx0Or0e3A==",
+      "version": "4.23.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz",
+      "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==",
       "dev": true,
       "funding": [
         {
@@ -1490,8 +1490,8 @@
         }
       ],
       "dependencies": {
-        "caniuse-lite": "^1.0.30001580",
-        "electron-to-chromium": "^1.4.648",
+        "caniuse-lite": "^1.0.30001587",
+        "electron-to-chromium": "^1.4.668",
         "node-releases": "^2.0.14",
         "update-browserslist-db": "^1.0.13"
       },
@@ -1521,9 +1521,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001583",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001583.tgz",
-      "integrity": "sha512-acWTYaha8xfhA/Du/z4sNZjHUWjkiuoAi2LM+T/aL+kemKQgPT1xBb/YKjlQ0Qo8gvbHsGNplrEJ+9G3gL7i4Q==",
+      "version": "1.0.30001587",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001587.tgz",
+      "integrity": "sha512-HMFNotUmLXn71BQxg8cijvqxnIAofforZOwGsxyXJ0qugTdspUF4sPSJ2vhgprHCB996tIDzEq1ubumPDV8ULA==",
       "dev": true,
       "funding": [
         {
@@ -1557,16 +1557,10 @@
       }
     },
     "node_modules/chokidar": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
-      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
       "dev": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://paulmillr.com/funding/"
-        }
-      ],
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -1579,6 +1573,9 @@
       "engines": {
         "node": ">= 8.10.0"
       },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
       "optionalDependencies": {
         "fsevents": "~2.3.2"
       }
@@ -1742,15 +1739,15 @@
       }
     },
     "node_modules/dotenv": {
-      "version": "16.4.1",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.1.tgz",
-      "integrity": "sha512-CjA3y+Dr3FyFDOAMnxZEGtnW9KBR2M0JvvUtXNW+dYJL5ROWxP9DUHCwgFqpMk0OXCc0ljhaNTr2w/kutYIcHQ==",
+      "version": "16.4.4",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.4.tgz",
+      "integrity": "sha512-XvPXc8XAQThSjAbY6cQ/9PcBXmFoWuw1sQ3b8HqUCR6ziGXjkTi//kB9SWa2UwqlgdAIuRqAa/9hVljzPehbYg==",
       "dev": true,
       "engines": {
         "node": ">=12"
       },
       "funding": {
-        "url": "https://github.com/motdotla/dotenv?sponsor=1"
+        "url": "https://dotenvx.com"
       }
     },
     "node_modules/eastasianwidth": {
@@ -1760,9 +1757,9 @@
       "dev": true
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.656",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.656.tgz",
-      "integrity": "sha512-9AQB5eFTHyR3Gvt2t/NwR0le2jBSUNwCnMbUCejFWHD+so4tH40/dRLgoE+jxlPeWS43XJewyvCv+I8LPMl49Q==",
+      "version": "1.4.671",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.671.tgz",
+      "integrity": "sha512-UUlE+/rWbydmp+FW8xlnnTA5WNA0ZZd2XL8CuMS72rh+k4y1f8+z6yk3UQhEwqHQWj6IBdL78DwWOdGMvYfQyA==",
       "dev": true
     },
     "node_modules/emoji-regex": {
@@ -1821,9 +1818,9 @@
       }
     },
     "node_modules/escalade": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
+      "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
       "dev": true,
       "engines": {
         "node": ">=6"
@@ -2029,9 +2026,9 @@
       "peer": true
     },
     "node_modules/fastq": {
-      "version": "1.17.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.0.tgz",
-      "integrity": "sha512-zGygtijUMT7jnk3h26kUms3BkSDp4IfIKjmnqI2tvx6nuBfiF1UqOxbnLfzdv+apBy+53oaImsKtMw/xYbW+1w==",
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
+      "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
       "dependencies": {
         "reusify": "^1.0.4"
       }
@@ -2097,9 +2094,9 @@
       "peer": true
     },
     "node_modules/flowbite": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/flowbite/-/flowbite-2.2.1.tgz",
-      "integrity": "sha512-iiZyBTtriEDRHrqXZgpKHaxl4B2J8HZUP8Yn1RXozUDKszWHDVj4GxQqMMB9AJHRWOgXV/4E/LJZ/zqQgBUhWA==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/flowbite/-/flowbite-2.3.0.tgz",
+      "integrity": "sha512-pm3JRo8OIJHGfFYWgaGpPv8E+UdWy0Z3gEAGufw+G/1dusaU/P1zoBLiQpf2/+bYAi+GBQtPVG86KYlV0W+AFQ==",
       "dependencies": {
         "@popperjs/core": "^2.9.3",
         "mini-svg-data-uri": "^1.4.3"
@@ -2257,9 +2254,9 @@
       }
     },
     "node_modules/hasown": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz",
-      "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.1.tgz",
+      "integrity": "sha512-1/th4MHjnwncwXsIW6QMzlvYL9kG5e/CpVvLRZe4XPa8TOUNbCELqmvhDmnkNsAjwaG4+I8gJJL0JBvTTLO9qA==",
       "dev": true,
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -2436,9 +2433,9 @@
       }
     },
     "node_modules/jose": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/jose/-/jose-5.2.0.tgz",
-      "integrity": "sha512-oW3PCnvyrcm1HMvGTzqjxxfnEs9EoFOFWi2HsEGhlFVOXxTE3K9GKWVMFoFw06yPUqwpvEWic1BmtUZBI/tIjw==",
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/jose/-/jose-5.2.2.tgz",
+      "integrity": "sha512-/WByRr4jDcsKlvMd1dRJnPfS1GVO3WuKyaurJ/vvXcOaUQO8rnNObCQMlv/5uCceVQIq5Q4WLF44ohsdiTohdg==",
       "funding": {
         "url": "https://github.com/sponsors/panva"
       }
@@ -2563,9 +2560,9 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.6",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.6.tgz",
-      "integrity": "sha512-n62qCLbPjNjyo+owKtveQxZFZTBm+Ms6YoGD23Wew6Vw337PElFNifQpknPruVRQV57kVShPnLGo9vWxVhpPvA==",
+      "version": "0.30.7",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.7.tgz",
+      "integrity": "sha512-8vBuFF/I/+OSLRmdf2wwFCJCz+nSn0m6DPvGH1fS/KiQoSaR+sETbov0eIk9KhEKy8CYqIkIAnbohxT/4H0kuA==",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.4.15"
       },
@@ -2958,9 +2955,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.33",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
-      "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
+      "version": "8.4.35",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.35.tgz",
+      "integrity": "sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==",
       "funding": [
         {
           "type": "opencollective",
@@ -3056,12 +3053,15 @@
       }
     },
     "node_modules/postcss-load-config/node_modules/lilconfig": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.0.0.tgz",
-      "integrity": "sha512-K2U4W2Ff5ibV7j7ydLr+zLAkIg5JJ4lPn1Ltsdt+Tz/IjQ8buJ55pZAxoP34lqIiwtF9iAvtLv3JGv7CAyAg+g==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.0.tgz",
+      "integrity": "sha512-p3cz0JV5vw/XeouBU3Ldnp+ZkBjE+n8ydJ4mcwBrOiXXPqNlrzGBqWs9X4MWF7f+iKUBu794Y8Hh8yawiJbCjw==",
       "dev": true,
       "engines": {
         "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antonk52"
       }
     },
     "node_modules/postcss-nested": {
@@ -3224,9 +3224,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.9.6",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.9.6.tgz",
-      "integrity": "sha512-05lzkCS2uASX0CiLFybYfVkwNbKZG5NFQ6Go0VWyogFTXXbR039UVsegViTntkk4OglHBdF54ccApXRRuXRbsg==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.11.0.tgz",
+      "integrity": "sha512-2xIbaXDXjf3u2tajvA5xROpib7eegJ9Y/uPlSFhXLNpK9ampCczXAhLEb5yLzJyG3LAdI1NWtNjDXiLyniNdjQ==",
       "dev": true,
       "dependencies": {
         "@types/estree": "1.0.5"
@@ -3239,19 +3239,19 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.9.6",
-        "@rollup/rollup-android-arm64": "4.9.6",
-        "@rollup/rollup-darwin-arm64": "4.9.6",
-        "@rollup/rollup-darwin-x64": "4.9.6",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.9.6",
-        "@rollup/rollup-linux-arm64-gnu": "4.9.6",
-        "@rollup/rollup-linux-arm64-musl": "4.9.6",
-        "@rollup/rollup-linux-riscv64-gnu": "4.9.6",
-        "@rollup/rollup-linux-x64-gnu": "4.9.6",
-        "@rollup/rollup-linux-x64-musl": "4.9.6",
-        "@rollup/rollup-win32-arm64-msvc": "4.9.6",
-        "@rollup/rollup-win32-ia32-msvc": "4.9.6",
-        "@rollup/rollup-win32-x64-msvc": "4.9.6",
+        "@rollup/rollup-android-arm-eabi": "4.11.0",
+        "@rollup/rollup-android-arm64": "4.11.0",
+        "@rollup/rollup-darwin-arm64": "4.11.0",
+        "@rollup/rollup-darwin-x64": "4.11.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.11.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.11.0",
+        "@rollup/rollup-linux-arm64-musl": "4.11.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.11.0",
+        "@rollup/rollup-linux-x64-gnu": "4.11.0",
+        "@rollup/rollup-linux-x64-musl": "4.11.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.11.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.11.0",
+        "@rollup/rollup-win32-x64-msvc": "4.11.0",
         "fsevents": "~2.3.2"
       }
     },
@@ -3295,9 +3295,9 @@
       }
     },
     "node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -3723,13 +3723,13 @@
       "dev": true
     },
     "node_modules/vite": {
-      "version": "5.0.12",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.12.tgz",
-      "integrity": "sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w==",
+      "version": "5.1.3",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.1.3.tgz",
+      "integrity": "sha512-UfmUD36DKkqhi/F75RrxvPpry+9+tTkrXfMNZD+SboZqBCMsxKtO52XeGzzuh7ioz+Eo/SYDBbdb0Z7vgcDJew==",
       "dev": true,
       "dependencies": {
         "esbuild": "^0.19.3",
-        "postcss": "^8.4.32",
+        "postcss": "^8.4.35",
         "rollup": "^4.2.0"
       },
       "bin": {
@@ -3778,15 +3778,15 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.4.15",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.15.tgz",
-      "integrity": "sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==",
-      "dependencies": {
-        "@vue/compiler-dom": "3.4.15",
-        "@vue/compiler-sfc": "3.4.15",
-        "@vue/runtime-dom": "3.4.15",
-        "@vue/server-renderer": "3.4.15",
-        "@vue/shared": "3.4.15"
+      "version": "3.4.19",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.19.tgz",
+      "integrity": "sha512-W/7Fc9KUkajFU8dBeDluM4sRGc/aa4YJnOYck8dkjgZoXtVsn3OeTGni66FV1l3+nvPA7VBFYtPioaGKUmEADw==",
+      "dependencies": {
+        "@vue/compiler-dom": "3.4.19",
+        "@vue/compiler-sfc": "3.4.19",
+        "@vue/runtime-dom": "3.4.19",
+        "@vue/server-renderer": "3.4.19",
+        "@vue/shared": "3.4.19"
       },
       "peerDependencies": {
         "typescript": "*"
diff --git a/front-end/package.json b/front-end/package.json
index fabf4ff..740807a 100644
--- a/front-end/package.json
+++ b/front-end/package.json
@@ -18,7 +18,7 @@
   },
   "dependencies": {
     "@headlessui/vue": "^1.7.17",
-    "@vnuge/vnlib.browser": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/df7dc615532d3441f527374d18664c1a5a336de6/@vnuge-vnlib.browser/release.tgz",
+    "@vnuge/vnlib.browser": "https://www.vaughnnugent.com/public/resources/software/builds/Plugins.Essentials/0d3612601ee2ff42cc72c9a4e29de66ea9cdc3fd/@vnuge-vnlib.browser/release.tgz",
     "@vuelidate/core": "^2.0.2",
     "@vuelidate/validators": "^2.0.2",
     "@vueuse/core": "^10.3.x",
diff --git a/front-end/src/App.vue b/front-end/src/App.vue
index 01e91e7..4bd94c8 100644
--- a/front-end/src/App.vue
+++ b/front-end/src/App.vue
@@ -1,8 +1,7 @@
 <script setup lang="ts">
 import { storeToRefs } from 'pinia';
 import { useStore, TabId } from './store';
-import { defineAsyncComponent } from 'vue';
-import { apiCall } from '@vnuge/vnlib.browser';
+import { computed, defineAsyncComponent } from 'vue';
 import { isEqual } from 'lodash-es';
 import { useDark } from '@vueuse/core';
 import SideMenuItem from './components/SideMenuItem.vue';
@@ -12,6 +11,7 @@ const Settings = defineAsyncComponent(() => import('./components/Settings.vue'))
 const Confirm = defineAsyncComponent(() => import('./components/global/ConfirmPrompt.vue'));
 const Alerts = defineAsyncComponent(() => import('./components/Alerts.vue'));
 const Login = defineAsyncComponent(() => import('./components/Login.vue'));
+const Registation = defineAsyncComponent(() => import('./components/Registation.vue'));
 const PasswordPrompt = defineAsyncComponent(() => import('./components/global/PasswordPrompt.vue'));
 
 const store = useStore();
@@ -20,12 +20,7 @@ const darkMode = useDark()
 
 store.setSiteTitle('Simple Bookmark')
 
-const logout = () => {
-  apiCall(async () => {
-    const { logout } = await store.socialOauth()
-    await logout()
-  })
-}
+const isSetupMode = computed(() => store.registation.status?.setup_mode === true)
 
 const showIf = (tabId: TabId, active: TabId) => isEqual(tabId, active)
 
@@ -39,7 +34,7 @@ const showIf = (tabId: TabId, active: TabId) => isEqual(tabId, active)
     <div id="app" class="min-h-screen pb-16 text-gray-700 bg-gray-50 dark:bg-gray-900 dark:text-white sm:pb-0">
       
       <div class="relative">
-          <div class="absolute z-50 right-10 top-10">
+          <div class="fixed z-50 right-10 top-10">
             <Alerts />
           </div>
       </div>
@@ -47,7 +42,7 @@ const showIf = (tabId: TabId, active: TabId) => isEqual(tabId, active)
       <Confirm />
       <PasswordPrompt />
 
-      <aside id="logo-sidebar" class="fixed top-0 left-0 z-10 w-64 h-screen transition-transform -translate-x-full sm:translate-x-0" aria-label="Sidebar">
+      <aside id="logo-sidebar" class="fixed top-0 left-0 z-20 w-64 h-screen transition-transform -translate-x-full sm:translate-x-0" aria-label="Sidebar">
           <div class="flex flex-col h-full px-3 py-4 overflow-y-auto bg-white dark:bg-gray-800">
               <div class="flex-auto">
                   <a href="/" class="flex items-center ps-2.5 mb-5">
@@ -106,7 +101,14 @@ const showIf = (tabId: TabId, active: TabId) => isEqual(tabId, active)
         </div>
       </aside>
 
+      <div v-if="isSetupMode" class="relative mb-16 sm:mb-10">
+          <div class="fixed top-0 z-10 w-full p-2 text-center text-white bg-amber-600">
+              Setup mode is enabled. Restart the server without --setup flag to disable this warning
+          </div>
+      </div>
+
       <div class="h-full py-6 md:p-6 sm:ml-64">
+        
         <div v-if="showIf(TabId.Bookmarks, activeTab)" class="flex flex-col w-full h-full">
           <Bookmarks />
         </div>
@@ -118,6 +120,10 @@ const showIf = (tabId: TabId, active: TabId) => isEqual(tabId, active)
         <div v-if="showIf(TabId.Settings, activeTab)" class="flex w-full h-full">
           <Settings />
         </div>
+
+        <div v-if="showIf(TabId.Register, activeTab)" class="flex w-full h-full">
+          <Registation/>
+        </div>
       </div>
 
       <div class="fixed bottom-0 left-0 z-50 w-full h-16 bg-white border-t border-gray-200 sm:hidden dark:bg-gray-700 dark:border-gray-600">
diff --git a/front-end/src/components/Bookmarks.vue b/front-end/src/components/Bookmarks.vue
index 93ddd73..cc3cd6a 100644
--- a/front-end/src/components/Bookmarks.vue
+++ b/front-end/src/components/Bookmarks.vue
@@ -5,10 +5,10 @@ import { get, set, formatTimeAgo, useToggle, useTimestamp, useFileDialog, asyncC
 import { useVuelidate } from '@vuelidate/core';
 import { required, maxLength, minLength, helpers } from '@vuelidate/validators';
 import { apiCall, useConfirm, useGeneralToaster, useVuelidateWrapper, useWait } from '@vnuge/vnlib.browser';
-import { clone, cloneDeep, join, defaultTo, every, filter, includes, isEmpty, isEqual, first, isString, chunk, map, forEach } from 'lodash-es';
+import { clone, cloneDeep, join, defaultTo, every, filter, includes, isEmpty, isEqual, first, isString, chunk, map, forEach, isNil } from 'lodash-es';
 import { Menu, MenuButton, MenuItems, MenuItem } from '@headlessui/vue'
 import { parseNetscapeBookmarkString } from './Boomarks/util.ts';
-import type { Bookmark, BookmarkError } from '../store/bookmarks';
+import type { BatchUploadResult, Bookmark, BookmarkError } from '../store/bookmarks';
 import AddOrUpdateForm from './Boomarks/AddOrUpdateForm.vue';
 const Dialog = defineAsyncComponent(() => import('./global/Dialog.vue'));
 
@@ -27,7 +27,7 @@ const { copy } = useClipboard()
 //Refresh on page load
 store.bookmarks.refresh();
 
-const safeNameRegex = /^[a-zA-Z0-9_\-\|\. ]*$/;
+const safeNameRegex = /^[a-zA-Z0-9_\-\|\., ]*$/;
 const safeUrlRegex = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/;
 const safeTagRegex = /^[a-zA-Z0-9-_]*$/;
 
@@ -38,19 +38,19 @@ const addOrEditValidator = (buffer: Ref<Partial<Bookmark>>) => {
             required: helpers.withMessage('Name cannot be empty', required),
             safeName: helpers.withMessage('Bookmark name contains illegal characters', (value: string) => safeNameRegex.test(value)),
             minLength: helpers.withMessage('Name must be at least 1 characters', minLength(1)),
-            maxLength: helpers.withMessage('Name must have less than 100 characters', maxLength(100))
+            maxLength: helpers.withMessage('Name must have less than 200 characters', maxLength(200))
         },
         Url: {
             required: helpers.withMessage('Url cannot be empty', required),
             safeUrl: helpers.withMessage('Url contains illegal characters or is not a valid URL', (value: string) => safeUrlRegex.test(value)),
             minLength: helpers.withMessage('Url must be at least 1 characters', minLength(1)),
-            maxLength: helpers.withMessage('Url must have less than 200 characters', maxLength(200))
+            maxLength: helpers.withMessage('Url must have less than 300 characters', maxLength(300))
         },
         Description: {
-            maxLength: helpers.withMessage('Description must have less than 512 characters', maxLength(512))
+            maxLength: helpers.withMessage('Description must have less than 500 characters', maxLength(500))
         },
         Tags: {
-            maxLength: helpers.withMessage('Tags must have less than 32 characters', (tags: string[]) => every(tags, tag => tag.length < 32)),
+            maxLength: helpers.withMessage('Tags must have less than 64 characters', (tags: string[]) => every(tags, tag => tag.length < 64)),
             safeTag: helpers.withMessage('Tags contains illegal characters', (tags: string[]) => every(tags, tag => safeTagRegex.test(tag)))
         }
     }));
@@ -99,6 +99,7 @@ const bmDelete = async (bookmark: Bookmark) => {
 
 const isTagSelected = (tag: string, currentTags: MaybeRef<string[]>) => includes(get(currentTags), tag);
 const execSearch = () => store.bookmarks.query = get(localSearch);
+const clearTags = () => store.bookmarks.tags = [];
 const percentToWith = (percent: number) => ({ width: `${percent}%` });
 const printErroMessage = (error: BookmarkError) => {
    const errorMessages = map(error.errors, e=> e.message);
@@ -262,22 +263,39 @@ const upload = (() => {
             const bms = get(foundBookmarks);
 
             if(get(fixErrors)){
-                //try to fix names
-                forEach(bms, bm => {
-                    //If the name is not safe, replace all illegal characters
-                    if(!safeNameRegex.test(bm.Name)){
-                        bm.Name = bm.Name.replace(/[^a-zA-Z0-9_\-\|\. ]/g, ' ');
-                    }
-                })
 
                 //truncate name length
                 forEach(bms, bm => {
                     if(bm.Name.length > 100){
-                        bm.Name = bm.Name.substring(0, 100);
+                        bm.Name = bm.Name.substring(0, 199);
+                    }
+
+                    //Replace illegal characters from name strings
+                    bm.Name = bm.Name.replace(/[^a-zA-Z0-9_\-\|\., ]/g, ' ');
+
+                    if(!isNil(bm.Description)){
+                        //truncate description
+                        if (bm.Description.length > 500) {
+                            bm.Description = bm.Description.substring(0, 499);
+                        }
+
+                        bm.Description = bm.Description.replace(/[^\x00-\x7F]/g, '');   //only allow utf-8 characters
                     }
+
+                    //Try to remove illegal chars from tags
+                    bm.Tags = map(bm.Tags, tag => tag.replace(/[^a-zA-Z0-9\-]/g, ''));
                 })
             }
 
+            forEach(bms, bm => {
+                //Remove any empty tags
+                bm.Tags = filter(bm.Tags, tag => tag?.length > 0);
+
+                if(isEmpty(bm.Tags)){
+                    (bm.Tags as any) = null;
+                }
+            })
+
             const chunks = chunk(bms, 20);
 
             for(let i = 0; i < chunks.length; i++){
@@ -290,9 +308,18 @@ const upload = (() => {
 
                 //See if an error occured
                 if(!isString(result) && 'invalid' in result){
+                    const { message, invalid } = result as BatchUploadResult;
+
                     //add errors to the error list
-                    errors.value.push(...result.invalid);
+                    errors.value.push(...invalid);
                     isError = true;
+                    
+                   if(message){
+                        toaster.error({
+                            title: `Batch ${i} upload failed due to an error`,
+                            text: message
+                        })
+                   }
                 }
 
                 if(isError){
@@ -382,14 +409,14 @@ const upload = (() => {
                         <MenuItems class="absolute z-10 bg-white divide-y divide-gray-100 rounded-b shadow right-2 lg:left-0 min-w-32 lg:end-0 dark:bg-gray-700">
                             <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
                                 <!-- Use the `active` state to conditionally style the active item. -->
-                                <MenuItem as="template" v-slot="{ active }">
+                                <MenuItem as="template" v-slot="{  }">
                                     <li>
                                         <button @click="add.open()" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
                                             Manual
                                         </button>
                                     </li>
                                 </MenuItem>
-                                <MenuItem as="template" v-slot="{ active }">
+                                <MenuItem as="template" v-slot="{  }">
                                     <li>
                                         <button @click="upload.open()" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
                                             Upload html
@@ -402,7 +429,7 @@ const upload = (() => {
                 </Menu>
             </div>
         </div>
-        <div class="grid flex-auto grid-cols-4 gap-8 mt-4 max-w-[60rem] mx-auto w-full">
+        <div class="grid flex-auto grid-cols-4 gap-8 sm:mt-4 max-w-[60rem] mx-auto w-full">
                 
             <div class="col-span-4 lg:col-span-3">
 
@@ -414,7 +441,7 @@ const upload = (() => {
                     <span class="sr-only">Loading...</span>
                 </div>
 
-                <div class="mx-auto mt-2">
+                <div class="mx-auto sm:mt-2">
                     <div class="grid h-full grid-cols-1 gap-1 leading-tight md:leading-normal">
                         
                         <div v-for="bm in bookmarks" :key="bm.Id" :id="join(['bm', bm.Id], '-')" class="w-full p-1">
@@ -476,7 +503,15 @@ const upload = (() => {
                 </div>
             </div>
             <div class="hidden lg:block">
-                <div class="mt-10">
+                <div class="h-10">
+                    <div class="ml-12">
+                        <button :disabled="isEmpty(selectedTags)" @click="clearTags()" 
+                        class="text-sm font-bold text-gray-600 duration-75 ease-linear disabled:opacity-0 hover:underline">
+                            Clear Tags
+                        </button>
+                    </div>
+                </div>
+                <div class="mt-1">
                     <ul class="grid grid-cols-2">
                         <li v-for="tag in tags" :key="tag" class="text-sm">
                             <span
diff --git a/front-end/src/components/Login.vue b/front-end/src/components/Login.vue
index eeda1ba..3022940 100644
--- a/front-end/src/components/Login.vue
+++ b/front-end/src/components/Login.vue
@@ -1,15 +1,19 @@
 <script setup lang="ts">
+import { computed, defineAsyncComponent } from 'vue'
 import { apiCall, useWait } from '@vnuge/vnlib.browser'
 import { storeToRefs } from 'pinia'
 import { useStore } from '../store'
 import { TabGroup, TabList, Tab, TabPanels, TabPanel } from '@headlessui/vue'
 import UserPass from './Login/UserPass.vue'
 import PkiLogin from './Login/PkiLogin.vue'
+const AdminReg = defineAsyncComponent(() => import('./Login/AdminReg.vue'))
 
 const { waiting } = useWait();
 const store = useStore();
 const { loggedIn, siteTitle } = storeToRefs(store);
 
+const adminRegEnabled = computed(() => store.registation.status?.enabled && store.registation.status?.setup_mode);
+
 const logout = () => {
     apiCall(async () => {
         const { logout } = await store.socialOauth()
@@ -20,7 +24,7 @@ const logout = () => {
 </script>
 <template>
      <section id="login-page" class="flex-auto">
-        <div class="flex flex-col items-center justify-center px-6 py-8 mx-auto lg:py-24">
+        <div class="flex flex-col items-center justify-center px-2 py-8 mx-auto sm:px-6 lg:py-24">
             <div class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
                 <span class="p-2 mr-2 bg-blue-500 rounded-full">
                     <svg class="w-5 h-5 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 14 20">
@@ -35,11 +39,19 @@ const logout = () => {
                     <div v-if="!loggedIn">
                         <!-- password/username login -->
                         <h1 class="text-xl font-bold leading-tight tracking-tight text-center text-gray-900 md:text-2xl dark:text-white">
-                            Sign in to your account
+                            {{ adminRegEnabled ? "Create admin account" : "Sign in to your account" }}
                         </h1>
             
-                        <TabGroup class="w-full" as="div">
+                        <TabGroup class="w-full" as="div">                           
                             <TabList as="ul" class="flex flex-wrap justify-center -mb-px text-sm font-medium text-center text-gray-500 dark:text-gray-400">
+                                 <Tab v-if="adminRegEnabled" as="template" v-slot="{ selected }" class="cursor-pointer me-2">
+                                    <div class="tab group" :class="{ selected }">
+                                        <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
+                                        <path d="M10 0a10 10 0 1 0 10 10A10.011 10.011 0 0 0 10 0Zm0 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm0 13a8.949 8.949 0 0 1-4.951-1.488A3.987 3.987 0 0 1 9 13h2a3.987 3.987 0 0 1 3.951 3.512A8.949 8.949 0 0 1 10 18Z"/>
+                                        </svg>
+                                        Create
+                                    </div>
+                                </Tab>
                                 <Tab as="template" v-slot="{ selected }" class="cursor-pointer me-2">
                                     <div class="tab group" :class="{ selected }">
                                         <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
@@ -58,6 +70,9 @@ const logout = () => {
                                 </Tab>
                             </TabList>
                             <TabPanels class="mt-4" as="div">
+                                <TabPanel v-if="adminRegEnabled" :unmount="false">
+                                    <AdminReg />
+                                </TabPanel>
                                 <TabPanel :unmount="false">
                                     <UserPass />
                                 </TabPanel>
diff --git a/front-end/src/components/Login/AdminReg.vue b/front-end/src/components/Login/AdminReg.vue
new file mode 100644
index 0000000..8546512
--- /dev/null
+++ b/front-end/src/components/Login/AdminReg.vue
@@ -0,0 +1,84 @@
+<script setup lang="ts">
+import { reactive, computed } from 'vue'
+import { useVuelidate } from '@vuelidate/core'
+import { required, maxLength, minLength, email, helpers } from '@vuelidate/validators'
+import { useVuelidateWrapper, apiCall, useWait } from '@vnuge/vnlib.browser'
+import { useStore } from '../../store'
+
+const { waiting } = useWait();
+const store = useStore();
+
+const vState = reactive({ username: '', password: '', repeat: ''})
+
+const rules = computed(() =>({
+    username: {
+        required: helpers.withMessage('Email cannot be empty', required),
+        email: helpers.withMessage('Your email address is not valid', email),
+        maxLength: helpers.withMessage('Email address must be less than 50 characters', maxLength(50))
+    },
+    password: {
+        required: helpers.withMessage('Password cannot be empty', required),
+        minLength: helpers.withMessage('Password must be at least 8 characters', minLength(8)),
+        maxLength: helpers.withMessage('Password must have less than 128 characters', maxLength(128))
+    },
+    repeat:{
+        required: helpers.withMessage('Password cannot be empty', required),
+        minLength: helpers.withMessage('Password must be at least 8 characters', minLength(8)),
+        maxLength: helpers.withMessage('Password must have less than 128 characters', maxLength(128)),
+        match: helpers.withMessage('Passwords must match', (value: string) => value === vState.password)
+    }
+}));
+
+const v$ = useVuelidate(rules, vState)
+const { validate } = useVuelidateWrapper(v$ as any);
+
+const onSubmit = async () => {
+
+    // If the form is not valid set the error message
+    if (!await validate()) {
+        return
+    }
+
+    // Run login in an apicall wrapper
+    await apiCall(async ({ toaster }) => {
+
+        const res = await store.registation.api.registerAdmin(
+            v$.value.username.$model,
+            v$.value.password.$model
+        );
+
+        const message = res.getResultOrThrow();
+
+        toaster.general.success({
+            title: 'Success!',
+            text: message
+        })
+    })
+}
+</script>
+
+<template>
+    <form class="space-y-4 md:space-y-6" id="admin-registation" action="#" @submit.prevent="onSubmit" :disabled="waiting">
+        <fieldset>
+            <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Email</label>
+            <input type="email" name="email" id="email" class="input" placeholder="name@company.com" required
+                v-model="v$.username.$model">
+        </fieldset>
+        <fieldset>
+            <label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Password</label>
+            <input type="password" name="password" id="password" class="input" placeholder="••••••••" required
+                v-model="v$.password.$model">
+        </fieldset>
+        <fieldset>
+            <label for="repeat-password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Repeat Password</label>
+            <input type="password" name="repeat-password" id="repeat-password" class="input" placeholder="••••••••" required
+                v-model="v$.repeat.$model">
+        </fieldset>
+        <button form="admin-registation" type="submit" class="btn">Register</button>
+    </form>
+    <p class="py-4 text-sm text-red-500">
+        This tab is only visible when the server is in setup mode. You can create as many admin accounts as you like now. 
+    </p>
+</template>
+
+<style scoped lang="scss"></style>
\ No newline at end of file
diff --git a/front-end/src/components/Login/UserPass.vue b/front-end/src/components/Login/UserPass.vue
index 9d72d08..c47e594 100644
--- a/front-end/src/components/Login/UserPass.vue
+++ b/front-end/src/components/Login/UserPass.vue
@@ -99,7 +99,7 @@ const onSubmit = async () => {
     </form>
     <form v-else class="space-y-4 md:space-y-6" action="#" @submit.prevent="onSubmit" :disabled="waiting">
         <fieldset>
-            <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your email</label>
+            <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Email</label>
             <input type="email" name="email" id="email" class="input" placeholder="name@company.com" required
                 v-model="v$.username.$model"
             >
diff --git a/front-end/src/components/Registation.vue b/front-end/src/components/Registation.vue
new file mode 100644
index 0000000..56508e8
--- /dev/null
+++ b/front-end/src/components/Registation.vue
@@ -0,0 +1,137 @@
+<script setup lang="ts">
+import { apiCall, useWait } from '@vnuge/vnlib.browser'
+import { storeToRefs } from 'pinia'
+import { useQuery, useStore } from '../store'
+import { computed, ref, watch } from 'vue';
+import { get } from '@vueuse/core';
+import { delay, isEmpty, noop } from 'lodash-es';
+import { decodeJwt } from 'jose';
+
+const { waiting } = useWait();
+const store = useStore();
+const { siteTitle } = storeToRefs(store)
+
+const enabled = computed(() => store.registation.status?.enabled === true);
+
+const password = ref();
+const repeatPassword = ref();
+const token = useQuery("token")
+
+const tVals = computed(() => {
+    try{
+        const { sub, level, exp } = decodeJwt<{level:number, sub:string, exp:number}>(get(token)!)
+        const isPrilageed = (level & ( 1 << 0x08)) !== 0;
+        const isExpired = exp < Date.now() / 1000;
+        return { email: sub,  isPrilageed , isExpired }
+    }
+    catch{
+        return { email: '', isPrilageed: false, isExpired: true }
+    }
+})
+
+const onSubmit = () =>{
+
+    const passwrd = get(password);
+    if(isEmpty(passwrd)){
+        return;
+    }
+
+    apiCall(async ({ toaster }) => {
+        const result = await store.registation.api.completeRegistation(get(token)!, passwrd)
+        const message = result.getResultOrThrow();
+
+        toaster.general.success({
+            title:'Completed!',
+            text: message
+        })
+
+        //redirect to login page on success
+        delay(() => {
+            //Clear token value
+            window.location.assign('/')
+        } , 1000)
+    });
+}
+
+//If token or enabled changes and both are true, reload and clear all arguments
+watch([enabled, token], ([en, t]) => (en && t) ? noop() : window.location.assign('/'))
+
+</script>
+<template>
+    <section id="reg-page" class="flex-auto">
+        <div class="flex flex-col items-center justify-center px-6 py-8 mx-auto lg:py-24">
+            <div class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
+                <span class="p-2 mr-2 bg-blue-500 rounded-full">
+                    <svg class="w-5 h-5 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+                        fill="currentColor" viewBox="0 0 14 20">
+                        <path
+                            d="M13 20a1 1 0 0 1-.64-.231L7 15.3l-5.36 4.469A1 1 0 0 1 0 19V2a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v17a1 1 0 0 1-1 1Z" />
+                    </svg>
+                </span>
+                <span class="self-center font-semibold whitespace-nowrap">{{ siteTitle }}</span>
+            </div>
+            <div
+                class="w-full bg-white rounded shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
+                <div class="p-6 space-y-4 md:space-y-6 sm:p-8">
+
+                     <!-- password/username login -->
+                    <h1
+                        class="text-xl font-bold leading-tight tracking-tight text-center text-gray-900 md:text-2xl dark:text-white">
+                        Sign up
+                    </h1>
+
+                    <div class="" v-if="tVals.isExpired">
+                        <p class="py-4 text-lg text-center text-red-500 dark:text-red-400">
+                            Your sign up link has expired
+                        </p>
+                        <div class="mt-4">
+                            <a href="/">
+                                <button class="w-full btn blue">Go back</button>
+                            </a>
+                        </div>
+                    </div>
+
+                    <form v-else class="space-y-4 md:space-y-6" action="#" @submit.prevent="onSubmit" :disabled="waiting">
+                        <fieldset>
+                            <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your email</label>
+                            <input type="email" name="email" id="email" class="input" placeholder="" disabled
+                                :value="tVals.email"
+                            >
+                        </fieldset>
+                        <fieldset>
+                            <label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Password</label>
+                            <input type="password" name="password" id="password" class="input" placeholder="••••••••" required
+                                v-model="password"
+                            >
+                        </fieldset>
+                        <fieldset>
+                            <label for="repeat-password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Repeat Password</label>
+                            <input type="password" name="repeat-password" id="repeat-password" class="input" placeholder="••••••••" required
+                                v-model="repeatPassword"
+                            >
+                        </fieldset>
+                        <fieldset>
+                            <div class="flex items-center">
+                                <input disabled id="disabled-checked-checkbox" type="checkbox" :value="tVals.isPrilageed" 
+                                class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                                <label for="disabled-checked-checkbox" class="text-sm font-medium text-gray-400 ms-2 dark:text-gray-500">
+                                    Can add users
+                                </label>
+                            </div>
+                        </fieldset>
+                        <button type="submit" class="btn">Submit</button>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </section>
+</template>
+
+<style lang="scss">
+#reg-page {
+
+    button[type="submit"] {
+        @apply w-full focus:ring-4 focus:outline-none font-medium rounded text-sm px-5 py-2.5 text-center;
+        @apply text-white bg-blue-600 hover:bg-blue-700 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800;
+    }
+}</style>
\ No newline at end of file
diff --git a/front-end/src/components/Settings.vue b/front-end/src/components/Settings.vue
index 720c556..83d3f79 100644
--- a/front-end/src/components/Settings.vue
+++ b/front-end/src/components/Settings.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import { useDark } from '@vueuse/core';
 import { useStore } from '../store';
+import { defineAsyncComponent } from 'vue';
 import Oauth2Apps from './Settings/Oauth2Apps.vue';
 import PasswordReset from './Settings/PasswordReset.vue';
 import PkiSettings from './Settings/PkiSettings.vue';
 import TotpSettings from './Settings/TotpSettings.vue';
 import Bookmarks from './Settings/Bookmarks.vue';
+const Registation = defineAsyncComponent(() => import('./Settings/Registation.vue'));
 
 const store = useStore();
 const darkMode = useDark();
@@ -39,7 +41,7 @@ const darkMode = useDark();
                 </div>
             </div>
 
-             <div class="">
+            <div class="">
                 <h3 class="text-xl font-bold">Boomarks</h3>
 
                 <div class="relative mt-4">
@@ -61,7 +63,11 @@ const darkMode = useDark();
 
             <!-- Only load component if oauth2 plugin is enabled -->
             <div v-if="store.oauth2" class="">
-                  <Oauth2Apps />
+                <Oauth2Apps />
+            </div>
+
+            <div v-if="store.registation.status?.can_invite" class="mb-10">
+                <Registation />
             </div>
 
         </div>
diff --git a/front-end/src/components/Settings/Bookmarks.vue b/front-end/src/components/Settings/Bookmarks.vue
index 7f73921..a4ab55a 100644
--- a/front-end/src/components/Settings/Bookmarks.vue
+++ b/front-end/src/components/Settings/Bookmarks.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { apiCall, useWait } from '@vnuge/vnlib.browser';
-import { useStore, type DownloadContentType } from '../../store';
+import { useStore, type DownloadContentType, TabId } from '../../store';
 import { ref } from 'vue';
 import { Menu, MenuButton, MenuItems, MenuItem } from '@headlessui/vue'
 
@@ -36,52 +36,83 @@ const downloadBookmarks = (contentType: DownloadContentType) => {
     });
 }
 
+const bookmarkHref = `
+javascript: (function() {
+  const bookmarkUrl = window.location; 
+  let applicationUrl = '${window.location.origin}';
+  applicationUrl += '?tab=${TabId.Bookmarks}&url=' + encodeURIComponent(bookmarkUrl); 
+  applicationUrl += '&title='+document.title;
+  window.open(applicationUrl);
+})();`
+
 </script>
 <template>
-      <div class="relative w-fit">
+    <div class="flex flex-col gap-4">
+        <div class="flex-row hidden gap-2 sm:flex">
+            <div class="">
+                <a :href="bookmarkHref" @click.prevent="" class="text-sm cursor-move btn light">
+                    <span class="whitespace-nowrap">
+                        Add Bookmark 📎
+                    </span>
+                </a>
+            </div>
+            <p class="p-0.5 my-auto text-sm flex flex-row">
+                <span class="">
+                    <svg class="w-6 h-5 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h14M5 12l4-4m-4 4 4 4"/>
+                    </svg>
+                </span>
+                <span>
+                    Drag this button to your bookmarks bar to quickly add a new bookmark
+                </span>
+            </p>
+        </div>
+        <div class="relative ml-auto sm:ml-0 w-fit">
             <Menu>
-            <MenuButton :disabled="waiting" class="flex items-center gap-3 btn light">
-                <div class="hidden lg:inline">Download</div>
-                <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none">
-                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 13V4M7 14H5a1 1 0 0 0-1 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4c0-.6-.4-1-1-1h-2m-1-5-4 5-4-5m9 8h0"/>
-                </svg>
-            </MenuButton>
-                <transition
-                enter-active-class="transition duration-100 ease-out"
-                enter-from-class="transform scale-95 opacity-0"
-                enter-to-class="transform scale-100 opacity-100"
-                leave-active-class="transition duration-75 ease-out"
-                leave-from-class="transform scale-100 opacity-100"
-                leave-to-class="transform scale-95 opacity-0"
-            >
-                <MenuItems class="absolute z-10 bg-white divide-y divide-gray-100 rounded-b shadow right-2 lg:left-0 min-w-32 lg:end-0 dark:bg-gray-700">
-                    <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
-                        <!-- Use the `active` state to conditionally style the active item. -->
-                        <MenuItem as="template" v-slot="{ }">
-                            <li>
-                                <button @click="downloadBookmarks('text/html')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
-                                    HTML
-                                </button>
-                            </li>
-                        </MenuItem>
-                        <MenuItem as="template" v-slot="{ }">
-                            <li>
-                                <button @click="downloadBookmarks('text/csv')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
-                                    CSV
-                                </button>
-                            </li>
-                        </MenuItem>
-                          <MenuItem as="template" v-slot="{ }">
-                            <li>
-                                <button @click="downloadBookmarks('application/json')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
-                                    JSON
-                                </button>
-                            </li>
-                        </MenuItem>
-                    </ul>
-                </MenuItems>
-            </transition>
-        </Menu>
+                <MenuButton :disabled="waiting" class="flex items-center gap-3 btn light">
+                    <div class="hidden lg:inline">Download</div>
+                    <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none">
+                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 13V4M7 14H5a1 1 0 0 0-1 1v4c0 .6.4 1 1 1h14c.6 0 1-.4 1-1v-4c0-.6-.4-1-1-1h-2m-1-5-4 5-4-5m9 8h0"/>
+                    </svg>
+                </MenuButton>
+                    <transition
+                    enter-active-class="transition duration-100 ease-out"
+                    enter-from-class="transform scale-95 opacity-0"
+                    enter-to-class="transform scale-100 opacity-100"
+                    leave-active-class="transition duration-75 ease-out"
+                    leave-from-class="transform scale-100 opacity-100"
+                    leave-to-class="transform scale-95 opacity-0"
+                >
+                    <MenuItems class="absolute z-10 bg-white divide-y divide-gray-100 rounded-b shadow right-2 lg:left-0 min-w-32 lg:end-0 dark:bg-gray-700">
+                        <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
+                            <!-- Use the `active` state to conditionally style the active item. -->
+                            <MenuItem as="template" v-slot="{ }">
+                                <li>
+                                    <button @click="downloadBookmarks('text/html')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
+                                        HTML
+                                    </button>
+                                </li>
+                            </MenuItem>
+                            <MenuItem as="template" v-slot="{ }">
+                                <li>
+                                    <button @click="downloadBookmarks('text/csv')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
+                                        CSV
+                                    </button>
+                                </li>
+                            </MenuItem>
+                              <MenuItem as="template" v-slot="{ }">
+                                <li>
+                                    <button @click="downloadBookmarks('application/json')" class="block w-full px-4 py-2 text-left hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
+                                        JSON
+                                    </button>
+                                </li>
+                            </MenuItem>
+                        </ul>
+                    </MenuItems>
+                </transition>
+            </Menu>
+        </div>
     </div>
+    
     <a ref="downloadAnchor" class="hidden"></a>
 </template>
\ No newline at end of file
diff --git a/front-end/src/components/Settings/Registation.vue b/front-end/src/components/Settings/Registation.vue
new file mode 100644
index 0000000..a0f208e
--- /dev/null
+++ b/front-end/src/components/Settings/Registation.vue
@@ -0,0 +1,130 @@
+<script setup lang="ts">
+import { computed, defineAsyncComponent, ref, shallowReactive, shallowRef } from 'vue';
+import { useStore } from '../../store';
+import { get, set, useClipboard, useTimeAgo, useToggle } from '@vueuse/core';
+import { apiCall, useVuelidateWrapper } from '@vnuge/vnlib.browser';
+import { defaultTo } from 'lodash-es';
+import { useVuelidate } from '@vuelidate/core'
+import { required, maxLength, minLength, helpers, email } from '@vuelidate/validators'
+const Dialog = defineAsyncComponent(() => import('../global/Dialog.vue'));
+
+const store = useStore();
+const { copy, copied } = useClipboard()
+
+const [isOpen, toggleOpen] = useToggle(false)
+const vState = shallowReactive({ email: '' })
+
+const canInvite = ref<boolean>(false)
+const inviteLink = shallowRef<string | undefined>()
+
+const expirationDate = computed(() => Date.now() + (1000 * defaultTo(store.registation.status?.link_expiration, 0)))
+const fromNowTime = useTimeAgo(expirationDate)
+
+const rules = computed(() => {
+    return {
+        email: { 
+            required: helpers.withMessage('Email is required', required), 
+            maxLength: helpers.withMessage('Email must be less than 255 characters', maxLength(255)),
+            minLength: helpers.withMessage('Email must be at least 3 characters', minLength(3)),
+            email: helpers.withMessage('Email must be a valid email', email)
+        },
+    }
+})
+
+const v$ = useVuelidate(rules, vState)
+const { validate } = useVuelidateWrapper(v$ as any)
+
+const onSubmit = async () => {
+    if (!await validate()) return
+
+    apiCall(async () => {
+        //Rest password and pass totp code
+        const { link } = await store.registation.api.createSignupLink(vState.email, get(canInvite))
+        set(inviteLink, link)
+    })
+}
+
+const onCancel = () => {
+    vState.email = ''
+    v$.value.$reset()
+    set(canInvite, false)
+    set(inviteLink, undefined)
+    toggleOpen(false)
+}
+
+</script>
+
+<template>
+    <div class="">
+
+        <div class="flex flex-row justify-between w-full">
+            <h3 class="text-xl font-bold">Registation</h3>
+
+            <div class="flex flex-row justify-end">
+                <button class="btn blue" @click="toggleOpen(true)">Invite User</button>
+            </div>
+        </div>
+        <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">
+            Create a one-time invite link you can send to add a new user to your server.
+        </p>
+        <p class="text-sm text-gray-500 dark:text-gray-400">
+            Links expire <span class="text-blue-500">{{ fromNowTime }}</span>
+        </p>
+        <Dialog :open="isOpen" title="Invite User" @cancel="onCancel">
+            <template #body>
+                <div class="p-4">
+
+                    <div v-if="inviteLink" class="">
+                         <p class="my-2 text-lg font-medium text-center text-gray-900 dark:text-white">
+                            Link expires {{ fromNowTime }}
+                        </p>
+
+                        <label for="invite-link" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
+                            Invite link
+                        </label>
+                        <input 
+                            :value="inviteLink" 
+                            type="url" 
+                            id="invite-link" 
+                            class="input"
+                            readonly
+                        >
+
+                        <div class="mt-4 ml-auto w-fit">
+                            <button @click="copy(inviteLink)" type="submit" :disabled="copied" class="btn blue">
+                                {{ copied ? 'Copied!' : 'Copy' }}
+                            </button>
+                        </div>
+
+                    </div>
+
+                    <form v-else @submit.prevent="onSubmit">
+
+                        <fieldset class="mb-4">
+                            <label for="user-email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Email address</label>
+                            <input v-model="v$.email.$model" type="email" id="user-email" class="input"
+                                :class="{ 'error': v$.email.$error, 'dirty': v$.email.$dirty }" 
+                                placeholder="user@simplebookmark.com"
+                                required
+                            >
+                        </fieldset>
+
+                        <fieldset class="px-2">
+                            <h4 class="font-bold text-gray-700 dark:text-white">Permissions</h4>
+                            <div class="flex items-center mt-2 mb-4">
+                                <input id="can-invite-input" type="checkbox" v-model="canInvite" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
+                                <label for="can-invite-input" class="text-sm font-medium text-gray-900 ms-2 dark:text-gray-300">Can invite users</label>
+                            </div>
+                        </fieldset>
+
+                        <div class="ml-auto w-fit">
+                            <button type="submit" class="btn blue">
+                                Create Link
+                            </button>
+                        </div>
+                    </form>
+                </div>
+            </template>
+        </Dialog>
+    </div>
+</template>
\ No newline at end of file
diff --git a/front-end/src/components/global/ConfirmPrompt.vue b/front-end/src/components/global/ConfirmPrompt.vue
index 24d3b9c..8cc9920 100644
--- a/front-end/src/components/global/ConfirmPrompt.vue
+++ b/front-end/src/components/global/ConfirmPrompt.vue
@@ -33,7 +33,7 @@ onReveal(m => message.value = defaultTo(m, {}));
             </p>
         </div>
         <!-- Modal footer -->
-        <div class="flex items-center justify-end p-4 border-t border-gray-200 rounded-b md:p-5 dark:border-gray-600">
+        <div class="flex items-center justify-end gap-2 p-4 border-t border-gray-200 rounded-b md:p-5 dark:border-gray-600">
             <button 
             @click="confirm()" 
             type="button"
diff --git a/front-end/src/components/global/Dialog.vue b/front-end/src/components/global/Dialog.vue
index a27d5ee..65d9165 100644
--- a/front-end/src/components/global/Dialog.vue
+++ b/front-end/src/components/global/Dialog.vue
@@ -19,10 +19,10 @@ onClickOutside(dialog, () => get(open) ? cancel() : noop())
 <template>
     <!-- Main modal -->
     <Dialog :open="open" id="static-modal" data-modal-backdrop="static" tabindex="-1"
-        class="overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-10 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
+        class="overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-20 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
         <div class="fixed inset-0 bg-black/30" aria-hidden="true" />
 
-        <div class="relative w-full max-w-xl max-h-full p-4 mx-auto mt-2 md:mt-32">
+        <div class="relative w-full max-w-xl max-h-full p-4 mx-auto mt-[8rem] md:mt-32">
             <!-- Modal content -->
             <div class="relative bg-white rounded shadow dark:bg-gray-700" ref="dialog">
                 <!-- Modal header -->
diff --git a/front-end/src/components/global/PasswordPrompt.vue b/front-end/src/components/global/PasswordPrompt.vue
index 50024fb..e0dc349 100644
--- a/front-end/src/components/global/PasswordPrompt.vue
+++ b/front-end/src/components/global/PasswordPrompt.vue
@@ -86,7 +86,7 @@ onReveal(m => message.value = defaultTo(m, {}));
             </form> 
         </div>
         <!-- Modal footer -->
-        <div class="flex items-center justify-end p-4 border-t border-gray-200 rounded-b md:p-5 dark:border-gray-600">
+        <div class="flex items-center justify-end gap-2 p-4 border-t border-gray-200 rounded-b md:p-5 dark:border-gray-600">
             <button 
              @click="formSubmitted" 
              type="button"
diff --git a/front-end/src/main.ts b/front-end/src/main.ts
index 30c3f10..c5be406 100644
--- a/front-end/src/main.ts
+++ b/front-end/src/main.ts
@@ -29,6 +29,7 @@ import { profilePlugin } from './store/userProfile'
 import { mfaSettingsPlugin } from './store/mfaSettingsPlugin'
 import { socialMfaPlugin } from './store/socialMfaPlugin'
 import { bookmarkPlugin } from './store/bookmarks'
+import { registationPlugin } from './store/registation';
 
 //Setup the vnlib api
 configureApi({
@@ -69,6 +70,7 @@ store.use(profilePlugin('/account/profile'))
     .use(socialMfaPlugin())
     //Add the oauth2 apps plugin
     .use(bookmarkPlugin('/bookmarks'))
+    .use(registationPlugin('/register'))
     //Setup oauth apps plugin (disabled for now)
     //.use(oauth2AppsPlugin('/oauth/apps', '/oauth/scopes'))
 
diff --git a/front-end/src/store/bookmarks.ts b/front-end/src/store/bookmarks.ts
index 76cc5b9..2af8344 100644
--- a/front-end/src/store/bookmarks.ts
+++ b/front-end/src/store/bookmarks.ts
@@ -33,6 +33,7 @@ export interface Bookmark{
 
 export interface BatchUploadResult{
     readonly invalid: BookmarkError[]
+    readonly message?: string
 }
 
 export interface BookmarkError{
diff --git a/front-end/src/store/index.ts b/front-end/src/store/index.ts
index bcd79ad..09c5a2d 100644
--- a/front-end/src/store/index.ts
+++ b/front-end/src/store/index.ts
@@ -15,7 +15,7 @@
 
 import { useSession, useAutoHeartbeat } from "@vnuge/vnlib.browser";
 import { toRefs, set, watchDebounced, useLocalStorage } from "@vueuse/core";
-import { noop, toSafeInteger, toString, defaults } from "lodash-es";
+import { toSafeInteger, toString, defaults } from "lodash-es";
 import { defineStore } from "pinia";
 import { computed, shallowRef, watch } from "vue";
 
@@ -53,7 +53,8 @@ export enum TabId{
     Bookmarks,
     Profile,
     Settings,
-    Login
+    Login,
+    Register
 }
 
 /**
@@ -80,7 +81,13 @@ export const useStore = defineStore('main', () => {
     })
 
     //If not logged in, redirect to login tab
-    watch(loggedIn, (loggedIn) => loggedIn ? noop() : set(activeTab, TabId.Login), { immediate: true })
+    watch(loggedIn, (li) =>{
+        if (li || activeTab.value == TabId.Register){
+            return;
+        }
+
+        set(activeTab, TabId.Login);
+    }, { immediate: true })
 
     //Setup heartbeat for 5 minutes
     useAutoHeartbeat(shallowRef(5 * 60 * 1000), autoHeartbeat)
diff --git a/front-end/src/store/registation.ts b/front-end/src/store/registation.ts
new file mode 100644
index 0000000..b07e3e2
--- /dev/null
+++ b/front-end/src/store/registation.ts
@@ -0,0 +1,110 @@
+// Copyright (C) 2024 Vaughn Nugent
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as
+// published by the Free Software Foundation, either version 3 of the
+// License, or (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+import 'pinia'
+import { MaybeRef, shallowRef, watch } from 'vue';
+import { WebMessage, useAxios } from '@vnuge/vnlib.browser';
+import { get } from '@vueuse/core';
+import { PiniaPluginContext, PiniaPlugin, storeToRefs } from 'pinia'
+import { defer } from 'lodash-es';
+import { TabId } from '.';
+
+export interface SignupToken {
+    readonly link: string
+}
+
+export interface RegistationStatus{
+    readonly setup_mode: boolean
+    readonly enabled: boolean
+    readonly can_invite: boolean
+    readonly link_expiration: number
+}
+
+export interface UserRegistationApi {
+    createSignupLink(username: string, canAddUsers: boolean): Promise<SignupToken>
+    getStatus(): Promise<RegistationStatus>
+    registerAdmin(username: string, password: string): Promise<WebMessage<string>>
+    completeRegistation(token: string, password: string): Promise<WebMessage<string>>
+}
+
+declare module 'pinia' {
+    export interface PiniaCustomProperties {
+       registation:{
+            api: UserRegistationApi
+            status: RegistationStatus | undefined
+       }
+    }
+}
+
+
+const useRegApi = (endpoint: MaybeRef<string>): UserRegistationApi => {
+
+    const axios = useAxios(null);
+
+    const createSignupLink = async (username: string, hasAddPerms: boolean): Promise<SignupToken> => {
+        const { data } = await axios.put<WebMessage<string>>(get(endpoint), { 
+            username, 
+            can_add_users:hasAddPerms 
+        })
+
+        const token = data.getResultOrThrow();
+
+        return { link: `${window.location.origin}?tab=${TabId.Register}&token=${token}` }
+    }
+
+    const getStatus = async (): Promise<RegistationStatus> => {
+        const { data } = await axios.get<WebMessage<RegistationStatus>>(get(endpoint))
+        return data.getResultOrThrow();
+    }
+
+    const completeRegistation = async (token: string, password: string): Promise<WebMessage<string>> => {
+        const { data } = await axios.post<WebMessage<string>>(get(endpoint), { token, password })
+        return data;
+    }
+
+    const registerAdmin = async (username: string, password: string): Promise<WebMessage<string>> => {
+        const { data } = await axios.post<WebMessage<string>>(get(endpoint), { admin_username:username, password })
+        return data;
+    }
+
+    return {
+        createSignupLink,
+        getStatus,
+        completeRegistation,
+        registerAdmin
+    }
+}
+
+export const registationPlugin = (regEndpoint: MaybeRef<string>): PiniaPlugin => {
+
+    return ({ store }: PiniaPluginContext): any => {
+
+        const { loggedIn } = storeToRefs(store)
+      
+        const regApi = useRegApi(regEndpoint)
+        const status = shallowRef<RegistationStatus | undefined>()
+
+        const getStatus = async () => status.value = await regApi.getStatus()
+
+        watch(loggedIn, () => defer(getStatus), { immediate: true })
+
+        return{
+            registation: {
+                api: regApi,
+                status,
+            }
+        }
+    }
+}
\ No newline at end of file