Merge branch 'feature/119-Certificate_generation' of git.odit.services:lfk/frontend into feature/119-Certificate_generation

ref #119

.devcontainer/Dockerfile

@@ -0,0 +1,6 @@
+FROM mcr.microsoft.com/vscode/devcontainers/base:alpine-3.12
+RUN apk update
+RUN apk add --upgrade nodejs-current npm
+RUN npm i -g yarn rimraf
+RUN rimraf node_modules
+RUN yarn set version berry

.devcontainer/devcontainer.json

@@ -0,0 +1,20 @@
+{
+	"name": "Node.js",
+	"build": {
+		"dockerfile": "Dockerfile"
+	},
+	"settings": {
+		"terminal.integrated.shell.linux": "/bin/sh"
+	},
+	"extensions": [
+		"dbaeumer.vscode-eslint",
+		"2gua.rainbow-brackets",
+		"christian-kohler.npm-intellisense",
+		"remimarsal.prettier-now",
+		"svelte.svelte-vscode",
+		"lokalise.i18n-ally",
+		"fivethree.vscode-svelte-snippets",
+		"voorjaar.windicss-intellisense"
+	],
+	"postCreateCommand": "yarn && yarn dev --open"
+}

.dockerignore

@@ -1,3 +1 @@
-public/env.sample.js
+public/env.sample.js
-public/workbox-*.js
-public/workbox-*.js.map

.gitignore

@@ -1,11 +1,10 @@
 node_modules
-build
 package-lock.json
 yarn.lock
 *.map
 public/env.js
-public/sw.js
-public/index.html
-public/workbox-*.js
-svelte.config.js
 public/index.html
+/dist
+.yarn
+.pnp.js
+.yarnrc.yml

.vscode/extensions.json

@@ -5,7 +5,8 @@
         "remimarsal.prettier-now",
         "svelte.svelte-vscode",
         "lokalise.i18n-ally",
-        "fivethree.vscode-svelte-snippets"
+        "fivethree.vscode-svelte-snippets",
+        "voorjaar.windicss-intellisense"
     ],
     "unwantedRecommendations": [
         "antfu.i18n-ally"

.vscode/settings.json

@@ -1,4 +1,5 @@
 {
     "i18n-ally.localesPaths": "src/locales",
-    "i18n-ally.keystyle": "nested"
+    "i18n-ally.keystyle": "nested",
+    "windicss.enableCodeFolding": false,
 }

CHANGELOG.md

@@ -2,11 +2,153 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
+#### [0.11.0](https://git.odit.services/lfk/frontend/compare/0.10.0...0.11.0)
+
+- Merge pull request 'Generate and print bulk blank cards feature/116-download_blanc_cards' (#117) from feature/116-download_blanc_cards into dev [`25d8b86`](https://git.odit.services/lfk/frontend/commit/25d8b86efd89c442d1bf308a8743134820acfd1f)
+- Added button (including translations [`0614c76`](https://git.odit.services/lfk/frontend/commit/0614c76e924b18b512bab59933a26fec07cf483d)
+- Added button (including translations [`97e338f`](https://git.odit.services/lfk/frontend/commit/97e338f9d4f388596d550990457254c7fa1a3492)
+- Sorted translations [`89bb9c2`](https://git.odit.services/lfk/frontend/commit/89bb9c215e356e0940678f5cabd9e38bc203040e)
+- Added function for generating cards with pdf [`c8d6390`](https://git.odit.services/lfk/frontend/commit/c8d639024a5f2f72d6e30d2ce990b08bd71a5471)
+- Fixed button styling [`08cb079`](https://git.odit.services/lfk/frontend/commit/08cb079e9798392e26515d559af2637e74deea97)
+- Now returning cards on creation with pdf [`1d999d4`](https://git.odit.services/lfk/frontend/commit/1d999d4910acb5efa21b3f9922cdb359babff404)
+- Added comment [`636f018`](https://git.odit.services/lfk/frontend/commit/636f018daa33b99468a257bfc33477e1e644d081)
+- Bumped lfk client js version [`2d18686`](https://git.odit.services/lfk/frontend/commit/2d18686ce782a434ca7bd34c07c36a35b9497273)
+- Bumped lfk-client-js [`7dfaa75`](https://git.odit.services/lfk/frontend/commit/7dfaa7579a22b13194fcdd1c02b4437958261472)
+
+#### [0.10.0](https://git.odit.services/lfk/frontend/compare/0.9.1...0.10.0)
+
+> 26 March 2021
+
+- Added translations [`79c447b`](https://git.odit.services/lfk/frontend/commit/79c447b4c65e55ebb5af71fb0b09174c36e2cecf)
+- Sorted translations 🌍 [`5bd3a46`](https://git.odit.services/lfk/frontend/commit/5bd3a463f00abaf2c98ab554f88e5542d01f364a)
+- Reset can now only be triggered if pw is strong enoug [`75d8f73`](https://git.odit.services/lfk/frontend/commit/75d8f7331b6ae78f3979bb62148188a16f83cb8d)
+- Module now exports functions that check if a password is strong enough and equal to a potential confirmation field [`b2509e9`](https://git.odit.services/lfk/frontend/commit/b2509e9e53ab6b51dfd55e26712e8928160cd64b)
+- 🚀RELEASE v0.10.0 [`f7fc196`](https://git.odit.services/lfk/frontend/commit/f7fc1967a50f302af1d8b668628be2f4ab2975a3)
+- Added more cirteria to the password strength component [`5fa9939`](https://git.odit.services/lfk/frontend/commit/5fa9939696a35d60d762feb0cebef61d31869218)
+- Now using pw strength component [`6aaf838`](https://git.odit.services/lfk/frontend/commit/6aaf8384512185a3a319ce6b3e2505e910468e64)
+- Added a password strength verification [`ad3bd31`](https://git.odit.services/lfk/frontend/commit/ad3bd312e9a5785f81029ea2b7e302ea1addd988)
+- Implemented a custom password strength component [`4956bb0`](https://git.odit.services/lfk/frontend/commit/4956bb0e9c3c1d22d60e849aea5664e35330f897)
+- User creation can now only be triggered if pw is strong enoug [`540304f`](https://git.odit.services/lfk/frontend/commit/540304f947f60a7072c592ca8088996ce7e95cb4)
+- Now using pw strength component for user creation [`7862f44`](https://git.odit.services/lfk/frontend/commit/7862f446532903f1a2eac7b21d5c80c3245785e5)
+- Added missing exports [`962dd0c`](https://git.odit.services/lfk/frontend/commit/962dd0c1bbc0df7f20bcec5b4247188c8935c87e)
+- new license file version [CI SKIP] [`aedb8a7`](https://git.odit.services/lfk/frontend/commit/aedb8a765ba053545adbba9eb014b3bb0e5aac8c)
+- Bumped lfk-client version 🔝 [`cf58bd1`](https://git.odit.services/lfk/frontend/commit/cf58bd15c3541c417ab2be83d96135e931a2b6f6)
+- new license file version [CI SKIP] [`34f4f68`](https://git.odit.services/lfk/frontend/commit/34f4f68524918fd3d1963966a1e259d5b60efaca)
+- Merge pull request 'Implemented password strength test feature/106-password_strength' (#115) from feature/106-password_strength into dev [`09b8144`](https://git.odit.services/lfk/frontend/commit/09b81440804cf98303fcb723a9717d6d0f432da8)
+- Formatting🛠 [`4167819`](https://git.odit.services/lfk/frontend/commit/4167819e7a864d3b1dd95ba48ab1525a454f7f30)
+- Now using pw strength component for reset [`5d5f7c7`](https://git.odit.services/lfk/frontend/commit/5d5f7c7f5c6a69146f41996f4facfeff95791be0)
+
+#### [0.9.1](https://git.odit.services/lfk/frontend/compare/0.9.0...0.9.1)
+
+> 26 March 2021
+
+- 🚀RELEASE v0.9.1 [`2ca63fd`](https://git.odit.services/lfk/frontend/commit/2ca63fd1f675f0da2b18ba43095074dd4823991d)
+- Merge pull request 'Org selfservice Link feature/112-org_registration_links' (#114) from feature/112-org_registration_links into dev [`a5d25e7`](https://git.odit.services/lfk/frontend/commit/a5d25e7d92c7c37e90dbb4ba74b787873f920c6b)
+- Added checkbox to enable registration [`f9fe793`](https://git.odit.services/lfk/frontend/commit/f9fe79357317653b46c09eb95b0db13845cddcf9)
+- Sorted translations [`c074c12`](https://git.odit.services/lfk/frontend/commit/c074c12be75f285612f7a732c106404d9fb4538a)
+- You can now copy the selfservice links to your clipboard [`fcd55f8`](https://git.odit.services/lfk/frontend/commit/fcd55f89d72e6ceb9bb2bdd194cc3420145d6d0d)
+- Formatting [`f185d55`](https://git.odit.services/lfk/frontend/commit/f185d559c0d6476f2f2b9ea74aaad3297411801d)
+- Copy now 100% worX [`a3921b4`](https://git.odit.services/lfk/frontend/commit/a3921b45c70b410293db593a75d2fdd34c131733)
+- Fixed changes in wrong file [`73d95bc`](https://git.odit.services/lfk/frontend/commit/73d95bc0042f8f586ba2f2345342e25da1d280c2)
+- Added check if key exists [`c2d29ff`](https://git.odit.services/lfk/frontend/commit/c2d29ff233f6b3e9dd2555b7e0b845592da2ba35)
+- Added check if key exists [`2316baa`](https://git.odit.services/lfk/frontend/commit/2316baa8984832382be9f3b4549ca62cf9ccb5a3)
+- Added translations [`ddbc293`](https://git.odit.services/lfk/frontend/commit/ddbc293e9ca0525910bf3d995de970ee2c35c56a)
+- new license file version [CI SKIP] [`ded9b58`](https://git.odit.services/lfk/frontend/commit/ded9b589fe087915176c5b54f3c55e412541bc8f)
+- Merge pull request 'first merge to main 🚀' (#71) from dev into main [`9aa8e7e`](https://git.odit.services/lfk/frontend/commit/9aa8e7edffa7e51b00a5ab7a8f16828b7a469181)
+
+#### [0.9.0](https://git.odit.services/lfk/frontend/compare/0.8.7...0.9.0)
+
+> 26 March 2021
+
+- 🚀RELEASE v0.9.0 [`67c3732`](https://git.odit.services/lfk/frontend/commit/67c3732fad5a7c64ae11dcbebaaa095e1a2b387c)
+- Merge pull request 'Runner cards feature/94-runnercard_mgnt' (#111) from feature/94-runnercard_mgnt into dev [`2932f45`](https://git.odit.services/lfk/frontend/commit/2932f4591e62187a4903511051d110e9679c0993)
+- Sorted translations 🌍 [`1665a1a`](https://git.odit.services/lfk/frontend/commit/1665a1a093862a13be78ec65dcdf64eb7d855593)
+- Added translations [`6b5945a`](https://git.odit.services/lfk/frontend/commit/6b5945add86a77630c500872545bb91724b2047f)
+- Sorted translations 🌍 [`d6c315a`](https://git.odit.services/lfk/frontend/commit/d6c315ab8e020bc65b967e2c3f4cd921392d66d5)
+- Sorted translations [`de2fe0e`](https://git.odit.services/lfk/frontend/commit/de2fe0e9f171efb3deeea8cfe638f60e3ca90423)
+- Added basic cards page [`5c5ef95`](https://git.odit.services/lfk/frontend/commit/5c5ef95d2be65c0e951dcd472113c8ce0593c9e0)
+- Moved contract generation to it's own component [`0cfc87f`](https://git.odit.services/lfk/frontend/commit/0cfc87fbe6adfacab5c2fab732866aead3231fbf)
+- Teams now use the new sponsoring contracts module [`014ba3b`](https://git.odit.services/lfk/frontend/commit/014ba3bf6718ff28f35c67c8f732b53aae50723c)
+- Basic card generation worX 🎉🎉 [`d467475`](https://git.odit.services/lfk/frontend/commit/d467475b6d61d50bec3a043ea8792533e8593df6)
+- Orgs now use the new sponsoring contracts module [`8b451b3`](https://git.odit.services/lfk/frontend/commit/8b451b3c6794e7df09898a687533ce8fadd56192)
+- Added runnercard detail/edit modal [`0313f8c`](https://git.odit.services/lfk/frontend/commit/0313f8cc495088df1237d00e6b9ed1a94f019644)
+- Implemented Add card modal [`535b23a`](https://git.odit.services/lfk/frontend/commit/535b23ae917de154e08962f5d486c50d6e091fe0)
+- Added bulk card creation modal [`8a32569`](https://git.odit.services/lfk/frontend/commit/8a32569a3be1ad26ba163f4e2b67a368cfeeb422)
+- Added basic card overview [`c6a1526`](https://git.odit.services/lfk/frontend/commit/c6a15264b3d13d516f3d97ea4b891ed1c328cead)
+- Fixed org generation not hiding the generation toast [`c87321f`](https://git.odit.services/lfk/frontend/commit/c87321f804858f84fcccd85a15b9c3fb003c18be)
+- Working runner runnercard generation [`c907486`](https://git.odit.services/lfk/frontend/commit/c907486c4d1c64114124deb3cd0d0cf11d38a6b1)
+- Implemented bulk creation [`7ad6b73`](https://git.odit.services/lfk/frontend/commit/7ad6b73574174f24f2d6f23b3caf4823881a85e7)
+- Now w/ working dialog🎉🎉🎉 [`ae96730`](https://git.odit.services/lfk/frontend/commit/ae9673070c3959ff6190a37123f3fc609b182c5a)
+- Now w/working editing [`fac059f`](https://git.odit.services/lfk/frontend/commit/fac059f02cae84261443ee95448ec8db06dd755a)
+- Added runnercard generation for teams [`23e0b53`](https://git.odit.services/lfk/frontend/commit/23e0b53107623c505d07a99a51ce836c9324acce)
+- Added bulk creation modal to cards view [`f46ccb6`](https://git.odit.services/lfk/frontend/commit/f46ccb610e01654a4ee5e47d78ab500045dd494b)
+- Added a new runenrcard logo [`acf78a8`](https://git.odit.services/lfk/frontend/commit/acf78a88221d0988f6501ae341e028a4113b578d)
+- Moved modal import to overview for simplification [`1a52aaf`](https://git.odit.services/lfk/frontend/commit/1a52aaf8d1ad19b03d355aec0e1c48182db024f9)
+- Added CardsEmptyState + Emtystate graphic [`2d0beaa`](https://git.odit.services/lfk/frontend/commit/2d0beaaaad4efefd036bbef09f10c8c22bdb2760)
+- Added message for missing runner/blanco card) [`4715978`](https://git.odit.services/lfk/frontend/commit/4715978f810bbb283876f06d147b1ec86d373786)
+- Fixed counting bug [`f5c1ec9`](https://git.odit.services/lfk/frontend/commit/f5c1ec9939d856804c9ec3ead4b3ed869fc2ea63)
+- Added card generation/printing from detail [`4a36fb6`](https://git.odit.services/lfk/frontend/commit/4a36fb6d952d9fe4d5edbe1ed0779c7fbcd50ef0)
+- Formatting [`a516aa7`](https://git.odit.services/lfk/frontend/commit/a516aa7775faa2244862bb2e3c4de623c6405e5b)
+- Moved the pdf generation related componenets to their own folder [`ddd82a7`](https://git.odit.services/lfk/frontend/commit/ddd82a71a7b67ead892626addfd56ba4cc632750)
+- Now routing the cards page [`e852305`](https://git.odit.services/lfk/frontend/commit/e852305400a139f8169350077c30012aed556828)
+- Fuggin snowpack bs [`44bc148`](https://git.odit.services/lfk/frontend/commit/44bc14820fed26d5e0d8b12ecd6b46ca0608ae7b)
+- Formatting [`9f7d223`](https://git.odit.services/lfk/frontend/commit/9f7d2234fb9603a7391ec9a64253724c2c25c333)
+- Now with working org runenrcard generation [`4b3d38b`](https://git.odit.services/lfk/frontend/commit/4b3d38b05b3ed74fc3c0d77e00fa2ed245e6325c)
+- Now importing runner overview [`77e9c20`](https://git.odit.services/lfk/frontend/commit/77e9c205f94cf56c2e3584444899adb1e8bdf3c6)
+- CardsOverview - move to 'enabled' language key [`df53c07`](https://git.odit.services/lfk/frontend/commit/df53c0745035a220d4c07fdce1b5a5e4d763411d)
+- ✒ typo - "Geb" -> "Gebe" [`f794af0`](https://git.odit.services/lfk/frontend/commit/f794af0950de59a7a7b468c30abdcb5c145f65fb)
+- Bumped lfk client lib version [`3cd0468`](https://git.odit.services/lfk/frontend/commit/3cd0468b1921824b131178cb02677540b079f9b0)
+- drop console log - CardDetailModal [`40899e9`](https://git.odit.services/lfk/frontend/commit/40899e9d80ba07a3fbbcac72782db53d98dc318e)
+- Removed debug info [`55693de`](https://git.odit.services/lfk/frontend/commit/55693de93420c2d76af296fcacc6bcad644a3cbf)
+
+#### [0.8.7](https://git.odit.services/lfk/frontend/compare/0.8.6...0.8.7)
+
+> 25 March 2021
+
+- 🚀RELEASE v0.8.7 [`0af2647`](https://git.odit.services/lfk/frontend/commit/0af26479656393b0baea88f6f83c778740a67e62)
+- Fixed listen on wrong permission🐞 [`0844215`](https://git.odit.services/lfk/frontend/commit/08442154f4bf94fc1101808b4585dc1f95afe8b2)
+
+#### [0.8.6](https://git.odit.services/lfk/frontend/compare/0.8.5...0.8.6)
+
+> 25 March 2021
+
+- 🚀RELEASE v0.8.6 [`c3c95bf`](https://git.odit.services/lfk/frontend/commit/c3c95bf2916618efe6764a33d9a42d35764d15be)
+- Merge pull request 'Know Production Bugs 🐞' (#109) from bugfix/107-prod_issues into dev [`d2050b5`](https://git.odit.services/lfk/frontend/commit/d2050b5948890a6077cbb41d82d1a6a1d1106652)
+- Errors now toast errors❌ [`17e0805`](https://git.odit.services/lfk/frontend/commit/17e0805fe64f6d181f55b81afa502ee6443ebabe)
+- Sorted translations 👀 [`82b1811`](https://git.odit.services/lfk/frontend/commit/82b1811971b974b686e7618b8a381e1589c168f6)
+- Fixed missing translations for scanstations🌍 [`aeadef6`](https://git.odit.services/lfk/frontend/commit/aeadef60bbe71da09bb569d20ca7377645beba7f)
+- Sorted translations🌍 [`a1ab65a`](https://git.odit.services/lfk/frontend/commit/a1ab65a0e975c02c01c603bf6d95a79ada1caa0b)
+- Fixed runner import getting triggered with invalid information [`ddd9c39`](https://git.odit.services/lfk/frontend/commit/ddd9c396b6bfd39a7b1627d4975151943b367ebf)
+- Removed middlename search from all files that had it [`6b92405`](https://git.odit.services/lfk/frontend/commit/6b92405bae21e78d694601cbc0b33eed56ef4533)
+- Fixed mail login bug🐞📧 [`0768939`](https://git.odit.services/lfk/frontend/commit/076893981ff4f7f17330746c561acc570339adac)
+- Now disabled search by middlename as a quick workaround 🐞 [`49e87cc`](https://git.odit.services/lfk/frontend/commit/49e87ccb15a7ed5edea22a3c3e235f7bee07d3f4)
+- Fixed conflicting css [`50fffef`](https://git.odit.services/lfk/frontend/commit/50fffef13b8fce885964d8ac277b4ca24d944b2b)
+- Commented out the buggy runner search to prevent bad UX [`fbe74a5`](https://git.odit.services/lfk/frontend/commit/fbe74a5d8090553a35576a17c97019939cf4f386)
+- Fixed outsideclick not clearing import modal🛠 [`ef49e50`](https://git.odit.services/lfk/frontend/commit/ef49e507c175510eeb466d33f222755fac8a2a0b)
+
+#### [0.8.5](https://git.odit.services/lfk/frontend/compare/0.8.4...0.8.5)
+
+> 20 March 2021
+
+- 🚀RELEASE v0.8.5 [`e838e6f`](https://git.odit.services/lfk/frontend/commit/e838e6f321bef1565a7e4316890a3c600b242e5a)
+- Fixed dupliacate mutation 🐞 [`91dd525`](https://git.odit.services/lfk/frontend/commit/91dd5256e9545f62e4342ae5477c36262d6e3401)
+
+#### [0.8.4](https://git.odit.services/lfk/frontend/compare/0.8.3...0.8.4)
+
+> 20 March 2021
+
+- CONFIG: default_username + default_password [`cc926e8`](https://git.odit.services/lfk/frontend/commit/cc926e84fb8bd9d6c9fd37349e25eb802e1bb324)
+- 🚀RELEASE v0.8.4 [`3d4dc2d`](https://git.odit.services/lfk/frontend/commit/3d4dc2d72b129f0134ae9f230810c3301dbd5caa)
+- CONFIG: add 'demo' as default username/password [`ba34710`](https://git.odit.services/lfk/frontend/commit/ba3471068ab00e2d5dbe21d6d763094e662f8347)
+
 #### [0.8.3](https://git.odit.services/lfk/frontend/compare/0.8.2...0.8.3)
 
+> 20 March 2021
+
 - Sorted translation 🌍 [`d6f6d10`](https://git.odit.services/lfk/frontend/commit/d6f6d10cb6b639a1f988e0da4811355750b0f027)
 - Smaller bugfixes [`8e04377`](https://git.odit.services/lfk/frontend/commit/8e0437728bd04223a23cdf1879c6c739ca8ebef7)
 - More small fixes [`1249904`](https://git.odit.services/lfk/frontend/commit/12499045824c13a3ee35c6cc8c3c3a3130dbec12)
+- 🚀RELEASE v0.8.3 [`fff16e6`](https://git.odit.services/lfk/frontend/commit/fff16e6650cce1231a8d0db43531bf8e3e01f84a)
 
 #### [0.8.2](https://git.odit.services/lfk/frontend/compare/0.8.1...0.8.2)
 

Dockerfile

@@ -1,18 +1,14 @@
 FROM node:15.5.1-alpine3.12
 WORKDIR /app
-RUN npm i -g pnpm
 COPY package.json ./
-RUN pnpm i
+RUN yarn
-COPY package.json *.config.js workbox-config.js template-copy.js index.template.html s-config.template.js ./
+COPY package.json *.config.js index.html ./
 COPY src ./src
 COPY public ./public
-RUN pnpm run build
+RUN yarn build
 # final image
 FROM alpine
-COPY --from=0 /app/build /app
+COPY --from=0 /app/dist /app
-RUN rm -rf /app/build/_dist_/components
-RUN rm -rf /app/build/_dist_/locales
-RUN rm -rf /app/build-manifest.json
 FROM fholzer/nginx-brotli:v1.19.1
 COPY --from=1 /app /usr/share/nginx/html
 COPY ./nginx.conf /etc/nginx/nginx.conf

README.md

@@ -0,0 +1,22 @@
+# @odit/lfk-frontend
+
+## ✒️ Overview
+This is an API client for [https://git.odit.services/lfk/backend](@lfk/backend)
+- WebApp built with [Svelte](https://svelte.dev), [WindiCSS](https://windicss.org/) (to compile [TailwindCSS](https://tailwindcss.com/)) and [Vite](https://vitejs.dev).
+
+This application is intended for use by admin users/ members only.
+
+## 🚀 Getting Started
+```
+yarn
+```
+## Development
+```
+yarn dev
+/
+yarn dev --open
+```
+## Build
+```
+yarn build
+```

env.sample.js

@@ -1,7 +0,0 @@
-const config = {
-	baseurl: 'https://dev.lauf-fuer-kaya.de',
-	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe',
-	fallback_username: 'admin',
-	fallback_password: '72fpTzsev4xUu78QPs2FCbwZ3',
-	prefersHashRouting: true
-};

index.html

@@ -1,23 +1,22 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
-<html lang="en">
+<html lang="en">
-
+
-<head>
+<head>
-  <meta charset="utf-8" />
+  <meta charset="utf-8" />
-  <link rel="icon" href="/favicon.png" />
+  <link rel="icon" href="/favicon.png" />
-  <link rel="manifest" href="/manifest.webmanifest">
+  <link rel="manifest" href="/manifest.webmanifest">
-  <link rel="apple-touch-icon" href="/lfk-logo.png">
+  <link rel="apple-touch-icon" href="/lfk-logo.png">
-  <meta name="theme-color" content="#FFFFFF">
+  <meta name="theme-color" content="#FFFFFF">
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <meta name="description" content="Lauf Für Kaya! - Admin" />
+  <meta name="description" content="Lauf Für Kaya! - Admin" />
-  <title>Lauf für Kaya! - Admin</title>
+  <title>Lauf für Kaya! - Admin</title>
-  __TAILWIND_INSERT__
+</head>
-</head>
+
-
+<body>
-<body>
+  <span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.8.4-RELEASE_INFO</span>
-  <span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.8.3-RELEASE_INFO</span>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
-  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <script src="/env.js"></script>
-  <script src="/env.js"></script>
+  <script type="module" src="/src/main.js"></script>
-  <script defer type="module" src="/_dist_/index.js"></script>
+</body>
-</body>
+
-
 </html>

nginx.conf

@@ -6,6 +6,15 @@ http {
     server {
         error_page 404 /index.html;
         root /usr/share/nginx/html;
+        location = /index.html {
+            add_header Cache-Control 'no-store';
+        }
+        location = / {
+            add_header Cache-Control 'no-store';
+        }
+        location = /env.js {
+            add_header Cache-Control 'no-store';
+        }
         location / {
             try_files $uri $uri/ /index.html;
         }

package.json

@@ -1,45 +1,40 @@
 {
 	"name": "@odit/lfk-frontend",
-	"version": "0.8.3",
+	"version": "0.8.4",
 	"scripts": {
 		"i18n-order": "node order.js",
-		"dev:all": "yarn prebuild && snowpack dev",
+		"dev": "vite",
-		"dev": "cross-env NODE_ENV_ODIT=development_fast node template-copy.js && yarn build:sw && snowpack dev",
+		"build": "vite build",
-		"build": "yarn prebuild && snowpack build",
-		"prebuild": "cross-env NODE_ENV_ODIT=production node template-copy.js && yarn build:sw",
-		"build:sw": "workbox generateSW workbox-config.js",
 		"release": "release-it",
 		"licenses:export": "license-exporter --json -o public"
 	},
 	"license": "CC-BY-NC-SA-4.0",
-	"dependencies": {
-		"@odit/lfk-client-js": "0.6.4",
-		"csvtojson": "^2.0.10",
-		"gridjs": "3.3.0",
-		"localforage": "1.9.0",
-		"marked": "^2.0.1",
-		"svelte-focus-trap": "1.0.1",
-		"svelte-i18n": "3.3.7",
-		"svelte-select": "^3.17.0",
-		"tailwindcss": "2.0.3",
-		"tinro": "0.6.1",
-		"toastify-js": "1.9.3",
-		"validator": "13.5.2",
-		"xlsx": "^0.16.9"
-	},
 	"devDependencies": {
-		"@odit/license-exporter": "^0.0.11",
+		"check-password-strength": "2.0.2",
-		"@snowpack/plugin-svelte": "3.5.2",
+		"@odit/lfk-client-js": "0.10.1",
-		"auto-changelog": "^2.2.1",
+		"@odit/license-exporter": "0.0.11",
+		"@sveltejs/vite-plugin-svelte": "1.0.0-next.5",
+		"@types/html-minifier": "4.0.0",
+		"auto-changelog": "2.2.1",
 		"autoprefixer": "10.2.5",
-		"cross-env": "^7.0.3",
+		"csvtojson": "2.0.10",
-		"postcss": "8.2.8",
+		"gridjs": "3.4.0",
-		"postcss-load-config": "3.0.1",
+		"html-minifier": "4.0.0",
-		"release-it": "^14.4.1",
+		"localforage": "1.9.0",
-		"snowpack": "3.0.13",
+		"marked": "2.0.1",
-		"svelte": "3.35.0",
+		"release-it": "14.5.1",
-		"svelte-preprocess": "4.6.9",
+		"svelte": "3.37.0",
-		"workbox-cli": "6.1.2"
+		"svelte-focus-trap": "1.2.0",
+		"svelte-i18n": "3.3.9",
+		"svelte-preprocess": "4.7.0",
+		"svelte-select": "3.17.0",
+		"tailwindcss": "2.0.4",
+		"tinro": "0.6.1",
+		"toastify-js": "1.10.0",
+		"validator": "13.5.2",
+		"vite": "2.1.5",
+		"vite-plugin-windicss": "0.12.2",
+		"xlsx": "0.16.9"
 	},
 	"release-it": {
 		"git": {
@@ -55,7 +50,7 @@
 			"publish": false
 		},
 		"hooks": {
-			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js  && git add index.template.html && node order.js  && git add src/locales"
+			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js  && git add index.html && node order.js  && git add src/locales"
 		}
 	}
 }

public/env.sample.js

@@ -1,6 +1,8 @@
 const config = {
 	baseurl: 'http://localhost:4010',
-	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe'
+	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe',
 	// optional
+	default_username: 'demo',
+	default_password: 'demo',
 	prefersHashRouting: true
 };

public/imprint_en.md

@@ -1 +0,0 @@
-Nostrud tempor dolor aute ea excepteur aute mollit elit eiusmod exercitation. Magna laborum pariatur adipisicing pariatur cupidatat exercitation duis aliquip pariatur sint exercitation deserunt labore. Consectetur id laboris dolore nostrud do velit ipsum. Eu laboris velit do commodo ad ea sint ex cillum. Cillum ipsum qui eiusmod laborum mollit sunt dolore incididunt. Cillum sunt culpa veniam voluptate et qui ut magna anim occaecat ut mollit dolor. Duis irure proident eu incididunt dolore sunt nisi aute dolore amet eu fugiat laboris quis.

s-config.template.js

@@ -1,6 +0,0 @@
-const sveltePreprocess = require('svelte-preprocess');
-const preprocess = sveltePreprocess(__insert__);
-
-module.exports = {
-	preprocess
-};

snowpack.config.js

@@ -1,26 +0,0 @@
-/** @type {import("snowpack").SnowpackUserConfig } */
-module.exports = {
-	mount: {
-		public: '/',
-		src: '/_dist_'
-	},
-	plugins: [ '@snowpack/plugin-svelte' ],
-	routes: [
-		/* Enable an SPA Fallback in development: */
-		{ match: 'routes', src: '.*', dest: '/index.html' }
-	],
-	packageOptions: {
-		/* ... */
-		sourceMap: false
-	},
-	devOptions: {
-		/* ... */
-	},
-	buildOptions: {
-		/* ... */
-	},
-	alias: {
-		/* ... */
-	},
-	optimize: { bundle: true, minify: true }
-};

src/App.svelte

@@ -1,5 +1,4 @@
 <script>
-  import "./TailwindStyles.svelte";
   import "toastify-js/src/toastify.css";
   import "gridjs/dist/theme/mermaid.css";
   import { Route, router } from "tinro";
@@ -53,7 +52,6 @@
   import { OpenAPI } from "@odit/lfk-client-js";
   import UserDetail from "./components/users/UserDetail.svelte";
   OpenAPI.BASE = config.baseurl;
-  import { register as registerSW } from "./swmodule";
   import TeamDetail from "./components/teams/TeamDetail.svelte";
   import UserPermissions from "./components/users/UserPermissions.svelte";
   import GroupPermissions from "./components/groups/GroupPermissions.svelte";
@@ -69,13 +67,12 @@
   import Donations from "./components/donations/Donations.svelte";
   import DonationDetail from "./components/donations/DonationDetail.svelte";
   import GroupDetail from "./components/groups/GroupDetail.svelte";
-  import ScanStationsOverview from "./components/scanstations/ScanStationsOverview.svelte";
   import ScanStations from "./components/scanstations/ScanStations.svelte";
   import ScanStationDetail from "./components/scanstations/ScanStationDetail.svelte";
   import Scans from "./components/scans/Scans.svelte";
-import ScanDetail from "./components/scans/ScanDetail.svelte";
+  import ScanDetail from "./components/scans/ScanDetail.svelte";
+  import Cards from "./components/cards/Cards.svelte";
   store.init();
-  registerSW();
 </script>
 
 <Route>
@@ -185,6 +182,14 @@ import ScanDetail from "./components/scans/ScanDetail.svelte";
             <DonationDetail {params} />
           </Route>
         </Route>
+        <Route path="/cards/*">
+          <Route path="/">
+            <Cards />
+          </Route>
+          <!-- <Route path="/:scanid" let:params>
+            <ScanDetail {params} />
+          </Route> -->
+        </Route>
         <Route path="/scans/*">
           <Route path="/">
             <Scans />

src/TailwindStyles.svelte

@@ -1,6 +0,0 @@
-<style global>
-  /*! @import */
-  @tailwind base;
-  @tailwind components;
-  @tailwind utilities;
-</style>

src/components/auth/Login.svelte

@@ -5,10 +5,11 @@
   store.init();
   import { OpenAPI, AuthService } from "@odit/lfk-client-js";
   import Footer from "../general/Footer.svelte";
+  import isEmail from "validator/es/lib/isEmail";
   import Toastify from "toastify-js";
   // ------
-  let username = "demo";
+  let username = config.default_username || "";
-  let password = "demo";
+  let password = config.default_password || "";
   let is_blocked_by_autologin = false;
   let last_loginclick_processed = true;
 
@@ -36,10 +37,19 @@
         text: $_("login_is_checked"),
         duration: 500,
       }).showToast();
-      AuthService.authControllerLogin({
+      let postdata = {};
-        username,
+      if (isEmail(username)) {
-        password,
+        postdata = {
-      })
+          email: username,
+          password,
+        };
+      } else {
+        postdata = {
+          username,
+          password,
+        };
+      }
+      AuthService.authControllerLogin(postdata)
         .then(async (result) => {
           await localForage.setItem("logindata", result);
           OpenAPI.TOKEN = result.access_token;

src/components/auth/PasswordStrength.svelte

@@ -0,0 +1,52 @@
+<script context="module">
+    import { passwordStrength } from "check-password-strength";
+    export function password_strong_enough(password_change) {
+        let strength = passwordStrength(password_change);
+        return (
+            strength?.contains.includes("lowercase") &&
+            strength?.contains.includes("uppercase") &&
+            strength?.contains.includes("number") &&
+            strength?.length > 9
+        );
+    }
+    export function password_strong_enough_and_equal(
+        password_change,
+        password_confirm
+    ) {
+        return (
+            password_strong_enough(password_change) &&
+            password_change === password_confirm
+        );
+    }
+</script>
+
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import { passwordStrength as Strength } from "check-password-strength";
+    export let password_change;
+    export let password_confirm;
+
+    $: strength = Strength(password_change);
+    $: passwords_match =
+        !password_confirm || password_confirm === password_change;
+</script>
+
+<div class="ml-4">
+    <ul class="list-disc font-medium tracking-wide text-red-500 text-xs">
+        {#if !strength.contains.includes('lowercase')}
+            <li>{$_('must-contain-a-lowercase-letter')}</li>
+        {/if}
+        {#if !strength.contains.includes('uppercase')}
+            <li>{$_('must-contain-a-uppercase-letter')}</li>
+        {/if}
+        {#if !strength.contains.includes('number')}
+            <li>{$_('must-contain-a-number')}</li>
+        {/if}
+        {#if !(strength.length > 9)}
+            <li>{$_('must-be-at-least-10-characters-long')}</li>
+        {/if}
+        {#if !(passwords_match == true)}
+            <li>{$_('passwords-dont-match')}</li>
+        {/if}
+    </ul>
+</div>

src/components/auth/ResetPassword.svelte

@@ -1,38 +1,43 @@
 <script>
-  import {  AuthService } from "@odit/lfk-client-js";
+  import { AuthService } from "@odit/lfk-client-js";
   import { _ } from "svelte-i18n";
   import Toastify from "toastify-js";
   import "toastify-js/src/toastify.css";
+  import PasswordStrength, {
+    password_strong_enough,
+  } from "../auth/PasswordStrength.svelte";
   let state = "reset_in_progress";
   let password = "";
   export let params;
   function set_new_password() {
-      if(password.trim() !== ""){
+    if (password.trim() !== "") {
-        Toastify({
+      Toastify({
-          text: $_('password-reset-in-progress'),
+        text: $_("password-reset-in-progress"),
-          duration: 3500,
+        duration: 3500,
-        }).showToast();
+      }).showToast();
-        AuthService.authControllerResetPassword(atob(params.resetkey),{ password })
+      AuthService.authControllerResetPassword(atob(params.resetkey), {
+        password,
+      })
         .then((resp) => {
           Toastify({
-            text: $_('password-reset-successful'),
+            text: $_("password-reset-successful"),
             duration: 3500,
           }).showToast();
-          state="reset_success";
+          state = "reset_success";
         })
         .catch((err) => {
-          state="reset_error";
+          state = "reset_error";
         });
-      } else {
+    } else {
       Toastify({
-        text: $_('please-provide-a-password'),
+        text: $_("please-provide-a-password"),
         duration: 3500,
       }).showToast();
     }
   }
 </script>
 
-{#if state==="reset_success"}
+{#if state === 'reset_success'}
   <div class="min-h-screen flex items-center justify-center bg-gray-100">
     <div class="max-w-md w-full py-12 px-6">
       <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
@@ -56,31 +61,31 @@
       </div>
     </div>
   </div>
-{:else if state==="reset_error"}
+{:else if state === 'reset_error'}
-<div class="min-h-screen flex items-center justify-center bg-gray-100">
+  <div class="min-h-screen flex items-center justify-center bg-gray-100">
-  <div class="max-w-md w-full py-12 px-6">
+    <div class="max-w-md w-full py-12 px-6">
-    <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
+      <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
-    <p class="mt-6 text-lg text-center font-bold text-gray-900">
+      <p class="mt-6 text-lg text-center font-bold text-gray-900">
-      {$_('application_name')}
+        {$_('application_name')}
-    </p>
+      </p>
-    <p class="mt-2 mb-2 text-sm text-center text-gray-900 font-bold">
+      <p class="mt-2 mb-2 text-sm text-center text-gray-900 font-bold">
-      {$_('password-reset-failed')}
+        {$_('password-reset-failed')}
-    </p>
+      </p>
-    <p class="mt-2 mb-2 text-sm text-center text-gray-900">
+      <p class="mt-2 mb-2 text-sm text-center text-gray-900">
-      {$_('please-request-a-new-reset-mail')}
+        {$_('please-request-a-new-reset-mail')}
-    </p>
+      </p>
-    <div class="mt-6">
       <div class="mt-6">
-        <a
+        <div class="mt-6">
-          href="/forgot_password/"
+          <a
-          class="text-center relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
+            href="/forgot_password/"
-          {$_('request-a-new-reset-mail')}
+            class="text-center relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
-        </a>
+            {$_('request-a-new-reset-mail')}
+          </a>
+        </div>
       </div>
     </div>
   </div>
-</div>
+{:else if state === 'reset_in_progress'}
-{:else if state==="reset_in_progress"}
   <div class="min-h-screen flex items-center justify-center bg-gray-100">
     <div class="max-w-md w-full py-12 px-6">
       <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
@@ -102,11 +107,14 @@
               placeholder={$_('new-password')}
               bind:value={password} />
           </div>
+          <PasswordStrength bind:password_change={password} />
         </div>
 
         <div class="mt-5">
           <button
             on:click={set_new_password}
+            disabled={!password_strong_enough(password)}
+            class:opacity-50={!password_strong_enough(password)}
             type="submit"
             class="relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
             <span class="absolute left-0 inset-y pl-3">

src/components/cards/AddCardBulkModal.svelte

@@ -0,0 +1,240 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import { RunnerCardService } from "@odit/lfk-client-js";
+  import Toastify from "toastify-js";
+  export let bulk_modal_open;
+  export let current_cards;
+  function focus(el) {
+    el.focus();
+  }
+  $: card_count = 0;
+  $: is_card_count_valid = card_count > 0;
+  $: processed_last_submit = true;
+  $: createbtnenabled = is_card_count_valid;
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        bulk_modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit_with_print();
+        }
+      }
+    };
+  })();
+  function submit_without_print() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("creating-blanco-cards"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPostBlancoBulk(card_count, false)
+        .then((result) => {
+          bulk_modal_open = false;
+          //
+          Toastify({
+            text: $_("created-blanco-cards"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+
+  function submit_with_print() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("creating-blanco-cards"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPostBlancoBulk(card_count, true)
+        .then((result) => {
+          bulk_modal_open = false;
+          //
+          Toastify({
+            text: $_("created-blanco-cards"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards = current_cards.concat(result);
+          const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+          }).showToast();
+          fetch(
+            `${config.baseurl}/documents/cards?&download=true&key=${config.documentserver_key}`,
+            {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify(result),
+            }
+          )
+            .then((response) => {
+              if (response.status != "200") {
+                toast.hideToast();
+                Toastify({
+                  text: $_("pdf-generation-failed"),
+                  duration: 3500,
+                  backgroundColor:
+                    "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                }).showToast();
+              } else {
+                return response.blob();
+              }
+            })
+            .then((blob) => {
+              const url = window.URL.createObjectURL(blob);
+              let a = document.createElement("a");
+              a.href = url;
+              a.download = "Bulkcards.pdf";
+              document.body.appendChild(a);
+              a.click();
+              a.remove();
+              toast.hideToast();
+              Toastify({
+                text: $_("pdf-successfully-generated"),
+                duration: 3500,
+                backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+              }).showToast();
+            })
+            .catch((err) => {
+              console.error(err);
+            });
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if bulk_modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      bulk_modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        aria-hidden="true">&#8203;</span>
+      <div
+        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w- rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('create-bulk-blanco-cards')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('just-enter-how-many-you-want-and-the-system-will-create-them')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="amount"
+                    class="block text-sm font-medium text-gray-700">{$_('amount')}</label>
+                  <div class="mt-1 flex rounded-md shadow-sm">
+                    <input
+                      autocomplete="off"
+                      class:border-red-500={!is_card_count_valid}
+                      class:focus:border-red-500={!is_card_count_valid}
+                      class:focus:ring-red-500={!is_card_count_valid}
+                      bind:value={card_count}
+                      type="number"
+                      step="1"
+                      name="amount"
+                      class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
+                      placeholder="400" />
+                    <span
+                      class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm">{$_('cards')}</span>
+                  </div>
+                  {#if !is_card_count_valid}
+                    <span
+                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                      {$_('you-must-create-at-least-one-card-or-cancel')}
+                    </span>
+                  {/if}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit_with_print}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create-and-generate-pdf')}
+          </button>
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit_without_print}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-400 text-base font-medium text-white hover:bg-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create-without-pdf')}
+          </button>
+          <button
+            on:click={() => {
+              bulk_modal_open = false;
+            }}
+            type="button"
+            class="mr-auto mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/AddCardModal.svelte

@@ -0,0 +1,170 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import {
+    RunnerCardService,
+    RunnerService,
+    ScanService,
+  } from "@odit/lfk-client-js";
+  import Select from "svelte-select";
+  import Toastify from "toastify-js";
+  export let modal_open;
+  export let current_cards;
+  const getRunnerLabel = (option) =>
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  const filterRunners = (label, filterText, option) =>
+    label.toLowerCase().includes(filterText.toLowerCase()) ||
+    option.value.toString().startsWith(filterText.toLowerCase());
+  function focus(el) {
+    el.focus();
+  }
+  $: runner = 0;
+  $: runners = [];
+  $: enabled = true;
+  $: processed_last_submit = true;
+  RunnerService.runnerControllerGetAll().then((val) => {
+    runners = val.map((r) => {
+      return { label: getRunnerLabel(r), value: r };
+    });
+  });
+  $: createbtnenabled = true;
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit();
+        }
+      }
+    };
+  })();
+  function submit() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("adding-card"),
+        duration: -1,
+      }).showToast();
+      let postdata = {
+        runner,
+        enabled,
+      };
+      RunnerCardService.runnerCardControllerPost(postdata)
+        .then((result) => {
+          runner = 0;
+          modal_open = false;
+          //
+          Toastify({
+            text: $_("card-added"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards.push(result);
+          current_cards = current_cards;
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        aria-hidden="true">&#8203;</span>
+      <div
+        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('create-a-new-card')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('you-can-provide-a-runner-but-you-dont-have-to')}
+                  {$_('if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="donor"
+                    class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
+                  <Select
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
+                    itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
+                    items={runners}
+                    showChevron={true}
+                    placeholder={$_('search-for-runner-by-name-or-id')}
+                    noOptionsMessage={$_('no-runners-found')}
+                    on:select={(selectedValue) => (runner = selectedValue.detail.value.id)}
+                    on:clear={() => (runner = null)} />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create')}
+          </button>
+          <button
+            on:click={() => {
+              modal_open = false;
+            }}
+            type="button"
+            class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/CardDetailModal.svelte

@@ -0,0 +1,186 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import { RunnerCardService, RunnerService } from "@odit/lfk-client-js";
+  import Select from "svelte-select";
+  import Toastify from "toastify-js";
+  export let edit_modal_open;
+  export let current_cards;
+  export let runner = {};
+  export let editable = {};
+  export let original_data = {};
+  const getRunnerLabel = (option) =>
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  const filterRunners = (label, filterText, option) =>
+    label.toLowerCase().includes(filterText.toLowerCase()) ||
+    option.value.toString().startsWith(filterText.toLowerCase());
+  function focus(el) {
+    el.focus();
+  }
+  $: runners = [];
+  $: enabled = true;
+  $: processed_last_submit = true;
+  RunnerService.runnerControllerGetAll().then((val) => {
+    runners = val.map((r) => {
+      return { label: getRunnerLabel(r), value: r };
+    });
+  });
+  $: createbtnenabled = !(
+    JSON.stringify(editable) === JSON.stringify(original_data)
+  );
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        edit_modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit();
+        }
+      }
+    };
+  })();
+  function submit() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("updating-card"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPut(original_data.id, editable)
+        .then((result) => {
+          let id = original_data.id;
+          runner = {};
+          editable = {};
+          original_data = {};
+          edit_modal_open = false;
+          //
+          Toastify({
+            text: $_("card-updated"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards[current_cards.findIndex((c) => c.id === id)] = result;
+          current_cards = current_cards;
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if edit_modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      edit_modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        aria-hidden="true">&#8203;</span>
+      <div
+        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('edit-a-card')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('you-can-provide-a-runner-but-you-dont-have-to')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="runner"
+                    class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
+                  <Select
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
+                    itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
+                    items={runners}
+                    showChevron={true}
+                    placeholder={$_('search-for-runner-by-name-or-id')}
+                    noOptionsMessage={$_('no-runners-found')}
+                    bind:selectedValue={runner}
+                    on:select={(selectedValue) => (editable.runner = selectedValue.detail.value.id)}
+                    on:clear={() => (editable.runner = null)} />
+                </div>
+                <div class="col-span-6">
+                  <p class="text-gray-500">
+                    <input
+                      id="enabled"
+                      on:change={() => {
+                        editable.enabled = !editable.enabled;
+                      }}
+                      name="enabled"
+                      type="checkbox"
+                      checked={editable.enabled}
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+                    {$_('this-card-is')}
+                    {#if editable.enabled}
+                      {$_('enabled')}
+                    {:else}{$_('disabled')}{/if}
+                  </p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('save-changes')}
+          </button>
+          <button
+            on:click={() => {
+              edit_modal_open = false;
+            }}
+            type="button"
+            class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/Cards.svelte

@@ -0,0 +1,40 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import store from "../../store";
+  import AddCardBulkModal from "./AddCardBulkModal.svelte";
+  import AddCardModal from "./AddCardModal.svelte";
+  import CardsOverview from "./CardsOverview.svelte";
+  $: current_cards = [];
+  export let modal_open = false;
+  export let bulk_modal_open = false;
+</script>
+
+<section class="container p-5">
+  <span class="mb-1 text-3xl font-extrabold leading-tight">
+    {$_('cards')}
+    {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:CREATE')}
+      <button
+        on:click={() => {
+          modal_open = true;
+        }}
+        type="button"
+        class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        {$_('add-card')}
+      </button>
+      <button
+        on:click={() => {
+          bulk_modal_open = true;
+        }}
+        type="button"
+        class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        {$_('create-bulk-cards')}
+      </button>
+    {/if}
+  </span>
+  <CardsOverview bind:current_cards />
+</section>
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:CREATE')}
+  <AddCardModal bind:current_cards bind:modal_open />
+  <AddCardBulkModal bind:current_cards bind:bulk_modal_open />
+{/if}

src/components/cards/CardsEmptyState.svelte

@@ -0,0 +1,12 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import cards_empty from "./cards.svg";
+</script>
+
+<div class="text-center items-center justify-center">
+  <p class="mb-16 text-lg text-gray-500">
+    <img class="m-auto" style="height:15rem" src={cards_empty} alt="" />
+    <span class="font-bold">{$_('there-are-no-cards-yet')}</span><br />
+    <span>{$_('add-your-first-card')}</span>
+  </p>
+</div>

src/components/cards/CardsOverview.svelte

@@ -0,0 +1,237 @@
+<script>
+  import { getLocaleFromNavigator, json, _ } from "svelte-i18n";
+  import { RunnerCardService } from "@odit/lfk-client-js";
+  import store from "../../store";
+  import Toastify from "toastify-js";
+  import CardsEmptyState from "./CardsEmptyState.svelte";
+  import CardDetailModal from "./CardDetailModal.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
+  export let edit_modal_open = false;
+  export let runner = {};
+  export let editable = {};
+  export let original_data = {};
+  export let current_cards = [];
+  $: searchvalue = "";
+  $: active_deletes = [];
+  $: cards_show = current_cards.some(
+    (r) => r.is_selected === true
+  );
+  $: generate_cards = current_cards.filter((r) => r.is_selected === true);
+  const cards_promise = RunnerCardService.runnerCardControllerGetAll().then(
+    (val) => {
+      current_cards = val;
+    }
+  );
+  function should_display_based_on_id(id) {
+    if (searchvalue.toString().slice(-1) === "*") {
+      return id.toString().startsWith(searchvalue.replace("*", ""));
+    }
+    return id.toString() === searchvalue;
+  }
+  const getRunnerLabel = (option) =>
+    option?.firstname + " " + (option?.middlename || "") + " " + (option?.lastname || "{$_('non-blanko')}");
+  function open_edit_modal(card) {
+    if(card.runner?.id){
+      runner = Object.assign(
+        { runner },
+        { label: getRunnerLabel(card.runner), value: card.runner }
+      );
+      card.runner = card.runner.id;
+    }
+    else{
+      card.runner=null;
+      runner = null
+    }
+    editable = Object.assign(editable, card);
+    original_data = Object.assign(original_data, card);
+    edit_modal_open = true;
+  }
+</script>
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:UPDATE')}
+  <CardDetailModal
+    bind:current_cards
+    bind:edit_modal_open
+    bind:runner
+    bind:editable
+    bind:original_data />
+{/if}
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:GET')}
+  {#await cards_promise}
+    <div
+      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
+      role="alert">
+      <p class="font-bold">{$_('loading-cards')}</p>
+      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
+    </div>
+  {:then}
+    {#if current_cards.length === 0}
+      <CardsEmptyState />
+    {:else}
+      <input
+        type="search"
+        bind:value={searchvalue}
+        placeholder={$_('datatable.search')}
+        aria-label={$_('datatable.search')}
+        class="gridjs-input gridjs-search-input mb-4" />
+        <div class="h-12">
+          <GenerateRunnerCards
+            bind:cards_show
+            bind:generate_cards />
+        </div>
+      <div
+        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
+        <table class="divide-y divide-gray-200 w-full">
+          <thead class="bg-gray-50">
+            <tr>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                <span
+                  on:click={() => {
+                    const newstate = !current_cards.some((r) => r.is_selected === true);
+                    current_cards = current_cards.map((r) => {
+                      r.is_selected = newstate;
+                      return r;
+                    });
+                  }}
+                  class="underline cursor-pointer select-none">{#if current_cards.some((r) => r.is_selected === true)}
+                    {$_('deselect-all')}
+                  {:else}{$_('select-all')}{/if}
+                </span>
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('code')}
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('runner')}
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('status')}
+              </th>
+              <th scope="col" class="relative px-6 py-3">
+                <span class="sr-only">{$_('action')}</span>
+              </th>
+            </tr>
+          </thead>
+          <tbody class="divide-y divide-gray-200">
+            {#each current_cards as card}
+              {#if card.code
+                .toLowerCase()
+                .includes(
+                  searchvalue.toLowerCase()
+                ) || card.runner?.firstname
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || card.runner?.middlename
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || card.runner?.lastname
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || should_display_based_on_id(card.id)}
+                <tr data-rowid="card_{card.id}">
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <input
+                      bind:checked={card.is_selected}
+                      type="checkbox"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <div class="flex items-center">{card.code}</div>
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <div class="flex items-center">
+                      {#if card.runner}
+                        <a
+                          href="../runners/{card.runner.id}"
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{card.runner.firstname}
+                          {card.runner.middlename || ''}
+                          {card.runner.lastname}</a>
+                      {:else}{$_('non-blanko')}{/if}
+                    </div>
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <div class="flex items-center">
+                      {#if card.enabled}
+                        <span
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">{$_('enabled')}</span>
+                      {:else}
+                        <span
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">{$_('disabled')}</span>
+                      {/if}
+                    </div>
+                  </td>
+
+                  {#if active_deletes[card.id] === true}
+                    <td
+                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+                      <button
+                        on:click={() => {
+                          active_deletes[card.id] = false;
+                        }}
+                        tabindex="0"
+                        class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
+                      <button
+                        on:click={() => {
+                          RunnerCardService.runnerCardControllerRemove(card.id, false).then(
+                            (resp) => {
+                              current_cards = current_cards.filter(
+                                (obj) => obj.id !== card.id
+                              );
+                              Toastify({
+                                text: $_('card-deleted'),
+                                duration: 500,
+                                backgroundColor:
+                                  'linear-gradient(to right, #00b09b, #96c93d)',
+                              }).showToast();
+                            }
+                          );
+                        }}
+                        tabindex="0"
+                        class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
+                    </td>
+                  {:else}
+                    <td
+                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+                      <button
+                        on:click={() => {
+                          open_edit_modal(card);
+                        }}
+                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</button>
+                      {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:DELETE')}
+                        <button
+                          on:click={() => {
+                            active_deletes[card.id] = true;
+                          }}
+                          tabindex="0"
+                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
+                      {/if}
+                    </td>
+                  {/if}
+                </tr>
+              {/if}
+            {/each}
+          </tbody>
+        </table>
+      </div>
+    {/if}
+  {:catch error}
+    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
+      <span class="inline-block align-middle mr-8">
+        <b class="capitalize">{$_('general_promise_error')}</b>
+        {error}
+      </span>
+    </div>
+  {/await}
+{/if}

src/components/cards/cards.svg

@@ -0,0 +1 @@
+<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 653.9 247.6"><path d="M272 211l-53 12s-11-2-1-17l4-4 27-14v-2l-6-41-2-16 17-17 4-3 44 41v1l-19 33z" fill="#ffb7b7"/><path d="M253 198l-54 13a6 6 0 01-5-7 16 16 0 012-5 48 48 0 016-9l28-14-4-24-1-12-2-8-2-16 21-19 22 21 22 20-3 5-3 7-17 30-3 6z" fill="#ffb7b7"/><path d="M346 190s-20-1-28-15a24 24 0 01-3-14l-8-17-11-23-30-4-2 1-21 19-7 6-10 9-49 44a37 37 0 01-7 9 50 50 0 01-9 7c-10 5-24 9-44 7L10 248 0 176l89-29 131-86 89 23 41 58z" fill="#ffb7b7"/><path d="M648 0H275a5 5 0 00-5 5v221a5 5 0 005 6h373a5 5 0 006-6V5a5 5 0 00-6-5z" fill="#fff"/><path d="M648 0H275a5 5 0 00-5 5v221a5 5 0 005 6h373a5 5 0 006-6V5a5 5 0 00-6-5zm4 226a4 4 0 01-4 4H275a4 4 0 01-3-4V5a4 4 0 013-3h373a4 4 0 014 3z" fill="#3f3d56"/><path d="M312 30a9 9 0 119-9 9 9 0 01-9 9zm0-17a8 8 0 107 8 8 8 0 00-7-8z" fill="#6c63ff"/><path d="M297 21a8 8 0 016-8 8 8 0 100 16 8 8 0 01-6-8zM349 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM368 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM386 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM415 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM434 130a7 7 0 01-7-7v-20a7 7 0 0113 0v20a7 7 0 01-6 7zM452 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM481 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM499 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM518 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM546 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM565 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM583 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7z" fill="#6c63ff"/><path d="M396 208h-99a5 5 0 110-10h99a5 5 0 010 10zM364 188h-35a5 5 0 110-10h35a5 5 0 110 10z" fill="#e6e6e6"/><path fill="#3f3d56" d="M271 46h381v2H271z"/><path opacity=".1" d="M228 203l-1-2 33-15 8-27-12-10 1-1 13 10-8 30-34 15zM196 199l-9 4-17 2a50 50 0 01-9 7l-16-1-26-1 88-74 18 4-29 59z"/><path d="M318 175l-8 1-47 4-29 1-38 18-9 4-70 8 95-81 11 2 20 5 22 5 18 1 24 1 20 1a13 13 0 0112 13c0 7-5 14-21 17z" fill="#ffb7b7"/><path d="M325 170s-7-2-9-9c-2-4-1-9 3-15l1 1c-3 6-4 10-3 14 2 5 9 7 9 7zM197 197l34-16v2l-33 16zM218 135l48-19v2l-41 16 35 6v2l-42-7z" opacity=".1"/></svg>

src/components/dashboard/Dashboard.svelte

@@ -1,308 +1,327 @@
-<script>
+<script>
-  import { _ } from "svelte-i18n";
+  import { _ } from "svelte-i18n";
-  import localForage from "localforage";
+  import localForage from "localforage";
-  import store from "../../store";
+  import store from "../../store";
-  import { router } from "tinro";
+  import { router } from "tinro";
-  import NoComponentLoaded from "../base/NoComponentLoaded.svelte";
+  import NoComponentLoaded from "../base/NoComponentLoaded.svelte";
-  import { AuthService } from "@odit/lfk-client-js";
+  import { AuthService } from "@odit/lfk-client-js";
-  $: navOpen = false;
+  $: navOpen = false;
-  function logout() {
+  function logout() {
-    localForage.clear();
+    localForage.clear();
-    location.replace("/");
+    location.replace("/");
-  }
+  }
-</script>
+</script>
-
+
-<section class="min-h-screen bg-gray-50">
+<section class="min-h-screen bg-gray-50">
-  <nav
+  <nav
-    class:-translate-x-full={!navOpen}
+    class:-translate-x-full={!navOpen}
-    class:translate-x-0={navOpen}
+    class:translate-x-0={navOpen}
-    class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50">
+    class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50">
-    <a href="/" class="flex items-center px-4 py-5">
+    <a href="/" class="flex items-center px-4 py-5">
-      <img src="/lfk-logo.png" alt="Logo" class="h-10" />
+      <img src="/lfk-logo.png" alt="Logo" class="h-10" />
-      <h3 class="text-lg">Lauf für Kaya! Admin</h3>
+      <h3 class="text-lg">Lauf für Kaya! Admin</h3>
-    </a>
+    </a>
-    <nav class="text-sm font-medium text-gray-600" aria-label="Main Navigation">
+    <nav class="text-sm font-medium text-gray-600" aria-label="Main Navigation">
-      <a
+      <a
-        class:bg-gray-100={$router.path === '/'}
+        class:bg-gray-100={$router.path === '/'}
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        href="/">
+        href="/">
-        <svg
+        <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          xmlns="http://www.w3.org/2000/svg"
+          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 20 20"
+          viewBox="0 0 20 20"
-          fill="currentColor">
+          fill="currentColor">
-          <path
+          <path
-            d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z" />
+            d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z" />
-        </svg>
+        </svg>
-        <span>{$_('dashboard-title')}</span>
+        <span>{$_('dashboard-title')}</span>
-      </a>
+      </a>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('ORGANIZATION:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('ORGANIZATION:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/orgs/')}
+          class:bg-gray-100={$router.path.includes('/orgs/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/orgs/">
+          href="/orgs/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M17 19h2v-8h-6v8h2v-6h2v6zM3 19V4a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v5h2v10h1v2H2v-2h1zm4-8v2h2v-2H7zm0 4v2h2v-2H7zm0-8v2h2V7H7z" /></svg>
+              d="M17 19h2v-8h-6v8h2v-6h2v6zM3 19V4a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v5h2v10h1v2H2v-2h1zm4-8v2h2v-2H7zm0 4v2h2v-2H7zm0-8v2h2V7H7z" /></svg>
-          <span>{$_('orgs')}</span>
+          <span>{$_('orgs')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('USER:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('USER:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/users/'}
+          class:bg-gray-100={$router.path === '/users/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/users/">
+          href="/users/">
-          <svg
+          <svg
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M12 14v8H4a8 8 0 018-8zm0-1a6 6 0 110-12 6 6 0 010 12zm2.6 5.81a3.51 3.51 0 010-1.62l-1-.57 1-1.74 1 .58a3.5 3.5 0 011.4-.82V13.5h2v1.15a3.5 3.5 0 011.4.8l1-.57 1 1.74-1 .57a3.51 3.51 0 010 1.62l1 .57-1 1.74-1-.58a3.5 3.5 0 01-1.4.82v1.14h-2v-1.15a3.5 3.5 0 01-1.4-.8l-1 .57-1-1.74 1-.57zM18 17a1 1 0 100 2 1 1 0 000-2z" /></svg>
+              d="M12 14v8H4a8 8 0 018-8zm0-1a6 6 0 110-12 6 6 0 010 12zm2.6 5.81a3.51 3.51 0 010-1.62l-1-.57 1-1.74 1 .58a3.5 3.5 0 011.4-.82V13.5h2v1.15a3.5 3.5 0 011.4.8l1-.57 1 1.74-1 .57a3.51 3.51 0 010 1.62l1 .57-1 1.74-1-.58a3.5 3.5 0 01-1.4.82v1.14h-2v-1.15a3.5 3.5 0 01-1.4-.8l-1 .57-1-1.74 1-.57zM18 17a1 1 0 100 2 1 1 0 000-2z" /></svg>
-          <span>{$_('users')}</span>
+          <span>{$_('users')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/groups/'}
+          class:bg-gray-100={$router.path === '/groups/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/groups/">
+          href="/groups/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
+              d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-          <span>{$_('user-groups')}</span>
+          <span>{$_('user-groups')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/runners/'}
+          class:bg-gray-100={$router.path === '/runners/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/runners/">
+          href="/runners/">
-          <svg
+          <svg
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
+              d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
-          <span>{$_('runners')}</span>
+          <span>{$_('runners')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/teams/'}
+          class:bg-gray-100={$router.path === '/teams/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/teams/">
+          href="/teams/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
+              d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-          <span>{$_('teams')}</span>
+          <span>{$_('teams')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/donors/')}
+          class:bg-gray-100={$router.path.includes('/donors/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/donors/">
+          href="/donors/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
+              d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
-          <span>{$_('donors')}</span>
+          <span>{$_('donors')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/donations/')}
+          class:bg-gray-100={$router.path.includes('/donations/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/donations/">
+          href="/donations/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
+              d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
-          <span>{$_('donations')}</span>
+          <span>{$_('donations')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('TRACK:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('TRACK:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/tracks/'}
+          class:bg-gray-100={$router.path === '/tracks/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/tracks/">
+          href="/tracks/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M635.7 167.2L556.1 31.7c-8.8-15-28.3-20.1-43.5-11.5l-69 39.1L503.3 161c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L416 75l-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L333.2 122 278 153.3 337.8 255c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-59.7-101.7-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-27.9-47.5-55.2 31.3 59.7 101.7c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L84.9 262.9l-69 39.1C.7 310.7-4.6 329.8 4.2 344.8l79.6 135.6c8.8 15 28.3 20.1 43.5 11.5L624.1 210c15.2-8.6 20.4-27.8 11.6-42.8z" /></svg>
+              d="M635.7 167.2L556.1 31.7c-8.8-15-28.3-20.1-43.5-11.5l-69 39.1L503.3 161c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L416 75l-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L333.2 122 278 153.3 337.8 255c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-59.7-101.7-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-27.9-47.5-55.2 31.3 59.7 101.7c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L84.9 262.9l-69 39.1C.7 310.7-4.6 329.8 4.2 344.8l79.6 135.6c8.8 15 28.3 20.1 43.5 11.5L624.1 210c15.2-8.6 20.4-27.8 11.6-42.8z" /></svg>
-          <span>{$_('tracks')}</span>
+          <span>{$_('tracks')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('SCAN:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/scans/'}
+          class:bg-gray-100={$router.path === '/cards/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/scans/">
+          href="/cards/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+            viewBox="0 0 24 24">
-            <path
+            <path fill="none" d="M0 0h24v24H0z" />
-              fill="currentColor"
+            <path
-              d="M2 4h2v16H2V4zm4 0h1v16H6V4zm2 0h2v16H8V4zm3 0h2v16h-2V4zm3 0h2v16h-2V4zm3 0h1v16h-1V4zm2 0h3v16h-3V4z" /></svg>
+              fill="currentColor"
-          <span>Scans</span>
+              d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
-        </a>
+          <span>{$_('cards')}</span>
-      {/if}
+        </a>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('CONTACT:GET')}
+      {/if}
-        <a
+      {#if store.state.jwtinfo.userdetails.permissions.includes('SCAN:GET')}
-          class:bg-gray-100={$router.path === '/contacts/'}
+        <a
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class:bg-gray-100={$router.path === '/scans/'}
-          href="/contacts/">
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          <svg
+          href="/scans/">
-            fill="currentColor"
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            xmlns="http://www.w3.org/2000/svg"
+            fill="currentColor"
-            viewBox="0 0 24 24"
+            width="24"
-            width="24"
+            height="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            xmlns="http://www.w3.org/2000/svg"
-            <path
+            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-              d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
+            <path
-          <span>{$_('contacts')}</span>
+              fill="currentColor"
-        </a>
+              d="M2 4h2v16H2V4zm4 0h1v16H6V4zm2 0h2v16H8V4zm3 0h2v16h-2V4zm3 0h2v16h-2V4zm3 0h1v16h-1V4zm2 0h3v16h-3V4z" /></svg>
-      {/if}
+          <span>Scans</span>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('STATION:GET')}
+        </a>
-        <a
+      {/if}
-          class:bg-gray-100={$router.path === '/scanstations/'}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('CONTACT:GET')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+        <a
-          href="/scanstations/">
+          class:bg-gray-100={$router.path === '/contacts/'}
-          <svg
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          href="/contacts/">
-            fill="currentColor"
+          <svg
-            width="24"
+            fill="currentColor"
-            height="24"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            viewBox="0 0 24 24"
+            xmlns="http://www.w3.org/2000/svg"
-            xmlns="http://www.w3.org/2000/svg"><path
+            viewBox="0 0 24 24"
-              fill="none"
+            width="24"
-              d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              fill="currentColor"
+              d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
-              d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
+          <span>{$_('contacts')}</span>
-          <span>{$_('scanstations')}</span>
+        </a>
-        </a>
+      {/if}
-      {/if}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('STATION:GET')}
-      <a
+        <a
-        class:bg-gray-100={$router.path === '/settings/'}
+          class:bg-gray-100={$router.path === '/scanstations/'}
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        href="/settings/">
+          href="/scanstations/">
-        <svg
+          <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          xmlns="http://www.w3.org/2000/svg"
+            fill="currentColor"
-          viewBox="0 0 20 20"
+            width="24"
-          fill="currentColor">
+            height="24"
-          <path
+            viewBox="0 0 24 24"
-            fill-rule="evenodd"
+            xmlns="http://www.w3.org/2000/svg"><path
-            d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
+              fill="none"
-            clip-rule="evenodd" />
+              d="M0 0h24v24H0z" />
-        </svg>
+            <path
-        <span>{$_('settings')}</span>
+              fill="currentColor"
-      </a>
+              d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
-      <a
+          <span>{$_('scanstations')}</span>
-        class:bg-gray-100={$router.path === '/about/'}
+        </a>
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+      {/if}
-        href="/about/">
+      <a
-        <svg
+        class:bg-gray-100={$router.path === '/settings/'}
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          xmlns="http://www.w3.org/2000/svg"
+        href="/settings/">
-          fill="none"
+        <svg
-          stroke="currentColor"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          stroke-width="2"
+          xmlns="http://www.w3.org/2000/svg"
-          stroke-linecap="round"
+          viewBox="0 0 20 20"
-          stroke-linejoin="round"
+          fill="currentColor">
-          viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" />
+          <path
-          <path d="M12 16v-4M12 8h.01" /></svg>
+            fill-rule="evenodd"
-        <span>{$_('about')}</span>
+            d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
-      </a>
+            clip-rule="evenodd" />
-      <span
+        </svg>
-        tabindex="0"
+        <span>{$_('settings')}</span>
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+      </a>
-        on:click={() => {
+      <a
-          AuthService.authControllerLogout();
+        class:bg-gray-100={$router.path === '/about/'}
-          logout();
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        }}>
+        href="/about/">
-        <svg
+        <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          fill="currentColor"
+          xmlns="http://www.w3.org/2000/svg"
-          width="24"
+          fill="none"
-          height="24"
+          stroke="currentColor"
-          xmlns="http://www.w3.org/2000/svg"
+          stroke-width="2"
-          viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+          stroke-linecap="round"
-          <path
+          stroke-linejoin="round"
-            d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2a9.985 9.985 0 0 1 8 4h-2.71a8 8 0 1 0 .001 12h2.71A9.985 9.985 0 0 1 12 22zm7-6v-3h-8v-2h8V8l5 4-5 4z" /></svg>
+          viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" />
-        <span>{$_('logout')}</span>
+          <path d="M12 16v-4M12 8h.01" /></svg>
-      </span>
+        <span>{$_('about')}</span>
-    </nav>
+      </a>
-  </nav>
+      <span
-  <div class="ml-0 transition md:ml-60">
+        tabindex="0"
-    <header
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-      on:click={() => {
+        on:click={() => {
-        navOpen = true;
+          AuthService.authControllerLogout();
-      }}
+          logout();
-      class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
+        }}>
-      <button class="block btn btn-light md:hidden">
+        <svg
-        <span class="sr-only">Menu</span><svg
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          class="w-4 h-4"
+          fill="currentColor"
-          xmlns="http://www.w3.org/2000/svg"
+          width="24"
-          viewBox="0 0 20 20"
+          height="24"
-          fill="currentcolor"><path
+          xmlns="http://www.w3.org/2000/svg"
-            fill-rule="evenodd"
+          viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-            d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
+          <path
-            clip-rule="evenodd" /></svg></button>
+            d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2a9.985 9.985 0 0 1 8 4h-2.71a8 8 0 1 0 .001 12h2.71A9.985 9.985 0 0 1 12 22zm7-6v-3h-8v-2h8V8l5 4-5 4z" /></svg>
-    </header>
+        <span>{$_('logout')}</span>
-    <slot>
+      </span>
-      <NoComponentLoaded />
+    </nav>
-    </slot>
+  </nav>
-  </div>
+  <div class="ml-0 transition md:ml-60">
-  <div
+    <header
-    on:click={() => {
+      on:click={() => {
-      navOpen = false;
+        navOpen = true;
-    }}
+      }}
-    class:hidden={!navOpen}
+      class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
-    class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" />
+      <button class="block btn btn-light md:hidden">
-</section>
+        <span class="sr-only">Menu</span><svg
+          class="w-4 h-4"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 20 20"
+          fill="currentcolor"><path
+            fill-rule="evenodd"
+            d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
+            clip-rule="evenodd" /></svg></button>
+    </header>
+    <slot>
+      <NoComponentLoaded />
+    </slot>
+  </div>
+  <div
+    on:click={() => {
+      navOpen = false;
+    }}
+    class:hidden={!navOpen}
+    class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" />
+</section>

src/components/donations/DonationsOverview.svelte

@@ -74,20 +74,12 @@
                 .toLowerCase()
                 .includes(
                   searchvalue.toLowerCase()
-                ) || donation.donor.middlename
+                ) ||  donation.donor.lastname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donation.donor.lastname
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()
                   ) || donation.runner?.firstname
                   .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donation.runner?.middlename
-                  .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()
                   ) || donation.runner?.lastname

src/components/donors/DonorsOverview.svelte

@@ -88,11 +88,7 @@
                 .toLowerCase()
                 .includes(
                   searchvalue.toLowerCase()
-                ) || donor.middlename
+                ) ||  donor.lastname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donor.lastname
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()

src/components/general/Imprint.svelte

@@ -6,13 +6,15 @@
   let html = "";
   async function load() {
     let md = await fetch("/imprint_" + getLocaleFromNavigator() + ".md");
-    if((await md.text()).includes("<meta")){
+    let text = (await md.text()).toString();
+    if(text.includes("<meta")){
       md.ok=false
     }
     if (!md.ok) {
       md = await fetch("/imprint_en.md");
+      text = await md.text();
     }
-    html = marked(await md.text());
+    html = marked(text);
   }
   const promise = load();
 </script>

src/components/general/Privacy.svelte

@@ -6,13 +6,15 @@
   let html = "";
   async function load() {
     let md = await fetch("/privacy_" + getLocaleFromNavigator() + ".md");
-    if((await md.text()).includes("<meta")){
+    let text = (await md.text()).toString();
+    if(text.includes("<meta")){
       md.ok=false
     }
     if (!md.ok) {
       md = await fetch("/privacy_en.md");
+      text = await md.text();
     }
-    html = marked(await md.text());
+    html = marked(text);
   }
   const promise = load();
 </script>

src/components/orgs/OrgDetail.svelte

@@ -10,6 +10,9 @@
   import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
   import PromiseError from "../base/PromiseError.svelte";
   import Select from "svelte-select";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
+  import { tick } from "svelte";
   $: delete_triggered = false;
   $: address_valid_or_none =
     (isAddress1Valid && iszipcodevalid && iscityvalid) ||
@@ -18,6 +21,9 @@
   let original = "";
   let original_object = {};
   let contacts = [];
+  let valueCopy = null;
+  let areaDom;
+  let copied = false;
   export let params;
   $: editable = {};
   $: contact = {};
@@ -26,7 +32,10 @@
   $: isAddress1Valid = editable.address?.address1?.trim().length !== 0;
   $: iszipcodevalid = editable.address?.postalcode?.trim().length !== 0;
   $: iscityvalid = editable.address?.city?.trim().length !== 0;
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = true;
+  $: cards_show = true;
+  $: generate_orgs = [original_object];
+  $: registrationLink = `${config.baseurl}/selfservice/register/${editable.registrationKey}`;
   const getContactLabel = (option) =>
     option.firstname + " " + (option.middlename || "") + " " + option.lastname;
   const promise = RunnerOrganizationService.runnerOrganizationControllerGetOne(
@@ -60,14 +69,6 @@
   });
   let modal_open = false;
   let delete_org = {};
-  document.addEventListener("click", function (e) {
-    if (
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-    ) {
-      sponsoring_contracts_download_open = false;
-    }
-  });
   function deleteOrganization() {
     RunnerOrganizationService.runnerOrganizationControllerRemove(
       original_object.id,
@@ -102,6 +103,7 @@
         postdata
       )
         .then((resp) => {
+          editable.registrationKey = resp.registrationKey;
           original_object = Object.assign({}, editable);
           original = JSON.stringify(original_object);
           Toastify({
@@ -114,58 +116,46 @@
     } else {
     }
   }
-  export let import_modal_open = false;
+  async function copy() {
-  async function generateSponsoringContract(locale) {
+    if(!editable.registrationKey){
-    sponsoring_contracts_download_open = false;
+      Toastify({
-    const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+        text: $_('you-have-to-save-your-changes-to-generate-a-link'),
-      original_object.id
+        duration: 500,
-    );
+        backgroundColor:
-    const toast = Toastify({
+          "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-      text: $_("generating-pdf"),
+      }).showToast();
-      duration: -1,
+      return;
-    }).showToast();
+    }
-    fetch(
+    valueCopy = registrationLink;
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+    await tick();
-      {
+    areaDom.focus();
-        method: "POST",
+    areaDom.select();
-        headers: {
+    try {
-          "Content-Type": "application/json",
+      const successful = document.execCommand("copy");
-        },
+      if (!successful) {
-        body: JSON.stringify(runners),
+        throw new Error();
       }
-    )
+      Toastify({
-      .then((response) => {
+        text: $_("copied-link-to-clipboard"),
-        if (response.status != "200") {
+        duration: 500,
-          toast.hideToast();
+        backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-          Toastify({
+      }).showToast();
-            text: $_("pdf-generation-failed"),
+      copied = true;
-            duration: 3500,
+    } catch (err) {
-            backgroundColor:
+      Toastify({
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+        text: $_("error-whyile-copying-to-clipboard"),
-          }).showToast();
+        duration: 500,
-        } else {
+        backgroundColor:
-          return response.blob();
+          "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-        }
+      }).showToast();
-      })
+    }
-      .then((blob) => {
+    // we can notifi by event or storage about copy status
-        const url = window.URL.createObjectURL(blob);
+    valueCopy = null;
-        let a = document.createElement("a");
-        a.href = url;
-        a.download = "Sponsorings_" + original_object.name + ".pdf";
-        document.body.appendChild(a);
-        a.click();
-        a.remove();
-        toast.hideToast();
-        Toastify({
-          text: $_("pdf-successfully-generated"),
-          duration: 3500,
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-        }).showToast();
-      })
-      .catch((err) => {});
   }
+  export let import_modal_open = false;
 </script>
 
+{#if valueCopy != null}<textarea bind:this={areaDom}>{valueCopy}</textarea>{/if}
 <ImportRunnerModal
   on:cancelDelete={(event) => {
     import_modal_open = false;
@@ -182,64 +172,10 @@
     <div class="mb-8 text-3xl font-extrabold leading-tight">
       {original_object.name}
       <span data-id="org_actions_${editable.id}">
-        <div id="sponsoring:dropdown" class="relative inline-block">
+        <GenerateSponsoringContracts
-          <div>
+          bind:sponsoring_contracts_show
-            <button
+          bind:generate_orgs />
-              on:click={() => {
+        <GenerateRunnerCards bind:cards_show bind:generate_orgs />
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
-              }}
-              type="button"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-              id="options-menu"
-              aria-haspopup="true"
-              aria-expanded="true">
-              {$_('generate-sponsoring-contracts')}
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="24"
-                height="24"
-                viewBox="0 0 24 24"
-                class="-mr-1 ml-2 h-5 w-5"><path
-                  fill="none"
-                  d="M0 0h24v24H0z" />
-                <path
-                  fill="currentColor"
-                  d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
-            </button>
-          </div>
-          {#if sponsoring_contracts_download_open}
-            <div
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-              id="sponsoring:dropdown:menu">
-              <div
-                class="py-1"
-                role="menu"
-                aria-orientation="vertical"
-                aria-labelledby="options-menu">
-                <span
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('de');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('german')}
-                </button>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('en');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('english')}
-                </button>
-              </div>
-            </div>
-          {/if}
-        </div>
         {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
           <button
             on:click={() => {
@@ -382,99 +318,151 @@
         on:select={(selectedValue) => (editable.contact = selectedValue.detail.value)}
         on:clear={() => (editable.contact = null)} />
     </div>
-    <!--  -->
+    <div>
-    <div class="flex items-start mt-2">
+      <div class="flex items-start mt-2">
-      <div class="flex items-center h-5">
+        <div class="flex items-center h-5">
-        <input
+          <input
-          bind:checked={editable.address_checked}
+            bind:checked={editable.registrationEnabled}
-          id="comments"
+            id="comments"
-          name="comments"
+            name="comments"
-          type="checkbox"
+            type="checkbox"
-          class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+            class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+        </div>
+        <div class="ml-3 text-sm">
+          <label
+            for="comments"
+            class="font-medium text-gray-700">{$_('selfservice-registration')}</label>
+        </div>
       </div>
-      <div class="ml-3 text-sm">
+      <div>
-        <label
+        {#if editable.registrationEnabled}
-          for="comments"
+          <div class="text-sm w-full">
-          class="font-medium text-gray-700">{$_('address')}</label>
+            <div on:click={copy} class="inline-flex w-full">
+              <p
+                name="token"
+                class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2">
+                {#if editable.registrationKey}
+                {registrationLink}
+                {:else}
+                {$_('you-have-to-save-your-changes-to-generate-a-link')}
+                {/if}
+              </p>
+              <div
+                class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  height="24"><path fill="none" d="M0 0h24v24H0z" />
+                  <path
+                    fill="currentColor"
+                    d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
+              </div>
+            </div>
+            {#if editable.registrationKey}
+            <p class="text-gray-500 text-xs">
+              {$_('click-to-copy-the-link-into-your-clipboard')}
+            </p>
+            {/if}
+          </div>
+        {/if}
+        <!--  -->
+        <div>
+          <div class="flex items-start mt-2">
+            <div class="flex items-center h-5">
+              <input
+                bind:checked={editable.address_checked}
+                id="comments"
+                name="comments"
+                type="checkbox"
+                class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+            </div>
+            <div class="ml-3 text-sm">
+              <label
+                for="comments"
+                class="font-medium text-gray-700">{$_('address')}</label>
+            </div>
+          </div>
+        </div>
+        {#if editable.address_checked === true}
+          <div class="col-span-6">
+            <label
+              for="address1"
+              class="block text-sm font-medium text-gray-700">{$_('address')}</label>
+            <input
+              autocomplete="off"
+              placeholder="Address"
+              class:border-red-500={!isAddress1Valid}
+              class:focus:border-red-500={!isAddress1Valid}
+              class:focus:ring-red-500={!isAddress1Valid}
+              bind:value={editable.address.address1}
+              type="text"
+              name="address1"
+              class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+            {#if !isAddress1Valid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('address-is-required')}
+              </span>
+            {/if}
+          </div>
+          <div class="col-span-6">
+            <label
+              for="address2"
+              class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('apartment-suite-etc')}
+              bind:value={editable.address.address2}
+              type="text"
+              name="address2"
+              class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+          </div>
+          <div class="col-span-6">
+            <label
+              for="zipcode"
+              class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('zip-postal-code')}
+              class:border-red-500={!iszipcodevalid}
+              class:focus:border-red-500={!iszipcodevalid}
+              class:focus:ring-red-500={!iszipcodevalid}
+              bind:value={editable.address.postalcode}
+              type="text"
+              name="zipcode"
+              class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+            {#if !iszipcodevalid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('valid-zipcode-postal-code-is-required')}
+              </span>
+            {/if}
+          </div>
+          <div class="col-span-6">
+            <label
+              for="city"
+              class="block text-sm font-medium text-gray-700">{$_('city')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('city')}
+              class:border-red-500={!iscityvalid}
+              class:focus:border-red-500={!iscityvalid}
+              class:focus:ring-red-500={!iscityvalid}
+              bind:value={editable.address.city}
+              type="text"
+              name="city"
+              class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+            {#if !iscityvalid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('valid-city-is-required')}
+              </span>
+            {/if}
+          </div>
+        {/if}
       </div>
     </div>
-    {#if editable.address_checked === true}
-      <div class="col-span-6">
-        <label
-          for="address1"
-          class="block text-sm font-medium text-gray-700">{$_('address')}</label>
-        <input
-          autocomplete="off"
-          placeholder="Address"
-          class:border-red-500={!isAddress1Valid}
-          class:focus:border-red-500={!isAddress1Valid}
-          class:focus:ring-red-500={!isAddress1Valid}
-          bind:value={editable.address.address1}
-          type="text"
-          name="address1"
-          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-        {#if !isAddress1Valid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('address-is-required')}
-          </span>
-        {/if}
-      </div>
-      <div class="col-span-6">
-        <label
-          for="address2"
-          class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('apartment-suite-etc')}
-          bind:value={editable.address.address2}
-          type="text"
-          name="address2"
-          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-      </div>
-      <div class="col-span-6">
-        <label
-          for="zipcode"
-          class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('zip-postal-code')}
-          class:border-red-500={!iszipcodevalid}
-          class:focus:border-red-500={!iszipcodevalid}
-          class:focus:ring-red-500={!iszipcodevalid}
-          bind:value={editable.address.postalcode}
-          type="text"
-          name="zipcode"
-          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-        {#if !iszipcodevalid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('valid-zipcode-postal-code-is-required')}
-          </span>
-        {/if}
-      </div>
-      <div class="col-span-6">
-        <label
-          for="city"
-          class="block text-sm font-medium text-gray-700">{$_('city')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('city')}
-          class:border-red-500={!iscityvalid}
-          class:focus:border-red-500={!iscityvalid}
-          class:focus:ring-red-500={!iscityvalid}
-          bind:value={editable.address.city}
-          type="text"
-          name="city"
-          class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-        {#if !iscityvalid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('valid-city-is-required')}
-          </span>
-        {/if}
-      </div>
-    {/if}
   </section>
 {:else}
   {#await promise}

src/components/orgs/OrgOverview.svelte

@@ -1,5 +1,6 @@
 <script>
   import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
   let modal_open = false;
   let delete_org = {};
   import { RunnerOrganizationService } from "@odit/lfk-client-js";
@@ -7,9 +8,12 @@
   import OrgsEmptyState from "./OrgsEmptyState.svelte";
   import Toastify from "toastify-js";
   import ConfirmOrgDeletion from "./ConfirmOrgDeletion.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
   $: searchvalue = "";
   $: active_deletes = [];
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = current_organizations.some((r) => r.is_selected === true);
+  $: cards_show = current_organizations.some((r) => r.is_selected === true);
+  $: generate_orgs = current_organizations.filter((r) => r.is_selected === true);
   export let current_organizations = [];
 
   const promise = RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
@@ -17,72 +21,6 @@
       current_organizations = val;
     }
   );
-
-  document.addEventListener("click", function (e) {
-    if (
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-    ) {
-      sponsoring_contracts_download_open = false;
-    }
-  });
-
-  async function generateSponsoringContract(locale) {
-    sponsoring_contracts_download_open = false;
-    const orgs = current_organizations.filter((r) => r.is_selected === true);
-    const toast = Toastify({
-      text: $_("generating-pdfs"),
-      duration: -1,
-    }).showToast();
-    let count = 0;
-    for await (const o of orgs) {
-      const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
-        o.id
-      );
-      fetch(
-        `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify(runners),
-        }
-      )
-        .then((response) => {
-          if (response.status != "200") {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdf-generation-failed"),
-              duration: 3500,
-              backgroundColor:
-                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-            }).showToast();
-          } else {
-            return response.blob();
-          }
-        })
-        .then((blob) => {
-          count++;
-          const url = window.URL.createObjectURL(blob);
-          let a = document.createElement("a");
-          a.href = url;
-          a.download = "Sponsorings_" + o.name + ".pdf";
-          document.body.appendChild(a);
-          a.click();
-          a.remove();
-          if (count === orgs.length) {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdfs-successfully-generated"),
-              duration: 3500,
-              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            }).showToast();
-          }
-        })
-        .catch((err) => {});
-    }
-  }
 </script>
 
 <ConfirmOrgDeletion
@@ -111,56 +49,12 @@
         aria-label={$_('datatable.search')}
         class="gridjs-input gridjs-search-input mb-4" />
       <div class="h-12">
-        {#if current_organizations.some((r) => r.is_selected === true)}
+        <GenerateSponsoringContracts
-        <div id="sponsoring:dropdown" class="relative inline-block">
+            bind:sponsoring_contracts_show
-          <div>
+            bind:generate_orgs />
-            <button
+        <GenerateRunnerCards
-              on:click={() => {
+            bind:cards_show
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+            bind:generate_orgs />
-              }}
-              type="button"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-              id="options-menu"
-              aria-haspopup="true"
-              aria-expanded="true">
-              {$_('generate-sponsoring-contracts')}
-              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="-mr-1 ml-2 h-5 w-5"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z"/></svg>
-            </button>
-          </div>
-          {#if sponsoring_contracts_download_open}
-            <div
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-              id="sponsoring:dropdown:menu">
-              <div
-                class="py-1"
-                role="menu"
-                aria-orientation="vertical"
-                aria-labelledby="options-menu">
-                <span
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('de');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('german')}
-                </button>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('en');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('english')}
-                </button>
-              </div>
-            </div>
-          {/if}
-        </div>
-        {/if}
       </div>
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">

src/components/pdf_generation/GenerateRunnerCards.svelte

@@ -0,0 +1,339 @@
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import {
+        RunnerCardService,
+        RunnerOrganizationService,
+        RunnerTeamService,
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let cards_show = false;
+    export let generate_cards = [];
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: cards_dropdown_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "cards:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "cards:dropdown:menu"
+        ) {
+            cards_dropdown_open = false;
+        }
+    });
+
+    function generateRunnerCards(locale) {
+        cards_dropdown_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgCards(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamCards(locale);
+        } else if (generate_runners.length > 0) {
+            generateRunnersCards(locale);
+        } else {
+            generateCards(locale);
+        }
+    }
+
+    function generateCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        fetch(
+            `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(generate_cards),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Runnercards.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {
+                console.error(err);
+            });
+    }
+
+    async function generateRunnersCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        let cards = [];
+        for (let runner of generate_runners) {
+            let card = current_cards.find((c) => c.runner?.id == runner.id);
+            if (!card) {
+                card = await RunnerCardService.runnerCardControllerPost({
+                    runner: runner.id,
+                });
+            }
+            cards.push(card);
+        }
+        fetch(
+            `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(cards),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Runnercards.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {});
+    }
+
+    async function generateTeamCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        for (const t of generate_teams) {
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+            );
+            let cards = [];
+            for (let runner of runners) {
+                let card = current_cards.find((c) => c.runner?.id == runner.id);
+                if (!card) {
+                    card = await RunnerCardService.runnerCardControllerPost({
+                        runner: runner.id,
+                    });
+                }
+                cards.push(card);
+            }
+            fetch(
+                `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(cards),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            let cards = [];
+            for (let runner of runners) {
+                let card = current_cards.find((c) => c.runner?.id == runner.id);
+                if (!card) {
+                    card = await RunnerCardService.runnerCardControllerPost({
+                        runner: runner.id,
+                    });
+                }
+                cards.push(card);
+            }
+            fetch(
+                `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(cards),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+</script>
+
+{#if cards_show}
+    <div id="cards:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    cards_dropdown_open = !cards_dropdown_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-runnercards')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if cards_dropdown_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="cards:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateRunnerCards('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateRunnerCards('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/pdf_generation/GenerateRunnerCertificates.svelte

@@ -0,0 +1,273 @@
+<script>
+    import { _ } from "svelte-i18n";
+    import {
+        DonationService,
+        RunnerTeamService,
+        RunnerOrganizationService
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let certificates_show = false;
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: certificates_dropdown_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "certificates:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "certificates:dropdown:menu"
+        ) {
+            certificates_dropdown_open = false;
+        }
+    });
+
+    function generateCertificates(locale) {
+        certificates_dropdown_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgCertificates(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamCertificates(locale);
+        } else {
+            generateRunnerCertificates(locale);
+        }
+    }
+
+    async function generateRunnerCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        const current_donations = await DonationService.donationControllerGetAll();
+        let certificateRunners = [];
+        for (let runner of generate_runners) {
+            runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+            certificateRunners.push(runner);
+        }
+        fetch(
+            `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(certificateRunners),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Certificates.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {});
+    }
+
+    async function generateTeamCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_donations = await DonationService.donationControllerGetAll();
+        for (const t of generate_teams) {
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+                );
+            let certificateRunners = [];
+            for (let runner of runners) {
+                runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+                certificateRunners.push(runner);
+            }
+            console.log(certificateRunners)
+            fetch(
+                `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(certificateRunners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Certificates_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_donations = await DonationService.donationControllerGetAll();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            let certificateRunners = [];
+            for (let runner of runners) {
+                runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+                certificateRunners.push(runner);
+            }
+            fetch(
+                `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(certificateRunners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Certificates_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+</script>
+
+{#if certificates_show}
+    <div id="certificates:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    certificates_dropdown_open = !certificates_dropdown_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-runner-certificates')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if certificates_dropdown_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="certificates:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateCertificates('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateCertificates('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/pdf_generation/GenerateSponsoringContracts.svelte

@@ -0,0 +1,254 @@
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import {
+        RunnerOrganizationService,
+        RunnerTeamService,
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let sponsoring_contracts_show = false;
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: sponsoring_contracts_download_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+        ) {
+            sponsoring_contracts_download_open = false;
+        }
+    });
+
+    function generateSponsoringContract(locale) {
+        sponsoring_contracts_download_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgContracts(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamContracts(locale);
+        } else {
+            generateRunnerContracts(locale);
+        }
+    }
+
+    async function generateTeamContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        for (const t of generate_teams) {
+            count++;
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+            );
+            fetch(
+                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(runners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            fetch(
+                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(runners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    function generateRunnerContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        fetch(
+            `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(generate_runners),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Sponsoring.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {
+                console.error(err);
+            });
+    }
+</script>
+
+{#if sponsoring_contracts_show}
+    <div id="sponsoring:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-sponsoring-contracts')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if sponsoring_contracts_download_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="sponsoring:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateSponsoringContract('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateSponsoringContract('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/runners/ImportRunnerModal.svelte

@@ -19,6 +19,11 @@
   export let current_runners;
   export let import_modal_open;
   $: searchvalue = "";
+  $: importButtonEnabled =
+    recent_processed &&
+    (!(selected_org_or_team == "" || selected_org_or_team == null) ||
+      !(passed_org?.id == null || passed_org?.id == 0) ||
+      !(passed_team?.id == null || passed_team?.id == 0));
   const dispatch = createEventDispatcher();
   function cancelModal() {
     json_output = [];
@@ -44,7 +49,10 @@
     groups = groups.concat(orgs);
     RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
       const teams = val.map((r) => {
-        return { label: `${r.parentGroup.name} > ${r.name}`, value: `TEAM_${r.id}` };
+        return {
+          label: `${r.parentGroup.name} > ${r.name}`,
+          value: `TEAM_${r.id}`,
+        };
       });
       groups = groups.concat(teams);
     });
@@ -120,6 +128,13 @@
           .catch((err) => {
             toast.hideToast();
             recent_processed = true;
+            Toastify({
+              text: $_("error-during-import"),
+              duration: 500,
+              backgroundColor:
+                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            }).showToast();
+            cancelModal();
           });
       }
       if (opened_from === "TeamDetail") {
@@ -137,6 +152,13 @@
           .catch((err) => {
             toast.hideToast();
             recent_processed = true;
+            Toastify({
+              text: $_("error-during-import"),
+              duration: 500,
+              backgroundColor:
+                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            }).showToast();
+            cancelModal();
           });
       }
       if (opened_from === "RunnerOverview") {
@@ -160,6 +182,13 @@
             .catch((err) => {
               toast.hideToast();
               recent_processed = true;
+              Toastify({
+                text: $_("error-during-import"),
+                duration: 500,
+                backgroundColor:
+                  "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+              }).showToast();
+              cancelModal();
             });
         }
         if (selected_org_or_team.includes("TEAM_")) {
@@ -182,6 +211,13 @@
             .catch((err) => {
               toast.hideToast();
               recent_processed = true;
+              Toastify({
+                text: $_("error-during-import"),
+                duration: 500,
+                backgroundColor:
+                  "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+              }).showToast();
+              cancelModal();
             });
         }
       }
@@ -195,7 +231,7 @@
     use:focusTrap
     use:clickOutside
     on:click_outside={() => {
-      import_modal_open = false;
+      cancelModal();
     }}>
     <div
       class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
@@ -349,6 +385,8 @@
                   </table>
                 </div>
                 <button
+                  disabled={!importButtonEnabled}
+                  class:opacity-50={!importButtonEnabled}
                   on:click={importAction}
                   type="button"
                   class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">

src/components/runners/RunnerDetail.svelte

@@ -1,398 +1,302 @@
-<script>
+<script>
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import store from "../../store";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-  import {
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-    RunnerService,
+  import GenerateRunnerCertificates from "../pdf_generation/GenerateRunnerCertificates.svelte";
-    RunnerTeamService,
+  import store from "../../store";
-    RunnerOrganizationService,
+  import {
-  } from "@odit/lfk-client-js";
+    RunnerService,
-  import Toastify from "toastify-js";
+    RunnerTeamService,
-  import PromiseError from "../base/PromiseError.svelte";
+    RunnerOrganizationService,
-  import isEmail from "validator/es/lib/isEmail";
+  } from "@odit/lfk-client-js";
-  import Select from "svelte-select";
+  import Toastify from "toastify-js";
-  let data_loaded = false;
+  import PromiseError from "../base/PromiseError.svelte";
-  export let params;
+  import isEmail from "validator/es/lib/isEmail";
-  const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
+  import Select from "svelte-select";
-  $: delete_triggered = false;
+  let data_loaded = false;
-  $: sponsoring_contracts_download_open = false;
+  export let params;
-  $: original_data_pdf = {};
+  const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
-  $: original_data = {};
+  $: delete_triggered = false;
-  $: editable = {};
+  $: original_data_pdf = {};
-  $: group = {}
+  $: original_data = {};
-  $: changes_performed = !(JSON.stringify(original_data) == JSON.stringify(editable));
+  $: editable = {};
-  $: isEmailValid =
+  $: group = {};
-    (editable.email || "") === "" ||
+  $: changes_performed = !(
-    (editable.email && isEmail(editable.email || ""));
+    JSON.stringify(original_data) == JSON.stringify(editable)
-  $: isFirstnameValid = editable.firstname !== "";
+  );
-  $: isLastnameValid = editable.lastname !== "";
+  $: isEmailValid =
-  $: save_enabled =
+    (editable.email || "") === "" ||
-    changes_performed &&
+    (editable.email && isEmail(editable.email || ""));
-    isFirstnameValid &&
+  $: isFirstnameValid = editable.firstname !== "";
-    isLastnameValid &&
+  $: isLastnameValid = editable.lastname !== "";
-    isEmailValid &&
+  $: save_enabled =
-    editable.group != null;
+    changes_performed &&
-  runner_promise.then((data) => {
+    isFirstnameValid &&
-    data_loaded = true;
+    isLastnameValid &&
-    original_data_pdf = Object.assign(original_data_pdf, data);
+    isEmailValid &&
-    data.group = data.group.id;
+    editable.group != null;
-    original_data = Object.assign(original_data, data);
+  $: sponsoring_contracts_show = true;
-    editable = Object.assign(editable, original_data);
+  $: cards_show = true;
-
+  $: certificates_show = true;
-    RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+  $: generate_runners = [original_data_pdf];
-      const orgs = val.map((r) => {
+  runner_promise.then((data) => {
-        return { label: r.name, value: r };
+    data_loaded = true;
-      });
+    original_data_pdf = Object.assign(original_data_pdf, data);
-      groups = groups.concat(orgs);
+    data.group = data.group.id;
-      RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
+    original_data = Object.assign(original_data, data);
-        const teams = val.map((r) => {
+    editable = Object.assign(editable, original_data);
-          return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
+
-        });
+    RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
-        groups = groups.concat(teams);
+      (val) => {
-        group = groups.find(g => g.value.id == editable.group)
+        const orgs = val.map((r) => {
-      });
+          return { label: r.name, value: r };
-    });
+        });
-  });
+        groups = groups.concat(orgs);
-  document.addEventListener("click", function (e) {
+        RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
-    if (
+          const teams = val.map((r) => {
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+            return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+          });
-    ) {
+          groups = groups.concat(teams);
-      sponsoring_contracts_download_open = false;
+          group = groups.find((g) => g.value.id == editable.group);
-    }
+        });
-  });
+      }
-  let groups = [];
+    );
-  function submit() {
+  });
-    if (data_loaded === true && save_enabled) {
+  let groups = [];
-      Toastify({
+  function submit() {
-        text: $_("updating-runner"),
+    if (data_loaded === true && save_enabled) {
-        duration: 2500,
+      Toastify({
-      }).showToast();
+        text: $_("updating-runner"),
-      let postdata = {};
+        duration: 2500,
-      postdata = Object.assign(postdata, editable);
+      }).showToast();
-      RunnerService.runnerControllerPut(original_data.id, postdata)
+      let postdata = {};
-        .then((resp) => {
+      postdata = Object.assign(postdata, editable);
-          Object.assign(original_data, editable);
+      RunnerService.runnerControllerPut(original_data.id, postdata)
-          original_data = original_data;
+        .then((resp) => {
-          Toastify({
+          Object.assign(original_data, editable);
-            text: $_("runner-updated"),
+          original_data = original_data;
-            duration: 2500,
+          Toastify({
-            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+            text: $_("runner-updated"),
-          }).showToast();
+            duration: 2500,
-        })
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-        .catch((err) => {});
+          }).showToast();
-    } else {
+        })
-    }
+        .catch((err) => {});
-  }
+    } else {
-  function deleteRunner() {
+    }
-    RunnerService.runnerControllerRemove(original_data.id, true)
+  }
-      .then((resp) => {
+  function deleteRunner() {
-        location.replace("./");
+    RunnerService.runnerControllerRemove(original_data.id, true)
-      })
+      .then((resp) => {
-      .catch((err) => {});
+        location.replace("./");
-  }
+      })
-  function generateSponsoringContract(locale) {
+      .catch((err) => {});
-    sponsoring_contracts_download_open = false;
+  }
-    const toast = Toastify({
+</script>
-      text: $_("generating-pdf"),
+
-      duration: -1,
+{#await runner_promise}
-    }).showToast();
+  {$_('loading-runners')}
-    fetch(
+{:then}
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+  <section class="container p-5 select-none">
-      {
+    <div class="flex flex-row mb-4">
-        method: "POST",
+      <div class="w-full">
-        headers: {
+        <nav class="w-full flex">
-          "Content-Type": "application/json",
+          <ol class="list-none flex flex-row items-center justify-start">
-        },
+            <li class="flex items-center">
-        body: JSON.stringify([original_data_pdf]),
+              <svg
-      }
+                xmlns="http://www.w3.org/2000/svg"
-    )
+                viewBox="0 0 24 24"
-      .then((response) => {
+                class="flex-shrink-0 w-5 h-5 mr-2"
-        if (response.status != "200") {
+                fill="currentColor"
-          toast.hideToast();
+                width="24"
-          Toastify({
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
-            text: $_("pdf-generation-failed"),
+                <path
-            duration: 3500,
+                  d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
-            backgroundColor:
+            </li>
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            <li class="flex items-center">
-          }).showToast();
+              <a class="mr-2" href="./">{$_('runners')}</a><svg
-        } else {
+                stroke="currentColor"
-          return response.blob();
+                fill="none"
-        }
+                stroke-width="2"
-      })
+                viewBox="0 0 24 24"
-      .then((blob) => {
+                stroke-linecap="round"
-        const url = window.URL.createObjectURL(blob);
+                stroke-linejoin="round"
-        let a = document.createElement("a");
+                class="h-3 w-3 mr-2 stroke-current"
-        a.href = url;
+                height="1em"
-        a.download =
+                width="1em"
-          "Sponsoring_" +
+                xmlns="http://www.w3.org/2000/svg"><line
-          original_data.firstname +
+                  x1="5"
-          (original_data.middlename || "") +
+                  y1="12"
-          original_data.lastname +
+                  x2="19"
-          ".pdf";
+                  y2="12" />
-        document.body.appendChild(a);
+                <polyline points="12 5 19 12 12 19" /></svg>
-        a.click();
+            </li>
-        a.remove();
+            <li class="flex items-center">
-        toast.hideToast();
+              <span class="mr-2">{original_data.firstname}
-        Toastify({
+                {original_data.middlename || ''}
-          text: $_("pdf-successfully-generated"),
+                {original_data.lastname}</span>
-          duration: 3500,
+            </li>
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          </ol>
-        }).showToast();
+        </nav>
-      })
+      </div>
-      .catch((err) => {
+    </div>
-        console.error(err);
+    <div class="mb-8 text-3xl font-extrabold leading-tight">
-      });
+      {original_data.firstname}
-  }
+      {original_data.middlename || ''}
-</script>
+      {original_data.lastname}
-
+      <span data-id="runner_actions_${editable.id}">
-{#await runner_promise}
+        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-  {$_('loading-runners')}
+          {#if delete_triggered}
-{:then}
+            <button
-  <section class="container p-5 select-none">
+              on:click={deleteRunner}
-    <div class="flex flex-row mb-4">
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-deletion')}</button>
-      <div class="w-full">
+            <button
-        <nav class="w-full flex">
+              on:click={() => {
-          <ol class="list-none flex flex-row items-center justify-start">
+                delete_triggered = !delete_triggered;
-            <li class="flex items-center">
+              }}
-              <svg
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
-                xmlns="http://www.w3.org/2000/svg"
+          {/if}
-                viewBox="0 0 24 24"
+          <GenerateSponsoringContracts
-                class="flex-shrink-0 w-5 h-5 mr-2"
+            bind:sponsoring_contracts_show
-                fill="currentColor"
+            bind:generate_runners />
-                width="24"
+          <GenerateRunnerCards
-                height="24"><path fill="none" d="M0 0h24v24H0z" />
+            bind:cards_show
-                <path
+            bind:generate_runners />
-                  d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
+          <GenerateRunnerCertificates
-            </li>
+            bind:certificates_show
-            <li class="flex items-center">
+            bind:generate_runners />
-              <a class="mr-2" href="./">{$_('runners')}</a><svg
+          {#if !delete_triggered}
-                stroke="currentColor"
+            <button
-                fill="none"
+              on:click={() => {
-                stroke-width="2"
+                delete_triggered = true;
-                viewBox="0 0 24 24"
+              }}
-                stroke-linecap="round"
+              type="button"
-                stroke-linejoin="round"
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-runner')}</button>
-                class="h-3 w-3 mr-2 stroke-current"
+          {/if}
-                height="1em"
+        {/if}
-                width="1em"
+        {#if !delete_triggered}
-                xmlns="http://www.w3.org/2000/svg"><line
+          <button
-                  x1="5"
+            disabled={!save_enabled}
-                  y1="12"
+            class:opacity-50={!save_enabled}
-                  x2="19"
+            type="button"
-                  y2="12" />
+            on:click={submit}
-                <polyline points="12 5 19 12 12 19" /></svg>
+            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
-            </li>
+        {/if}
-            <li class="flex items-center">
+      </span>
-              <span class="mr-2">{original_data.firstname}
+    </div>
-                {original_data.middlename || ''}
+    <!--  -->
-                {original_data.lastname}</span>
+    <div class="text-sm w-full">
-            </li>
+      <label
-          </ol>
+        for="firstname"
-        </nav>
+        class="font-medium text-gray-700">{$_('first-name')}</label>
-      </div>
+      <input
-    </div>
+        autocomplete="off"
-    <div class="mb-8 text-3xl font-extrabold leading-tight">
+        placeholder={$_('first-name')}
-      {original_data.firstname}
+        type="text"
-      {original_data.middlename || ''}
+        class:border-red-500={!isFirstnameValid}
-      {original_data.lastname}
+        class:focus:border-red-500={!isFirstnameValid}
-      <span data-id="runner_actions_${editable.id}">
+        class:focus:ring-red-500={!isFirstnameValid}
-        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
+        bind:value={editable.firstname}
-          {#if delete_triggered}
+        name="firstname"
-            <button
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-              on:click={deleteRunner}
+      {#if !isFirstnameValid}
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-deletion')}</button>
+        <span
-            <button
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-              on:click={() => {
+          {$_('first-name-is-required')}
-                delete_triggered = !delete_triggered;
+        </span>
-              }}
+      {/if}
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
+    </div>
-          {/if}
+    <div class="text-sm w-full">
-          <div id="sponsoring:dropdown" class="relative inline-block">
+      <label
-            <div>
+        for="middlename"
-              <button
+        class="font-medium text-gray-700">{$_('middle-name')}</label>
-                on:click={() => {
+      <input
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+        autocomplete="off"
-                }}
+        placeholder={$_('middle-name')}
-                type="button"
+        type="text"
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+        bind:value={editable.middlename}
-                id="options-menu"
+        name="middlename"
-                aria-haspopup="true"
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-                aria-expanded="true">
+    </div>
-                {$_('generate-sponsoring-contract')}
+    <div class="text-sm w-full">
-                <svg
+      <label
-                  xmlns="http://www.w3.org/2000/svg"
+        for="lastname"
-                  width="24"
+        class="font-medium text-gray-700">{$_('last-name')}</label>
-                  height="24"
+      <input
-                  viewBox="0 0 24 24"
+        autocomplete="off"
-                  class="-mr-1 ml-2 h-5 w-5"><path
+        placeholder={$_('last-name')}
-                    fill="none"
+        type="text"
-                    d="M0 0h24v24H0z" />
+        bind:value={editable.lastname}
-                  <path
+        class:border-red-500={!isLastnameValid}
-                    fill="currentColor"
+        class:focus:border-red-500={!isLastnameValid}
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+        class:focus:ring-red-500={!isLastnameValid}
-              </button>
+        name="lastname"
-            </div>
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-            {#if sponsoring_contracts_download_open}
+      {#if !isLastnameValid}
-              <div
+        <span
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                id="sponsoring:dropdown:menu">
+          {$_('last-name-is-required')}
-                <div
+        </span>
-                  class="py-1"
+      {/if}
-                  role="menu"
+    </div>
-                  aria-orientation="vertical"
+    <div class="text-sm w-full">
-                  aria-labelledby="options-menu">
+      <label
-                  <span
+        for="email"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+        class="font-medium text-gray-700">{$_('e-mail-adress')}</label>
-                  <button
+      <input
-                    on:click={() => {
+        autocomplete="off"
-                      generateSponsoringContract('de');
+        placeholder={$_('e-mail-adress')}
-                    }}
+        type="email"
-                    type="submit"
+        bind:value={editable.email}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+        class:border-red-500={!isEmailValid}
-                    role="menuitem">
+        class:focus:border-red-500={!isEmailValid}
-                    {$_('german')}
+        class:focus:ring-red-500={!isEmailValid}
-                  </button>
+        name="email"
-                  <button
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-                    on:click={() => {
+      {#if !isEmailValid}
-                      generateSponsoringContract('en');
+        <span
-                    }}
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                    type="submit"
+          {$_('valid-email-is-required')}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+        </span>
-                    role="menuitem">
+      {/if}
-                    {$_('english')}
+    </div>
-                  </button>
+    <div class="text-sm w-full">
-                </div>
+      <label for="phone" class="font-medium text-gray-700">{$_('phone')}</label>
-              </div>
+      <input
-            {/if}
+        autocomplete="off"
-          </div>
+        placeholder={$_('phone')}
-          {#if !delete_triggered}
+        type="tel"
-            <button
+        bind:value={editable.phone}
-              on:click={() => {
+        name="phone"
-                delete_triggered = true;
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-              }}
+    </div>
-              type="button"
+    <div class="text-sm w-full">
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-runner')}</button>
+      <span class="font-medium text-gray-700">{$_('group')}</span>
-          {/if}
+      <Select
-        {/if}
+        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-        {#if !delete_triggered}
+        itemFilter={(label, filterText, option) => label
-          <button
+            .toLowerCase()
-            disabled={!save_enabled}
+            .includes(
-            class:opacity-50={!save_enabled}
+              filterText.toLowerCase()
-            type="button"
+            ) || option.id.value
-            on:click={submit}
+            .toString()
-            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
+            .startsWith(filterText.toLowerCase())}
-        {/if}
+        items={groups}
-      </span>
+        showChevron={true}
-    </div>
+        placeholder={$_('search-for-an-organization-or-team-by-name-or-id')}
-    <!--  -->
+        noOptionsMessage={$_('no-organization-or-team-found')}
-    <div class="text-sm w-full">
+        bind:selectedValue={group}
-      <label
+        on:select={(selectedValue) => {
-        for="firstname"
+          editable.group = selectedValue.detail.value.id;
-        class="font-medium text-gray-700">{$_('first-name')}</label>
+        }}
-      <input
+        on:clear={() => (editable.group = null)} />
-        autocomplete="off"
+    </div>
-        placeholder={$_('first-name')}
+    <div class="text-sm w-full">
-        type="text"
+      <span class="font-medium text-gray-700">{$_('distance')}</span>
-        class:border-red-500={!isFirstnameValid}
+      <br />
-        class:focus:border-red-500={!isFirstnameValid}
+      <span class="text-gray-700">{original_data.distance} km</span>
-        class:focus:ring-red-500={!isFirstnameValid}
+    </div>
-        bind:value={editable.firstname}
+  </section>
-        name="firstname"
+{:catch error}
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
+  <PromiseError {error} />
-      {#if !isFirstnameValid}
+{/await}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('first-name-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="middlename"
-        class="font-medium text-gray-700">{$_('middle-name')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('middle-name')}
-        type="text"
-        bind:value={editable.middlename}
-        name="middlename"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="lastname"
-        class="font-medium text-gray-700">{$_('last-name')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('last-name')}
-        type="text"
-        bind:value={editable.lastname}
-        class:border-red-500={!isLastnameValid}
-        class:focus:border-red-500={!isLastnameValid}
-        class:focus:ring-red-500={!isLastnameValid}
-        name="lastname"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-      {#if !isLastnameValid}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('last-name-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="email"
-        class="font-medium text-gray-700">{$_('e-mail-adress')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('e-mail-adress')}
-        type="email"
-        bind:value={editable.email}
-        class:border-red-500={!isEmailValid}
-        class:focus:border-red-500={!isEmailValid}
-        class:focus:ring-red-500={!isEmailValid}
-        name="email"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-      {#if !isEmailValid}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('valid-email-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label for="phone" class="font-medium text-gray-700">{$_('phone')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('phone')}
-        type="tel"
-        bind:value={editable.phone}
-        name="phone"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <span class="font-medium text-gray-700">{$_('group')}</span>
-      <Select
-        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.id.value.toString().startsWith(filterText.toLowerCase())}
-        items={groups}
-        showChevron={true}
-        placeholder={$_('search-for-an-organization-or-team-by-name-or-id')}
-        noOptionsMessage={$_('no-organization-or-team-found')}
-        bind:selectedValue={group}
-        on:select={(selectedValue) => {editable.group = selectedValue.detail.value.id}}
-        on:clear={() => (editable.group = null)} />
-    </div>
-    <div class="text-sm w-full">
-      <span class="font-medium text-gray-700">{$_('distance')}</span>
-      <br />
-      <span class="text-gray-700">{original_data.distance} km</span>
-    </div>
-  </section>
-{:catch error}
-  <PromiseError {error} />
-{/await}

src/components/runners/RunnersOverview.svelte

@@ -1,364 +1,263 @@
-<script>
+<script>
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import {
+  import {
-    RunnerService,
+    RunnerService,
-    RunnerTeamService,
+    RunnerTeamService,
-    RunnerOrganizationService,
+    RunnerOrganizationService,
-  } from "@odit/lfk-client-js";
+  } from "@odit/lfk-client-js";
-  import store from "../../store";
+  import store from "../../store";
-  import RunnersEmptyState from "./RunnersEmptyState.svelte";
+  import RunnersEmptyState from "./RunnersEmptyState.svelte";
-  import Select from "svelte-select";
+  import Select from "svelte-select";
-  import Toastify from "toastify-js";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-  $: searchvalue = "";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-  $: active_deletes = [];
+  import GenerateRunnerCertificates from "../pdf_generation/GenerateRunnerCertificates.svelte";
-  export let current_runners = [];
+  $: searchvalue = "";
-  const runners_promise = RunnerService.runnerControllerGetAll().then((val) => {
+  $: active_deletes = [];
-    current_runners = val;
+  export let current_runners = [];
-  });
+  const runners_promise = RunnerService.runnerControllerGetAll().then((val) => {
-  $: selectedFilter_teams = null;
+    current_runners = val;
-  $: selectedFilter = null;
+  });
-  $: filter__teams = selectedFilter_teams || [];
+  $: selectedFilter_teams = null;
-  $: filter__orgs = selectedFilter || [];
+  $: selectedFilter = null;
-  $: filterGroupIDs = filter__teams.concat(filter__orgs).map((i) => i.value);
+  $: filter__teams = selectedFilter_teams || [];
-  $: sponsoring_contracts_download_open = false;
+  $: filter__orgs = selectedFilter || [];
-  $: teams = [];
+  $: filterGroupIDs = filter__teams.concat(filter__orgs).map((i) => i.value);
-  $: orgs = [];
+  $: sponsoring_contracts_show = current_runners.some(
-  $: mappedteams = teams.map(function (g) {
+    (r) => r.is_selected === true
-    return { value: g.id, label: g.parentGroup.name + " > " + g.name };
+  );
-  });
+  $: cards_show = current_runners.some(
-  $: selectgroups = orgs
+    (r) => r.is_selected === true
-    .map(function (g) {
+  );
-      return { value: g.id, label: g.name };
+  $: certificates_show = current_runners.some(
-    })
+    (r) => r.is_selected === true
-    .concat(mappedteams);
+  );
-  document.addEventListener("click", function (e) {
+  $: generate_runners = current_runners.filter((r) => r.is_selected === true);
-    if (
+  $: teams = [];
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+  $: orgs = [];
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+  $: mappedteams = teams.map(function (g) {
-    ) {
+    return { value: g.id, label: g.parentGroup.name + " > " + g.name };
-      sponsoring_contracts_download_open = false;
+  });
-    }
+  $: selectgroups = orgs
-  });
+    .map(function (g) {
-  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
+      return { value: g.id, label: g.name };
-    teams = val;
+    })
-  });
+    .concat(mappedteams);
-  RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+
-    orgs = val;
+  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
-  });
+    teams = val;
-  function should_display_based_on_id(id) {
+  });
-    if (searchvalue.toString().slice(-1) === "*") {
+  RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
-      return id.toString().startsWith(searchvalue.replace("*", ""));
+    orgs = val;
-    }
+  });
-    return id.toString() === searchvalue;
+  function should_display_based_on_id(id) {
-  }
+    if (searchvalue.toString().slice(-1) === "*") {
-  function generateSponsoringContract(locale) {
+      return id.toString().startsWith(searchvalue.replace("*", ""));
-    sponsoring_contracts_download_open = false;
+    }
-    const toast = Toastify({
+    return id.toString() === searchvalue;
-      text: $_("generating-pdf"),
+  }
-      duration: -1,
+</script>
-    }).showToast();
+
-    fetch(
+{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+  {#await runners_promise}
-      {
+    <div
-        method: "POST",
+      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
-        headers: {
+      role="alert">
-          "Content-Type": "application/json",
+      <p class="font-bold">{$_('runners-are-being-loaded')}</p>
-        },
+      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
-        body: JSON.stringify(
+    </div>
-          current_runners.filter((r) => r.is_selected === true)
+  {:then}
-        ),
+    {#if current_runners.length === 0}
-      }
+      <RunnersEmptyState />
-    )
+    {:else}
-      .then((response) => {
+      <input
-        if (response.status != "200") {
+        type="search"
-          toast.hideToast();
+        bind:value={searchvalue}
-          Toastify({
+        placeholder={$_('datatable.search')}
-            text: $_("pdf-generation-failed"),
+        aria-label={$_('datatable.search')}
-            duration: 3500,
+        class="gridjs-input gridjs-search-input mb-4" />
-            backgroundColor:
+      <div class="block mb-6">
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+        <label
-          }).showToast();
+          for="country"
-        } else {
+          class="text-sm font-medium text-gray-700">{$_('filter-by-organization-team')}</label>
-          return response.blob();
+        <Select
-        }
+          on:select={(event) => {
-      })
+            selectedFilter = event.detail;
-      .then((blob) => {
+          }}
-        const url = window.URL.createObjectURL(blob);
+          selectedValue={selectedFilter}
-        let a = document.createElement("a");
+          placeholder={$_('filter-by-organization-team')}
-        a.href = url;
+          containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
-        a.download = "Sponsoring.pdf";
+          items={selectgroups}
-        document.body.appendChild(a);
+          isMulti={true} />
-        a.click();
+      </div>
-        a.remove();
+      <div class="h-12">
-        toast.hideToast();
+        <GenerateSponsoringContracts
-        Toastify({
+          bind:sponsoring_contracts_show
-          text: $_("pdf-successfully-generated"),
+          bind:generate_runners />
-          duration: 3500,
+        <GenerateRunnerCards
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          bind:cards_show
-        }).showToast();
+          bind:generate_runners />
-      })
+        <GenerateRunnerCertificates
-      .catch((err) => {
+          bind:certificates_show
-        console.error(err);
+          bind:generate_runners />
-      });
+      </div>
-  }
+      <div
-</script>
+        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
-
+        <table class="divide-y divide-gray-200 w-full">
-{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
+          <thead class="bg-gray-50">
-  {#await runners_promise}
+            <tr>
-    <div
+              <th
-      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
+                scope="col"
-      role="alert">
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-      <p class="font-bold">{$_('runners-are-being-loaded')}</p>
+                <span
-      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
+                  on:click={() => {
-    </div>
+                    const newstate = !current_runners.some((r) => r.is_selected === true);
-  {:then}
+                    current_runners = current_runners.map((r) => {
-    {#if current_runners.length === 0}
+                      r.is_selected = newstate;
-      <RunnersEmptyState />
+                      return r;
-    {:else}
+                    });
-      <input
+                  }}
-        type="search"
+                  class="underline cursor-pointer select-none">{#if current_runners.some((r) => r.is_selected === true)}
-        bind:value={searchvalue}
+                    {$_('deselect-all')}
-        placeholder={$_('datatable.search')}
+                  {:else}{$_('select-all')}{/if}
-        aria-label={$_('datatable.search')}
+                </span>
-        class="gridjs-input gridjs-search-input mb-4" />
+              </th>
-      <div class="block mb-6">
+              <th
-        <label
+                scope="col"
-          for="country"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-          class="text-sm font-medium text-gray-700">{$_('filter-by-organization-team')}</label>
+                {$_('name')}
-        <Select
+              </th>
-          on:select={(event) => {
+              <th
-            selectedFilter = event.detail;
+                scope="col"
-          }}
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-          selectedValue={selectedFilter}
+                {$_('contact-information')}
-          placeholder={$_('filter-by-organization-team')}
+              </th>
-          containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
+              <th
-          items={selectgroups}
+                scope="col"
-          isMulti={true} />
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-      </div>
+                {$_('group')}
-      <div class="h-12">
+              </th>
-        {#if current_runners.some((r) => r.is_selected === true)}
+              <th
-          <div id="sponsoring:dropdown" class="relative inline-block">
+                scope="col"
-            <div>
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-              <button
+                {$_('distance-in-km')}
-                on:click={() => {
+              </th>
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+              <th scope="col" class="relative px-6 py-3">
-                }}
+                <span class="sr-only">{$_('action')}</span>
-                type="button"
+              </th>
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+            </tr>
-                id="options-menu"
+          </thead>
-                aria-haspopup="true"
+          <tbody class="divide-y divide-gray-200">
-                aria-expanded="true">
+            {#each current_runners as runner}
-                {$_('generate-sponsoring-contracts')}
+              {#if runner.firstname
-                <svg
+                .toLowerCase()
-                  xmlns="http://www.w3.org/2000/svg"
+                .includes(
-                  width="24"
+                  searchvalue.toLowerCase()
-                  height="24"
+                ) || runner.lastname
-                  viewBox="0 0 24 24"
+                  .toLowerCase()
-                  class="-mr-1 ml-2 h-5 w-5"><path
+                  .includes(
-                    fill="none"
+                    searchvalue.toLowerCase()
-                    d="M0 0h24v24H0z" />
+                  ) || should_display_based_on_id(runner.id)}
-                  <path
+                {#if filterGroupIDs.includes(runner.group.id) || filterGroupIDs.includes(runner.group.parentGroup?.id) || filterGroupIDs.length === 0}
-                    fill="currentColor"
+                  <tr
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+                    data-rowid="user_{runner.id}"
-              </button>
+                    data-groupid={runner.group.id}>
-            </div>
+                    <td class="px-6 py-4 whitespace-nowrap">
-            {#if sponsoring_contracts_download_open}
+                      <input
-              <div
+                        bind:checked={runner.is_selected}
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                        type="checkbox"
-                id="sponsoring:dropdown:menu">
+                        class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
-                <div
+                    </td>
-                  class="py-1"
+                    <td class="px-6 py-4 whitespace-nowrap">
-                  role="menu"
+                      <div class="flex items-center">
-                  aria-orientation="vertical"
+                        <div class="ml-4">
-                  aria-labelledby="options-menu">
+                          <div class="text-sm font-medium text-gray-900">
-                  <span
+                            {runner.firstname}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                            {runner.middlename || ''}
-                  <button
+                            {runner.lastname}
-                    on:click={() => {
+                          </div>
-                      generateSponsoringContract('de');
+                        </div>
-                    }}
+                      </div>
-                    type="submit"
+                    </td>
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                    <td class="px-6 py-4 whitespace-nowrap">
-                    role="menuitem">
+                      {#if runner.email}
-                    {$_('german')}
+                        <div class="text-sm text-gray-500">{runner.email}</div>
-                  </button>
+                      {/if}
-                  <button
+                      {#if runner.phone}
-                    on:click={() => {
+                        <div class="text-sm text-gray-500">{runner.phone}</div>
-                      generateSponsoringContract('en');
+                      {/if}
-                    }}
+                      {#if runner.address.address1 !== null}
-                    type="submit"
+                        {runner.address.address1}<br />
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                        {runner.address.address2 || ''}<br />
-                    role="menuitem">
+                        {runner.address.postalcode}
-                    {$_('english')}
+                        {runner.address.city}
-                  </button>
+                        {runner.address.country}
-                </div>
+                      {/if}
-              </div>
+                    </td>
-            {/if}
+                    <td class="px-6 py-4 whitespace-nowrap">
-          </div>
+                      {#if runner.group.responseType === 'RUNNERTEAM'}
-        {/if}
+                        <a
-      </div>
+                          href="../teams/{runner.group.id}"
-      <div
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
+                      {/if}
-        <table class="divide-y divide-gray-200 w-full">
+                      {#if runner.group.responseType === 'RUNNERORGANIZATION'}
-          <thead class="bg-gray-50">
+                        <a
-            <tr>
+                          href="../orgs/{runner.group.id}"
-              <th
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                scope="col"
+                      {/if}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    </td>
-                <span
+                    <td class="px-6 py-4 whitespace-nowrap">
-                  on:click={() => {
+                      {runner.distance}
-                    const newstate = !current_runners.some((r) => r.is_selected === true);
+                    </td>
-                    current_runners = current_runners.map((r) => {
+                    {#if active_deletes[runner.id] === true}
-                      r.is_selected = newstate;
+                      <td
-                      return r;
+                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                    });
+                        <button
-                  }}
+                          on:click={() => {
-                  class="underline cursor-pointer select-none">{#if current_runners.some((r) => r.is_selected === true)}
+                            active_deletes[runner.id] = false;
-                    {$_('deselect-all')}
+                          }}
-                  {:else}{$_('select-all')}{/if}
+                          tabindex="0"
-                </span>
+                          class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
-              </th>
+                        <button
-              <th
+                          on:click={() => {
-                scope="col"
+                            RunnerService.runnerControllerRemove(runner.id, true)
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                              .then((resp) => {
-                {$_('name')}
+                                current_runners = current_runners.filter((obj) => obj.id !== runner.id);
-              </th>
+                              })
-              <th
+                              .catch((err) => {});
-                scope="col"
+                          }}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                          tabindex="0"
-                {$_('contact-information')}
+                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
-              </th>
+                      </td>
-              <th
+                    {:else}
-                scope="col"
+                      <td
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                {$_('group')}
+                        <a
-              </th>
+                          href="./{runner.id}"
-              <th
+                          class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
-                scope="col"
+                        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                          <button
-                {$_('distance-in-km')}
+                            on:click={() => {
-              </th>
+                              active_deletes[runner.id] = true;
-              <th scope="col" class="relative px-6 py-3">
+                            }}
-                <span class="sr-only">{$_('action')}</span>
+                            tabindex="0"
-              </th>
+                            class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
-            </tr>
+                        {/if}
-          </thead>
+                      </td>
-          <tbody class="divide-y divide-gray-200">
+                    {/if}
-            {#each current_runners as runner}
+                  </tr>
-              {#if runner.firstname
+                {/if}
-                .toLowerCase()
+              {/if}
-                .includes(
+            {/each}
-                  searchvalue.toLowerCase()
+          </tbody>
-                ) || runner.middlename
+        </table>
-                  .toLowerCase()
+      </div>
-                  .includes(
+    {/if}
-                    searchvalue.toLowerCase()
+  {:catch error}
-                  ) || runner.lastname
+    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
-                  .toLowerCase()
+      <span class="inline-block align-middle mr-8">
-                  .includes(
+        <b class="capitalize">{$_('general_promise_error')}</b>
-                    searchvalue.toLowerCase()
+        {error}
-                  ) || should_display_based_on_id(runner.id)}
+      </span>
-                {#if filterGroupIDs.includes(runner.group.id) || filterGroupIDs.includes(runner.group.parentGroup?.id) || filterGroupIDs.length === 0}
+    </div>
-                  <tr
+  {/await}
-                    data-rowid="user_{runner.id}"
+{/if}
-                    data-groupid={runner.group.id}>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      <input
-                        bind:checked={runner.is_selected}
-                        type="checkbox"
-                        class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      <div class="flex items-center">
-                        <div class="ml-4">
-                          <div class="text-sm font-medium text-gray-900">
-                            {runner.firstname}
-                            {runner.middlename || ''}
-                            {runner.lastname}
-                          </div>
-                        </div>
-                      </div>
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {#if runner.email}
-                        <div class="text-sm text-gray-500">{runner.email}</div>
-                      {/if}
-                      {#if runner.phone}
-                        <div class="text-sm text-gray-500">{runner.phone}</div>
-                      {/if}
-                      {#if runner.address.address1 !== null}
-                        {runner.address.address1}<br />
-                        {runner.address.address2 || ''}<br />
-                        {runner.address.postalcode}
-                        {runner.address.city}
-                        {runner.address.country}
-                      {/if}
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {#if runner.group.responseType === 'RUNNERTEAM'}
-                        <a
-                          href="../teams/{runner.group.id}"
-                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                      {/if}
-                      {#if runner.group.responseType === 'RUNNERORGANIZATION'}
-                        <a
-                          href="../orgs/{runner.group.id}"
-                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                      {/if}
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {runner.distance}
-                    </td>
-                    {#if active_deletes[runner.id] === true}
-                      <td
-                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                        <button
-                          on:click={() => {
-                            active_deletes[runner.id] = false;
-                          }}
-                          tabindex="0"
-                          class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
-                        <button
-                          on:click={() => {
-                            RunnerService.runnerControllerRemove(runner.id, true)
-                              .then((resp) => {
-                                current_runners = current_runners.filter((obj) => obj.id !== runner.id);
-                              })
-                              .catch((err) => {});
-                          }}
-                          tabindex="0"
-                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
-                      </td>
-                    {:else}
-                      <td
-                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                        <a
-                          href="./{runner.id}"
-                          class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
-                        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-                          <button
-                            on:click={() => {
-                              active_deletes[runner.id] = true;
-                            }}
-                            tabindex="0"
-                            class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
-                        {/if}
-                      </td>
-                    {/if}
-                  </tr>
-                {/if}
-              {/if}
-            {/each}
-          </tbody>
-        </table>
-      </div>
-    {/if}
-  {:catch error}
-    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
-      <span class="inline-block align-middle mr-8">
-        <b class="capitalize">{$_('general_promise_error')}</b>
-        {error}
-      </span>
-    </div>
-  {/await}
-{/if}

src/components/scans/ScansOverview.svelte

@@ -81,10 +81,6 @@
                 .includes(
                   searchvalue.toLowerCase()
                 ) || scan.runner?.firstname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || scan.runner?.middlename
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()

src/components/scanstations/CopyScanStationTokenModal.svelte

@@ -23,14 +23,14 @@
         throw new Error();
       }
       Toastify({
-        text: $_('copied-token-to-clipboard'),
+        text: $_("copied-token-to-clipboard"),
         duration: 500,
         backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
       }).showToast();
       copied = true;
     } catch (err) {
       Toastify({
-        text: $_('error-whyile-copying-to-clipboard'),
+        text: $_("error-whyile-copying-to-clipboard"),
         duration: 500,
         backgroundColor:
           "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
@@ -75,7 +75,9 @@
                   d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
             </div>
             <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
-              <h3 class="text-lg leading-6 font-medium text-gray-900">{$_('token')}</h3>
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('token')}
+              </h3>
               <div class="mt-2 mb-6">
                 <p class="text-sm text-gray-500">
                   {$_('the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again')}
@@ -86,7 +88,7 @@
               <div class="mt-2 mb-6">
                 <label
                   for="token"
-                  class="block text-sm font-medium text-gray-700">Token</label>
+                  class="block text-sm font-medium text-gray-700">{$_('token')}</label>
                 <div on:click={copy} class="inline-flex">
                   <p
                     name="token"
@@ -106,7 +108,9 @@
                         d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
                   </div>
                 </div>
-                <p class="text-gray-500 text-xs">{$_('click-to-copy-token-to-clipboard')}</p>
+                <p class="text-gray-500 text-xs">
+                  {$_('click-to-copy-token-to-clipboard')}
+                </p>
               </div>
             </div>
           </div>

src/components/settings/Settings.svelte

@@ -4,6 +4,9 @@
   import { MeService } from "@odit/lfk-client-js";
   import Toastify from "toastify-js";
   import ConfirmProfileDeletion from "./ConfirmProfileDeletion.svelte";
+  import PasswordStrength, {
+    password_strong_enough_and_equal,
+  } from "../auth/PasswordStrength.svelte";
   $: data_loaded = false;
   $: delete_triggered = false;
   $: original_data = {};
@@ -15,8 +18,10 @@
     JSON.stringify(editable) === JSON.stringify(original_data)
   );
   $: save_enabled = changes_performed && isEmail(editable.email);
-  $: update_password_enabled =
+  $: update_password_enabled = password_strong_enough_and_equal(
-    password_change.length > 0 && password_change === password_confirm;
+    password_change,
+    password_confirm
+  );
   const user_promise = MeService.meControllerGet().then((data) => {
     data_loaded = true;
     data.groups = data.groups.map((g) => g.id);
@@ -45,7 +50,7 @@
   function changePassword() {
     if (data_loaded === true && update_password_enabled) {
       Toastify({
-        text: $_('changing-your-password'),
+        text: $_("changing-your-password"),
         duration: 2500,
       }).showToast();
       let postdata = Object.assign({}, original_data);
@@ -56,7 +61,7 @@
           password_change = "";
           postdata = {};
           Toastify({
-            text: $_('password-changed'),
+            text: $_("password-changed"),
             duration: 2500,
             backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
           }).showToast();
@@ -242,10 +247,7 @@
                     class="border-gray-300 placeholder-gray-500 appearance-none rounded-md relative block w-full px-3 py-2 border focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
                     placeholder={$_('password')} />
                 </div>
-                {#if password_change != password_confirm && password_change.length > 0}
+                <PasswordStrength bind:password_change bind:password_confirm />
-                  <span
-                    class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">{$_('passwords-dont-match')}</span>
-                {/if}
               </div>
               <div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
                 <button
@@ -257,9 +259,9 @@
                   {$_('update-password')}
                 </button>
                 {#if update_password_enabled}
-                <p>
+                  <p>
-                  {$_('after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that')}
+                    {$_('after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that')}
-                </p>
+                  </p>
                 {/if}
               </div>
             </div>

src/components/teams/TeamDetail.svelte

@@ -1,399 +1,297 @@
-<script>
+<script>
-  import {
+  import {
-    GroupContactService,
+    GroupContactService,
-    RunnerOrganizationService,
+    RunnerOrganizationService,
-    RunnerTeamService,
+    RunnerTeamService,
-  } from "@odit/lfk-client-js";
+  } from "@odit/lfk-client-js";
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import Toastify from "toastify-js";
+  import Toastify from "toastify-js";
-  import store from "../../store";
+  import store from "../../store";
-  import Select from "svelte-select";
+  import Select from "svelte-select";
-  import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
+  import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
-  import PromiseError from "../base/PromiseError.svelte";
+  import PromiseError from "../base/PromiseError.svelte";
-  import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
+  import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
-import Teams from "./Teams.svelte";
+  import Teams from "./Teams.svelte";
-  let [teamdata, original, delete_team, orgs, contacts, modal_open] = [
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-    {},
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-    {},
+  let [teamdata, original, delete_team, orgs, contacts, modal_open] = [
-    {},
+    {},
-    [],
+    {},
-    [],
+    {},
-    false,
+    [],
-  ];
+    [],
-  export let params;
+    false,
-  export let import_modal_open = false;
+  ];
-  $: delete_triggered = false;
+  export let params;
-  $: save_enabled = !data_changed && teamdata.parentGroup != null;
+  export let import_modal_open = false;
-  $: data_loaded = false;
+  $: delete_triggered = false;
-  $: data_changed = JSON.stringify(teamdata) === JSON.stringify(original);
+  $: save_enabled = !data_changed && teamdata.parentGroup != null;
-  $: sponsoring_contracts_download_open = false;
+  $: data_loaded = false;
-  $: group = {};
+  $: data_changed = JSON.stringify(teamdata) === JSON.stringify(original);
-  $: contact = {};
+  $: sponsoring_contracts_show = true;
-  //
+  $: cards_show = true;
-  const getContactLabel = (option) =>
+  $: generate_teams = [original];
-    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  $: group = {};
-  const promise = RunnerTeamService.runnerTeamControllerGetOne(
+  $: contact = {};
-    params.teamid
+  //
-  ).then((value) => {
+  const getContactLabel = (option) =>
-    data_loaded = true;
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
-    teamdata = Object.assign(teamdata, value);
+  const promise = RunnerTeamService.runnerTeamControllerGetOne(
-    original = Object.assign(original, value);
+    params.teamid
-    RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+  ).then((value) => {
-      orgs = val.map((r) => {
+    data_loaded = true;
-        return { label: r.name, value: r };
+    teamdata = Object.assign(teamdata, value);
-      });
+    original = Object.assign(original, value);
-      group = orgs.find((g) => g.value.id == teamdata.parentGroup.id);
+    RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
-    });
+      (val) => {
-    GroupContactService.groupContactControllerGetAll().then((val) => {
+        orgs = val.map((r) => {
-      contacts = val.map((r) => {
+          return { label: r.name, value: r };
-        return { label: getContactLabel(r), value: r };
+        });
-      });
+        group = orgs.find((g) => g.value.id == teamdata.parentGroup.id);
-      if(teamdata.contact){
+      }
-        contact = contacts.find((g) => g.value.id == teamdata.contact.id);
+    );
-      }
+    GroupContactService.groupContactControllerGetAll().then((val) => {
-      else{
+      contacts = val.map((r) => {
-        contact = null;
+        return { label: getContactLabel(r), value: r };
-      }
+      });
-    });
+      if (teamdata.contact) {
-  });
+        contact = contacts.find((g) => g.value.id == teamdata.contact.id);
-  document.addEventListener("click", function (e) {
+      } else {
-    if (
+        contact = null;
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+      }
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+    });
-    ) {
+  });
-      sponsoring_contracts_download_open = false;
+  function deleteTeam() {
-    }
+    RunnerTeamService.runnerTeamControllerRemove(original.id, false)
-  });
+      .then((resp) => {
-  function deleteTeam() {
+        Toastify({
-    RunnerTeamService.runnerTeamControllerRemove(original.id, false)
+          text: "Organization deleted",
-      .then((resp) => {
+          duration: 500,
-        Toastify({
+          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-          text: "Organization deleted",
+        }).showToast();
-          duration: 500,
+        location.replace("./");
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+      })
-        }).showToast();
+      .catch((err) => {
-        location.replace("./");
+        modal_open = true;
-      })
+        delete_team = original;
-      .catch((err) => {
+      });
-        modal_open = true;
+  }
-        delete_team = original;
+  function submit() {
-      });
+    if (data_loaded === true && save_enabled) {
-  }
+      Toastify({
-  function submit() {
+        text: "updating team",
-    if (data_loaded === true && save_enabled) {
+        duration: 2500,
-      Toastify({
+      }).showToast();
-        text: "updating team",
+      let postdata = teamdata;
-        duration: 2500,
+      postdata.parentGroup = teamdata.parentGroup.id;
-      }).showToast();
+      postdata.contact = teamdata.contact?.id;
-      let postdata = teamdata;
+      RunnerTeamService.runnerTeamControllerPut(original.id, postdata)
-      postdata.parentGroup = teamdata.parentGroup.id;
+        .then((resp) => {
-      postdata.contact = teamdata.contact?.id;
+          Object.assign(original, teamdata);
-      RunnerTeamService.runnerTeamControllerPut(original.id, postdata)
+          original = original;
-        .then((resp) => {
+          Toastify({
-          Object.assign(original, teamdata);
+            text: "updated team",
-          original = original;
+            duration: 2500,
-          Toastify({
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            text: "updated team",
+          }).showToast();
-            duration: 2500,
+        })
-            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+        .catch((err) => {});
-          }).showToast();
+    }
-        })
+  }
-        .catch((err) => {});
+</script>
-    }
+
-  }
+<ImportRunnerModal
-  async function generateSponsoringContract(locale) {
+  current_runners={[]}
-    sponsoring_contracts_download_open = false;
+  on:cancelDelete={(event) => {
-    const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+    import_modal_open = false;
-      teamdata.id
+  }}
-    );
+  passed_team={teamdata}
-    const toast = Toastify({
+  passed_orgs={[]}
-      text: $_("generating-pdf"),
+  passed_org={{}}
-      duration: -1,
+  opened_from="TeamDetail"
-    }).showToast();
+  bind:import_modal_open />
-    fetch(
+<ConfirmTeamDeletion bind:modal_open bind:delete_team />
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+{#if data_loaded}
-      {
+  <section class="container p-5">
-        method: "POST",
+    <div class="mb-8 text-3xl font-extrabold leading-tight">
-        headers: {
+      {original.name}
-          "Content-Type": "application/json",
+      <span data-id="org_actions_${teamdata.id}">
-        },
+        <GenerateSponsoringContracts
-        body: JSON.stringify(runners),
+          bind:sponsoring_contracts_show
-      }
+          bind:generate_teams />
-    )
+        <GenerateRunnerCards
-      .then((response) => {
+          bind:cards_show
-        if (response.status != "200") {
+          bind:generate_teams />
-          toast.hideToast();
+        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
-          Toastify({
+          <button
-            text: $_("pdf-generation-failed"),
+            on:click={() => {
-            duration: 3500,
+              import_modal_open = true;
-            backgroundColor:
+            }}
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            type="button"
-          }).showToast();
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
-        } else {
+            {$_('import-runners')}
-          return response.blob();
+          </button>
-        }
+        {/if}
-      })
+        {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
-      .then((blob) => {
+          {#if delete_triggered}
-        const url = window.URL.createObjectURL(blob);
+            <button
-        let a = document.createElement("a");
+              on:click={deleteTeam}
-        a.href = url;
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-delete')}</button>
-        a.download = "Sponsorings_" + teamdata.name + ".pdf";
+            <button
-        document.body.appendChild(a);
+              on:click={() => {
-        a.click();
+                delete_triggered = !delete_triggered;
-        a.remove();
+              }}
-        toast.hideToast();
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
-        Toastify({
+          {/if}
-          text: $_("pdf-successfully-generated"),
+          {#if !delete_triggered}
-          duration: 3500,
+            <button
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+              on:click={() => {
-        }).showToast();
+                delete_triggered = true;
-      })
+              }}
-      .catch((err) => {});
+              type="button"
-  }
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-team')}</button>
-</script>
+          {/if}
-
+        {/if}
-<ImportRunnerModal
+        {#if !delete_triggered}
-  current_runners={[]}
+          <button
-  on:cancelDelete={(event) => {
+            on:click={submit}
-    import_modal_open = false;
+            disabled={!save_enabled}
-  }}
+            class:opacity-50={!save_enabled}
-  passed_team={teamdata}
+            type="button"
-  passed_orgs={[]}
+            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
-  passed_org={{}}
+        {/if}
-  opened_from="TeamDetail"
+      </span>
-  bind:import_modal_open />
+    </div>
-<ConfirmTeamDeletion bind:modal_open bind:delete_team />
+    <div class="flex flex-row mb-4">
-{#if data_loaded}
+      <div class="w-full">
-  <section class="container p-5">
+        <nav class="w-full flex">
-    <div class="mb-8 text-3xl font-extrabold leading-tight">
+          <ol class="list-none flex flex-row items-center justify-start">
-      {original.name}
+            <li class="mr-2 flex items-center">
-      <span data-id="org_actions_${teamdata.id}">
+              <svg
-        <div id="sponsoring:dropdown" class="relative inline-block">
+                stroke="currentColor"
-          <div>
+                fill="none"
-            <button
+                stroke-width="2"
-              on:click={() => {
+                viewBox="0 0 24 24"
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+                stroke-linecap="round"
-              }}
+                stroke-linejoin="round"
-              type="button"
+                class="h-3 w-3 stroke-current"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                height="1em"
-              id="options-menu"
+                width="1em"
-              aria-haspopup="true"
+                xmlns="http://www.w3.org/2000/svg"><path
-              aria-expanded="true">
+                  d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
-              {$_('generate-sponsoring-contracts')}
+                <polyline points="9 22 9 12 15 12 15 22" /></svg>
-              <svg
+            </li>
-                xmlns="http://www.w3.org/2000/svg"
+            <li class="flex items-center">
-                width="24"
+              <a class="mr-2" href="/">Home</a><svg
-                height="24"
+                stroke="currentColor"
-                viewBox="0 0 24 24"
+                fill="none"
-                class="-mr-1 ml-2 h-5 w-5"><path
+                stroke-width="2"
-                  fill="none"
+                viewBox="0 0 24 24"
-                  d="M0 0h24v24H0z" />
+                stroke-linecap="round"
-                <path
+                stroke-linejoin="round"
-                  fill="currentColor"
+                class="h-3 w-3 mr-2 stroke-current"
-                  d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+                height="1em"
-            </button>
+                width="1em"
-          </div>
+                xmlns="http://www.w3.org/2000/svg"><line
-          {#if sponsoring_contracts_download_open}
+                  x1="5"
-            <div
+                  y1="12"
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                  x2="19"
-              id="sponsoring:dropdown:menu">
+                  y2="12" />
-              <div
+                <polyline points="12 5 19 12 12 19" /></svg>
-                class="py-1"
+            </li>
-                role="menu"
+            <li class="mr-2 flex items-center">
-                aria-orientation="vertical"
+              <svg
-                aria-labelledby="options-menu">
+                class="flex-shrink-0 w-5 h-5 mr-2"
-                <span
+                fill="currentColor"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                width="24"
-                <button
+                height="24"
-                  on:click={() => {
+                xmlns="http://www.w3.org/2000/svg"
-                    generateSponsoringContract('de');
+                viewBox="0 0 640 512"><path
-                  }}
+                  fill="currentColor"
-                  type="submit"
+                  d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+            </li>
-                  role="menuitem">
+            <li class="flex items-center">
-                  {$_('german')}
+              <a class="mr-2" href="./">Teams</a><svg
-                </button>
+                stroke="currentColor"
-                <button
+                fill="none"
-                  on:click={() => {
+                stroke-width="2"
-                    generateSponsoringContract('en');
+                viewBox="0 0 24 24"
-                  }}
+                stroke-linecap="round"
-                  type="submit"
+                stroke-linejoin="round"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                class="h-3 w-3 mr-2 stroke-current"
-                  role="menuitem">
+                height="1em"
-                  {$_('english')}
+                width="1em"
-                </button>
+                xmlns="http://www.w3.org/2000/svg"><line
-              </div>
+                  x1="5"
-            </div>
+                  y1="12"
-          {/if}
+                  x2="19"
-        </div>
+                  y2="12" />
-        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
+                <polyline points="12 5 19 12 12 19" /></svg>
-          <button
+            </li>
-            on:click={() => {
+            <li class="flex items-center">
-              import_modal_open = true;
+              <span class="mr-2">Team-Details #{params.teamid}</span>
-            }}
+            </li>
-            type="button"
+          </ol>
-            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        </nav>
-            {$_('import-runners')}
+      </div>
-          </button>
+    </div>
-        {/if}
+    <div class="text-sm w-full">
-        {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
+      <label for="name" class="font-medium text-gray-700">Name</label>
-          {#if delete_triggered}
+      <input
-            <button
+        autocomplete="off"
-              on:click={deleteTeam}
+        placeholder="Name"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-delete')}</button>
+        type="text"
-            <button
+        bind:value={teamdata.name}
-              on:click={() => {
+        name="name"
-                delete_triggered = !delete_triggered;
+        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-              }}
+    </div>
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
+    <div class="text-sm w-full">
-          {/if}
+      <label
-          {#if !delete_triggered}
+        for="contact"
-            <button
+        class="font-medium text-gray-700">{$_('contact')}</label>
-              on:click={() => {
+      <Select
-                delete_triggered = true;
+        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-              }}
+        itemFilter={(label, filterText, option) => label
-              type="button"
+            .toLowerCase()
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-team')}</button>
+            .includes(
-          {/if}
+              filterText.toLowerCase()
-        {/if}
+            ) || option.value.id
-        {#if !delete_triggered}
+            .toString()
-          <button
+            .startsWith(filterText.toLowerCase())}
-            on:click={submit}
+        items={contacts}
-            disabled={!save_enabled}
+        showChevron={true}
-            class:opacity-50={!save_enabled}
+        placeholder={$_('no-contact-selected')}
-            type="button"
+        noOptionsMessage={$_('no-contact-found')}
-            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
+        bind:selectedValue={contact}
-        {/if}
+        on:select={(selectedValue) => (teamdata.contact = selectedValue.detail.value)}
-      </span>
+        on:clear={() => (teamdata.contact = null)} />
-    </div>
+    </div>
-    <div class="flex flex-row mb-4">
+    <div class="text-sm w-full">
-      <div class="w-full">
+      <label
-        <nav class="w-full flex">
+        for="org"
-          <ol class="list-none flex flex-row items-center justify-start">
+        class="font-medium text-gray-700">{$_('organization')}</label>
-            <li class="mr-2 flex items-center">
+      <Select
-              <svg
+        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-                stroke="currentColor"
+        itemFilter={(label, filterText, option) => label
-                fill="none"
+            .toLowerCase()
-                stroke-width="2"
+            .includes(
-                viewBox="0 0 24 24"
+              filterText.toLowerCase()
-                stroke-linecap="round"
+            ) || option.id.value
-                stroke-linejoin="round"
+            .toString()
-                class="h-3 w-3 stroke-current"
+            .startsWith(filterText.toLowerCase())}
-                height="1em"
+        items={orgs}
-                width="1em"
+        showChevron={true}
-                xmlns="http://www.w3.org/2000/svg"><path
+        placeholder={$_('search-for-an-organization-by-name-or-id')}
-                  d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
+        noOptionsMessage={$_('no-organizations-found')}
-                <polyline points="9 22 9 12 15 12 15 22" /></svg>
+        bind:selectedValue={group}
-            </li>
+        on:select={(selectedValue) => (teamdata.parentGroup = selectedValue.detail.value)}
-            <li class="flex items-center">
+        on:clear={() => (teamdata.parentGroup = null)} />
-              <a class="mr-2" href="/">Home</a><svg
+    </div>
-                stroke="currentColor"
+  </section>
-                fill="none"
+{:else}
-                stroke-width="2"
+  {#await promise}
-                viewBox="0 0 24 24"
+    {$_('team-detail-is-being-loaded')}
-                stroke-linecap="round"
+  {:catch error}
-                stroke-linejoin="round"
+    <PromiseError />
-                class="h-3 w-3 mr-2 stroke-current"
+  {/await}
-                height="1em"
+{/if}
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"><line
-                  x1="5"
-                  y1="12"
-                  x2="19"
-                  y2="12" />
-                <polyline points="12 5 19 12 12 19" /></svg>
-            </li>
-            <li class="mr-2 flex items-center">
-              <svg
-                class="flex-shrink-0 w-5 h-5 mr-2"
-                fill="currentColor"
-                width="24"
-                height="24"
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 640 512"><path
-                  fill="currentColor"
-                  d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-            </li>
-            <li class="flex items-center">
-              <a class="mr-2" href="./">Teams</a><svg
-                stroke="currentColor"
-                fill="none"
-                stroke-width="2"
-                viewBox="0 0 24 24"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                class="h-3 w-3 mr-2 stroke-current"
-                height="1em"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"><line
-                  x1="5"
-                  y1="12"
-                  x2="19"
-                  y2="12" />
-                <polyline points="12 5 19 12 12 19" /></svg>
-            </li>
-            <li class="flex items-center">
-              <span class="mr-2">Team-Details #{params.teamid}</span>
-            </li>
-          </ol>
-        </nav>
-      </div>
-    </div>
-    <div class="text-sm w-full">
-      <label for="name" class="font-medium text-gray-700">Name</label>
-      <input
-        autocomplete="off"
-        placeholder="Name"
-        type="text"
-        bind:value={teamdata.name}
-        name="name"
-        class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="contact"
-        class="font-medium text-gray-700">{$_('contact')}</label>
-      <Select
-        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.value.id
-            .toString()
-            .startsWith(filterText.toLowerCase())}
-        items={contacts}
-        showChevron={true}
-        placeholder={$_('no-contact-selected')}
-        noOptionsMessage={$_('no-contact-found')}
-        bind:selectedValue={contact}
-        on:select={(selectedValue)=> teamdata.contact = selectedValue.detail.value}
-        on:clear={() => (teamdata.contact = null)} />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="org"
-        class="font-medium text-gray-700">{$_('organization')}</label>
-      <Select
-        containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.id.value.toString().startsWith(filterText.toLowerCase())}
-        items={orgs}
-        showChevron={true}
-        placeholder={$_('search-for-an-organization-by-name-or-id')}
-        noOptionsMessage={$_('no-organizations-found')}
-        bind:selectedValue={group}
-        on:select={(selectedValue)=> teamdata.parentGroup = selectedValue.detail.value}
-        on:clear={() => (teamdata.parentGroup = null)} />
-    </div>
-  </section>
-{:else}
-  {#await promise}
-    {$_('team-detail-is-being-loaded')}
-  {:catch error}
-    <PromiseError />
-  {/await}
-{/if}

src/components/teams/Teams.svelte

@@ -10,7 +10,7 @@
 <section class="container p-5">
   <span class="mb-1 text-3xl font-extrabold leading-tight">
     {$_('teams')}
-    {#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
+    {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:CREATE')}
       <button
         on:click={() => {
           modal_open = true;
@@ -27,6 +27,6 @@
   <TeamsOverview bind:current_teams />
 </section>
 
-{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
+{#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:CREATE')}
   <AddTeamModal bind:current_teams bind:modal_open />
 {/if}

src/components/teams/TeamsOverview.svelte

@@ -7,9 +7,17 @@
   import TeamsEmptyState from "./TeamsEmptyState.svelte";
   import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
   import { clickOutside } from "../base/outsideclick";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
   $: searchvalue = "";
   $: active_deletes = [];
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = current_teams.some(
+    (r) => r.is_selected === true
+  );
+  $: cards_show = current_teams.some(
+    (r) => r.is_selected === true
+  );
+  $: generate_teams = current_teams.filter((r) => r.is_selected === true);
   export let current_teams = [];
   let modal_open = false;
   let delete_team = {};
@@ -19,70 +27,6 @@
   teams_promise.then((data) => {
     usersstore.set(data);
   });
-  document.addEventListener("click", function (e) {
-      if (
-        e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-        e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-      ) {
-        sponsoring_contracts_download_open = false;
-      }
-  });
-  async function generateSponsoringContract(locale) {
-    sponsoring_contracts_download_open = false;
-    const teams = current_teams.filter((r) => r.is_selected === true);
-    const toast = Toastify({
-      text: $_("generating-pdfs"),
-      duration: -1,
-    }).showToast();
-    let count = 0;
-    for await (const t of teams) {
-      count++;
-      const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
-        t.id
-      );
-      fetch(
-        `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify(runners),
-        }
-      )
-        .then((response) => {
-          if (response.status != "200") {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdf-generation-failed"),
-              duration: 3500,
-              backgroundColor:
-                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-            }).showToast();
-          } else {
-            return response.blob();
-          }
-        })
-        .then((blob) => {
-          const url = window.URL.createObjectURL(blob);
-          let a = document.createElement("a");
-          a.href = url;
-          a.download = "Sponsorings_" + t.name + ".pdf";
-          document.body.appendChild(a);
-          a.click();
-          a.remove();
-          if (count === teams.length) {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdfs-successfully-generated"),
-              duration: 3500,
-              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            }).showToast();
-          }
-        })
-        .catch((err) => {});
-    }
-  }
 </script>
 
 <ConfirmTeamDeletion
@@ -111,69 +55,12 @@
         aria-label={$_('datatable.search')}
         class="gridjs-input gridjs-search-input mb-4" />
       <div class="h-12">
-        {#if current_teams.some((r) => r.is_selected === true)}
+        <GenerateSponsoringContracts
-          <div id="sponsoring:dropdown" class="relative inline-block">
+          bind:sponsoring_contracts_show
-            <div>
+          bind:generate_teams />
-              <button
+        <GenerateRunnerCards
-                on:click={() => {
+          bind:cards_show
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+          bind:generate_teams />
-                }}
-                type="button"
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-                id="options-menu"
-                aria-haspopup="true"
-                aria-expanded="true">
-                {$_('generate-sponsoring-contracts')}
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="24"
-                  height="24"
-                  viewBox="0 0 24 24"
-                  class="-mr-1 ml-2 h-5 w-5"><path
-                    fill="none"
-                    d="M0 0h24v24H0z" />
-                  <path
-                    fill="currentColor"
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
-              </button>
-            </div>
-            {#if sponsoring_contracts_download_open}
-              <div
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-                id="sponsoring:dropdown:menu"
-                on:click_outside={() => {
-                  sponsoring_contracts_download_open = false;
-                }}>
-                <div
-                  class="py-1"
-                  role="menu"
-                  aria-orientation="vertical"
-                  aria-labelledby="options-menu">
-                  <span
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                  <button
-                    on:click={() => {
-                      generateSponsoringContract('de');
-                    }}
-                    type="submit"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                    role="menuitem">
-                    {$_('german')}
-                  </button>
-                  <button
-                    on:click={() => {
-                      generateSponsoringContract('en');
-                    }}
-                    type="submit"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                    role="menuitem">
-                    {$_('english')}
-                  </button>
-                </div>
-              </div>
-            {/if}
-          </div>
-        {/if}
       </div>
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">

src/components/users/AddUserModal.svelte

@@ -5,6 +5,9 @@
   import { UserService } from "@odit/lfk-client-js";
   import isEmail from "validator/es/lib/isEmail";
   import Toastify from "toastify-js";
+  import PasswordStrength, {
+    password_strong_enough,
+  } from "../auth/PasswordStrength.svelte";
   export let modal_open;
   export let current_users;
   let firstname_input;
@@ -28,7 +31,10 @@
   $: isLastnameValid = lastname_input_value.trim().length !== 0;
   $: isFirstnameValid = firstname_input_value.trim().length !== 0;
   $: createbtnenabled =
-    isFirstnameValid && isLastnameValid && isPasswordValid && isEmailValid;
+    isFirstnameValid &&
+    isLastnameValid &&
+    password_strong_enough(password_input_value) &&
+    isEmailValid;
   (function () {
     document.onkeydown = function (e) {
       e = e || window.event;
@@ -203,12 +209,8 @@
                     type="password"
                     name="password"
                     class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
-                  {#if !isPasswordValid}
+                  <PasswordStrength
-                    <span
+                    bind:password_change={password_input_value} />
-                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                      {$_('password-is-required')}
-                    </span>
-                  {/if}
                 </div>
                 <div class="col-span-6">
                   <label

src/index.js

@@ -1,14 +0,0 @@
-import App from './App.svelte';
-
-const app = new App({
-	target: document.body
-});
-
-export default app;
-// HMR
-if (import.meta.hot) {
-	import.meta.hot.accept();
-	import.meta.hot.dispose(() => {
-		app.$destroy();
-	});
-}

src/locales/de.json

@@ -1,380 +1,428 @@
 {
-    "404message": "Die gesuchte Seite wurde leider nicht gefunden.",
+  "404message": "Die gesuchte Seite wurde leider nicht gefunden.",
-    "404title": "Fehler 404",
+  "404title": "Fehler 404",
-    "about": "Über",
+  "about": "Über",
-    "action": "Aktionen",
+  "action": "Aktionen",
-    "active": "Aktiv",
+  "active": "Aktiv",
-    "add-donation": "Sponsoring erstellen",
+  "add-card": "Karte erstellen",
-    "add-donor": "Sponsor:in erstellen",
+  "add-donation": "Sponsoring erstellen",
-    "add-scan": "Scan erstellen",
+  "add-donor": "Sponsor:in erstellen",
-    "add-the-first-scanstation": "Erstelle deine erste Scannerstation.",
+  "add-scan": "Scan erstellen",
-    "add-user-group": "Neue Gruppe erstellen",
+  "add-the-first-scanstation": "Erstelle deine erste Scannerstation.",
-    "add-your-first-contact": "Erstelle den ersten Kontakt",
+  "add-user-group": "Neue Gruppe erstellen",
-    "add-your-first-donor": "Erstelle die erste Sponsor:in",
+  "add-your-first-card": "Erstelle deine erste Läuferkarte",
-    "add-your-first-group": "Erstelle die erste Gruppe",
+  "add-your-first-contact": "Erstelle den ersten Kontakt",
-    "add-your-first-organization": "Erstelle die erste Organisation",
+  "add-your-first-donor": "Erstelle die erste Sponsor:in",
-    "add-your-first-runner": "Erstelle die erste Läufer:in",
+  "add-your-first-group": "Erstelle die erste Gruppe",
-    "add-your-first-team": "Erstelle das erste Team",
+  "add-your-first-organization": "Erstelle die erste Organisation",
-    "add-your-first-track": "Erstelle den ersten Track (Laufstrecke).",
+  "add-your-first-runner": "Erstelle die erste Läufer:in",
-    "add-your-first-user": "Erstelle die erste Benutzer:in",
+  "add-your-first-team": "Erstelle das erste Team",
-    "add-your-fist-donation": "Erstelle dein erstes Sponsoring",
+  "add-your-first-track": "Erstelle den ersten Track (Laufstrecke).",
-    "add-your-fist-scan": "Füge deinen ersten Scan hinzu",
+  "add-your-first-user": "Erstelle die erste Benutzer:in",
-    "adding-scan": "Scan wird hinzugefügt",
+  "add-your-fist-donation": "Erstelle dein erstes Sponsoring",
-    "address": "Adresse",
+  "add-your-fist-scan": "Füge deinen ersten Scan hinzu",
-    "address-is-required": "Du musst eine Adresse angeben",
+  "adding-card": "Karte wird erstellt",
-    "after-deletion-we-cant-restore-your-old-profile": "Nach der Löschung können auch die Admins dein Profil nicht wiederherstellen!",
+  "adding-scan": "Scan wird hinzugefügt",
-    "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "Nach der Änderung wirst du abgemeldet - bitte melde dich dann mit deinem neuen Passwort an.",
+  "address": "Adresse",
-    "all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
+  "address-is-required": "Du musst eine Adresse angeben",
-    "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
+  "after-deletion-we-cant-restore-your-old-profile": "Nach der Löschung können auch die Admins dein Profil nicht wiederherstellen!",
-    "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
+  "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "Nach der Änderung wirst du abgemeldet - bitte melde dich dann mit deinem neuen Passwort an.",
-    "amount-per-kilometer": "Betrag pro Kilometer",
+  "all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
-    "apartment-suite-etc": "Apartment, Wohnung, etc.",
+  "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
-    "application_name": "Lauf für Kaya! - Admin",
+  "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
-    "applying-changes": "Änderungen anwenden",
+  "amount": "Anzahl",
-    "attention": "Achtung!",
+  "amount-per-kilometer": "Betrag pro Kilometer",
-    "author": "Autor:in",
+  "apartment-suite-etc": "Apartment, Wohnung, etc.",
-    "bitte-bestaetige-diese-laeufer-fuer-den-import": "Bitte die Läufer:innen für den Import bestätigen.",
+  "application_name": "Lauf für Kaya! - Admin",
-    "by": "von",
+  "applying-changes": "Änderungen anwenden",
-    "cancel": "Abbrechen",
+  "attention": "Achtung!",
-    "cancel-delete": "Löschen abbrechen",
+  "author": "Autor:in",
-    "cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
+  "bitte-bestaetige-diese-laeufer-fuer-den-import": "Bitte die Läufer:innen für den Import bestätigen.",
-    "cancel-keep-my-profile": "Abbrechen, mein Profil behalten",
+  "by": "von",
-    "cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
+  "cancel": "Abbrechen",
-    "cancel-keep-team": "Abbrechen, Team behalten",
+  "cancel-delete": "Löschen abbrechen",
-    "cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
+  "cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
-    "change-your-password-here": "Hier kannst du dein Passwort ändern",
+  "cancel-keep-my-profile": "Abbrechen, mein Profil behalten",
-    "changing-your-password": "Passwort wird geändert",
+  "cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
-    "city": "Stadt",
+  "cancel-keep-team": "Abbrechen, Team behalten",
-    "close": "Schließen",
+  "cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
-    "configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
+  "card-added": "Karte wurde hinzugefügt",
-    "confirm": "Bestätigen",
+  "card-deleted": "Karte gelöscht",
-    "confirm-delete": "Löschung Bestätigen",
+  "card-updated": "Karte aktualisiert",
-    "confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
+  "cards": "Läuferkarten",
-    "confirm-delete-my-user-profile": "Bestätigung, mein Benutzerprofil löschen",
+  "change-your-password-here": "Hier kannst du dein Passwort ändern",
-    "confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
+  "changing-your-password": "Passwort wird geändert",
-    "confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
+  "city": "Stadt",
-    "confirm-deletion": "Löschung Bestätigen",
+  "click-to-copy-the-link-into-your-clipboard": "Klicke auf den Link, um ihn in deine Zwischenablage zu kopieren",
-    "confirm-the-new-password": "Neues Passwort bestätigen",
+  "click-to-copy-token-to-clipboard": "Klicke auf den Token, um ihn in deine Zwischenablage zu kopieren",
-    "contact": "Kontakt",
+  "close": "Schließen",
-    "contact-deleted": "Kontakt gelöscht",
+  "code": "Code",
-    "contact-information": "Kontaktinformation",
+  "configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
-    "contact-is-being-updated": "Kontakt wird aktualisiert ...",
+  "confirm": "Bestätigen",
-    "contact-is-not-a-member-in-any-group": "Kontakt gehört zu keiner Gruppe",
+  "confirm-delete": "Löschung Bestätigen",
-    "contacts": "Kontakte",
+  "confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
-    "contacts-are-being-loaded": "Kontakte werden geladen ...",
+  "confirm-delete-my-user-profile": "Bestätigung, mein Benutzerprofil löschen",
-    "count_organizations": "Organisationen (Anzahl)",
+  "confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
-    "count_teams": "Teams (Anzahl)",
+  "confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
-    "create": "Erstellen",
+  "confirm-deletion": "Löschung Bestätigen",
-    "create-a-new": "Erstelle eine neue",
+  "confirm-the-new-password": "Neues Passwort bestätigen",
-    "create-a-new-contact": "Kontakt erstellen",
+  "contact": "Kontakt",
-    "create-a-new-distance-donation": "Erstelle ein neues Sponsoring",
+  "contact-deleted": "Kontakt gelöscht",
-    "create-a-new-donor": "Neue Sponsor:in erstellen",
+  "contact-information": "Kontaktinformation",
-    "create-a-new-fixed-donation": "Erstelle eine neue Festbetragsspende",
+  "contact-is-being-updated": "Kontakt wird aktualisiert ...",
-    "create-a-new-organization": "Neue Organisation anlegen",
+  "contact-is-not-a-member-in-any-group": "Kontakt gehört zu keiner Gruppe",
-    "create-a-new-runner": "Neue Läufer:in erstellen",
+  "contacts": "Kontakte",
-    "create-a-new-scan-fixed-only": "Neuen Scan erstellen (nur mit Festdistanz)",
+  "contacts-are-being-loaded": "Kontakte werden geladen ...",
-    "create-a-new-scanstation": "Neue Station erstellen",
+  "copied-link-to-clipboard": "Link wurde in die Zwischenablage kopiert",
-    "create-a-new-team": "Erstelle ein neues Team",
+  "copied-token-to-clipboard": "Token wurde in die Zwischenablage kopiert",
-    "create-a-new-track": "Neuen Track erstellen",
+  "count_organizations": "Organisationen (Anzahl)",
-    "create-a-new-user": "Neue Benutzer:in anlegen",
+  "count_teams": "Teams (Anzahl)",
-    "create-a-new-user-group": "Erstelle eine neue Gruppe",
+  "create": "Erstellen",
-    "create-organization": "Organisation erstellen",
+  "create-a-new": "Erstelle eine neue",
-    "create-team": "Team erstellen",
+  "create-a-new-card": "Neue Läuferkarte erstellen",
-    "create-track": "Track erstellen",
+  "create-a-new-contact": "Kontakt erstellen",
-    "create-user": "Benutzer anlegen",
+  "create-a-new-distance-donation": "Erstelle ein neues Sponsoring",
-    "credits": "Credits",
+  "create-a-new-donor": "Neue Sponsor:in erstellen",
-    "csv_import__class": "Klasse",
+  "create-a-new-fixed-donation": "Erstelle eine neue Festbetragsspende",
-    "csv_import__firstname": "Vorname",
+  "create-a-new-organization": "Neue Organisation anlegen",
-    "csv_import__lastname": "Nachname",
+  "create-a-new-runner": "Neue Läufer:in erstellen",
-    "csv_import__middlename": "Mittelname",
+  "create-a-new-scan-fixed-only": "Neuen Scan erstellen (nur mit Festdistanz)",
-    "csv_import__team": "Team",
+  "create-a-new-scanstation": "Neue Station erstellen",
-    "danger-zone": "Gefahrenzone",
+  "create-a-new-team": "Erstelle ein neues Team",
-    "dashboard-greeting": "Hallo",
+  "create-a-new-track": "Neuen Track erstellen",
-    "dashboard-title": "Dashboard",
+  "create-a-new-user": "Neue Benutzer:in anlegen",
-    "datatable": {
+  "create-a-new-user-group": "Erstelle eine neue Gruppe",
-        "search": "🔍 Suche ...",
+  "create-and-generate-pdf": "Erstellen und PDF herunterladen",
-        "an_error_happened_while_fetching_the_data": "Beim Abrufen der Daten ist ein Fehler aufgetreten",
+  "create-bulk-blanco-cards": "Blankokarten erstellen",
-        "loading": "Wird geladen...",
+  "create-bulk-cards": "Blankokarten erstellen",
-        "next": "Nächste",
+  "create-organization": "Organisation erstellen",
-        "of": "von",
+  "create-team": "Team erstellen",
-        "previous": "Vorherige",
+  "create-track": "Track erstellen",
-        "to": "bis",
+  "create-user": "Benutzer anlegen",
-        "showing": "Zeige",
+  "create-without-pdf": "Ohne PDF erstellen",
-        "no_matching_records_found": "Keine passenden Einträge gefunden",
+  "created-blanco-cards": "Blankokarten wurden erstellt",
-        "page": "Seite",
+  "creating-blanco-cards": "Erstelle Blankokarten",
-        "records": "Einträge",
+  "credits": "Credits",
-        "sort_column_ascending": "Spalte aufsteigend sortieren",
+  "csv_import__class": "Klasse",
-        "sort_column_descending": "Spalte absteigend sortieren"
+  "csv_import__firstname": "Vorname",
-    },
+  "csv_import__lastname": "Nachname",
-    "delete": "Löschen",
+  "csv_import__middlename": "Mittelname",
-    "delete-contact": "Kontakt löschen",
+  "csv_import__team": "Team",
-    "delete-donation": "Sponsporing löschen",
+  "danger-zone": "Gefahrenzone",
-    "delete-donor": "Sponsor:in löschen",
+  "dashboard-greeting": "Hallo",
-    "delete-group": "Gruppe löschen",
+  "dashboard-title": "Dashboard",
-    "delete-organization": "Organisation löschen",
+  "datatable": {
-    "delete-profile": "Profil löschen",
+    "search": "🔍 Suche ...",
-    "delete-runner": "Läufer:in löschen",
+    "an_error_happened_while_fetching_the_data": "Beim Abrufen der Daten ist ein Fehler aufgetreten",
-    "delete-scan": "Scan löschen",
+    "loading": "Wird geladen...",
-    "delete-station": "Station löschen",
+    "next": "Nächste",
-    "delete-team": "Team Löschen",
+    "of": "von",
-    "delete-user": "Benutzer:in löschen",
+    "previous": "Vorherige",
-    "deleted-scan": "Scan wurde gelöscht",
+    "to": "bis",
-    "dependency_name": "Name",
+    "showing": "Zeige",
-    "description": "Beschreibung",
+    "no_matching_records_found": "Keine passenden Einträge gefunden",
-    "description-optional": "Beschreibung (optional)",
+    "page": "Seite",
-    "deselect-all": "Alle abwählen",
+    "records": "Einträge",
-    "details": "Details",
+    "sort_column_ascending": "Spalte aufsteigend sortieren",
-    "distance": "Distanz",
+    "sort_column_descending": "Spalte absteigend sortieren"
-    "distance-donation": "Sponsoring",
+  },
-    "distance-in-km": "Distanz (in KM)",
+  "delete": "Löschen",
-    "distance-track": "Distanz (+Track)",
+  "delete-contact": "Kontakt löschen",
-    "do-you-really-want-to-delete-your-profile": "Möchtest du dein Profil wirklich löschen?",
+  "delete-donation": "Sponsporing löschen",
-    "do-you-want-to-delete-the-organization-delete_org-name": "Möchtest du die Organisation {orgname} löschen?",
+  "delete-donor": "Sponsor:in löschen",
-    "do-you-want-to-delete-the-team-delete_team-name": "Möchtest du das Team {teamname} löschen?",
+  "delete-group": "Gruppe löschen",
-    "do-you-want-to-delete-this-donor-with-all-related-donations": "Möchtest du diese Sponsor:in mit all ihren Sponsorings löschen?",
+  "delete-organization": "Organisation löschen",
-    "documentation": "Dokumentation",
+  "delete-profile": "Profil löschen",
-    "donation-amount": "Sponsoringbetrag",
+  "delete-runner": "Läufer:in löschen",
-    "donation-amount-must-be-greater-that-0-00eur": "Der Sponsoringbetrag muss größer als 0.00€ sein.",
+  "delete-scan": "Scan löschen",
-    "donations": "Sponsorings",
+  "delete-station": "Station löschen",
-    "donor": "Sponsor:in",
+  "delete-team": "Team Löschen",
-    "donor-added": "Sponsor:in hinzugefügt",
+  "delete-user": "Benutzer:in löschen",
-    "donor-deleted": "Sponsor:in gelöscht",
+  "deleted-scan": "Scan wurde gelöscht",
-    "donor-has-no-associated-donations": "Zur Sponsor:in gibt es noch keine Sponsorings",
+  "dependency_name": "Name",
-    "donor-is-being-added": "Sponsor:in wird hinzugefügt...",
+  "description": "Beschreibung",
-    "donor-is-being-updated": "Sponsor:in wird aktualisiert",
+  "description-optional": "Beschreibung (optional)",
-    "donors": "Sponsor:innen",
+  "deselect-all": "Alle abwählen",
-    "donors-are-being-loaded": "Sponsor:innen werden geladen",
+  "details": "Details",
-    "dont-have-your-email-connected": "Deine E-Mail ist nicht verknüpft?",
+  "disabled": "deaktiviert",
-    "dont-panic-were-resetting-it": "Keine Panik, wir setzen es zurück ✌",
+  "distance": "Distanz",
-    "e-mail-adress": "E-Mail-Adresse",
+  "distance-donation": "Sponsoring",
-    "edit": "Bearbeiten",
+  "distance-in-km": "Distanz (in KM)",
-    "edit-permissions": "Berechtigungen bearbeiten",
+  "distance-track": "Distanz (+Track)",
-    "email_address_or_username": "E-Mail-Adresse/ Benutzername",
+  "do-you-really-want-to-delete-your-profile": "Möchtest du dein Profil wirklich löschen?",
-    "enabled": "aktiviert",
+  "do-you-want-to-delete-the-organization-delete_org-name": "Möchtest du die Organisation {orgname} löschen?",
-    "english": "Englisch",
+  "do-you-want-to-delete-the-team-delete_team-name": "Möchtest du das Team {teamname} löschen?",
-    "error_on_login": "😢Fehler beim Login",
+  "do-you-want-to-delete-this-donor-with-all-related-donations": "Möchtest du diese Sponsor:in mit all ihren Sponsorings löschen?",
-    "erteilte": "Direkt erteilte",
+  "documentation": "Dokumentation",
-    "everything-concerning-your-profile": "Alles zu deinem Profil",
+  "donation-amount": "Sponsoringbetrag",
-    "everything-is-more-fun-together": "Im Team macht's mehr Spaß 🏃‍♂️🏃‍♀️🏃‍♂️",
+  "donation-amount-must-be-greater-that-0-00eur": "Der Sponsoringbetrag muss größer als 0.00€ sein.",
-    "faq": "FAQ",
+  "donations": "Sponsorings",
-    "filter-by-organization-team": "Filtern nach Organisation / Team",
+  "donor": "Sponsor:in",
-    "first-name": "Vorname",
+  "donor-added": "Sponsor:in hinzugefügt",
-    "first-name-is-required": "Vorname muss angegeben werden",
+  "donor-deleted": "Sponsor:in gelöscht",
-    "first-scan-of-the-day": "Erster Scan des Tages",
+  "donor-has-no-associated-donations": "Zur Sponsor:in gibt es noch keine Sponsorings",
-    "fixed-donation": "Festbetragsspende",
+  "donor-is-being-added": "Sponsor:in wird hinzugefügt...",
-    "forgot_password": "Passwort vergessen?",
+  "donor-is-being-updated": "Sponsor:in wird aktualisiert",
-    "geerbte": "geerbte",
+  "donors": "Sponsor:innen",
-    "general-stats": "Allgemeine Statistiken",
+  "donors-are-being-loaded": "Sponsor:innen werden geladen",
-    "general_promise_error": "😢 Ein unbekannter Fehler ist aufgetreten",
+  "dont-have-your-email-connected": "Deine E-Mail ist nicht verknüpft?",
-    "generate-sponsoring-contract": "Sponsoringvertrag generieren",
+  "dont-panic-were-resetting-it": "Keine Panik, wir setzen es zurück ✌",
-    "generate-sponsoring-contracts": "Sponsoringverträge generieren",
+  "e-mail-adress": "E-Mail-Adresse",
-    "generating-pdf": "Pdf wird generiert...",
+  "edit": "Bearbeiten",
-    "generating-pdfs": "PDFs werden generiert...",
+  "edit-a-card": "Läuferkarte bearbeiten",
-    "generic-ui-logic-error": "Etwas ist in der Benutzeroberfläche schiefgelaufen.",
+  "edit-permissions": "Berechtigungen bearbeiten",
-    "german": "Deutsch",
+  "email_address_or_username": "E-Mail-Adresse/ Benutzername",
-    "go-to-login": "Zum Login",
+  "enabled": "aktiviert",
-    "goback": "Zur Startseite",
+  "enabled_large": "Aktiviert",
-    "granted": "Gewährt",
+  "english": "Englisch",
-    "group": "Gruppe",
+  "error-during-import": "Fehler beim Importieren",
-    "group-added": "Gruppe hinzugefügt",
+  "error-whyile-copying-to-clipboard": "Fehler beim Kopieren in die Zwischenablage",
-    "group-is-being-added": "Gruppe wird erstellt",
+  "error_on_login": "😢Fehler beim Login",
-    "group-name-is-required": "Der Gruppenname muss angegeben werden.",
+  "erteilte": "Direkt erteilte",
-    "group-updated": "Gruppe aktualisiert",
+  "everything-concerning-your-profile": "Alles zu deinem Profil",
-    "groups": "Gruppen",
+  "everything-is-more-fun-together": "Im Team macht's mehr Spaß 🏃‍♂️🏃‍♀️🏃‍♂️",
-    "groups-are-being-loaded": "Gruppen werden geladen",
+  "faq": "FAQ",
-    "home": "Start",
+  "filter-by-organization-team": "Filtern nach Organisation / Team",
-    "icon-image-credits": "Wir möchten uns außerdem für die verwendeten Icons und Bilder bedanken bei:",
+  "first-name": "Vorname",
-    "import-finished": "Import abgeschlossen",
+  "first-name-is-required": "Vorname muss angegeben werden",
-    "import-runners": "Läufer:innen importieren",
+  "first-scan-of-the-day": "Erster Scan des Tages",
-    "import__target-organization": "Ziel Organisation",
+  "fixed-donation": "Festbetragsspende",
-    "imprint": "Impressum ",
+  "forgot_password": "Passwort vergessen?",
-    "imprint-loading": "Impressum lädt...",
+  "geerbte": "geerbte",
-    "inactive": "Inaktiv",
+  "general-stats": "Allgemeine Statistiken",
-    "installed-version": "Installierte Version",
+  "general_promise_error": "😢 Ein unbekannter Fehler ist aufgetreten",
-    "internal-error": "Interner Fehler",
+  "generate-runnercards": "Läuferkarten generieren",
-    "invalid": "Ungültig",
+  "generate-sponsoring-contract": "Sponsoringvertrag generieren",
-    "invalid-mail-reset": "Das ist keine gültige E-Mail",
+  "generate-sponsoring-contracts": "Sponsoringverträge generieren",
-    "laeufer-hinzufuegen": "Läufer:in hinzufügen",
+  "generating-pdf": "Pdf wird generiert...",
-    "laeufer-importieren": "Läufer:innen importieren",
+  "generating-pdfs": "PDFs werden generiert...",
-    "laptime": "Rundenzeit",
+  "generic-ui-logic-error": "Etwas ist in der Benutzeroberfläche schiefgelaufen.",
-    "last-name": "Nachname",
+  "german": "Deutsch",
-    "last-name-is-required": "Nachname muss angegeben werden",
+  "go-to-login": "Zum Login",
-    "lfk-is-os": "Das \"Lauf für Kaya!\" Frontend ist (wie alle anderen Projekte für den \"LfK!\" auch) ein OpenSource Projekt.",
+  "goback": "Zur Startseite",
-    "license": "Lizenz",
+  "granted": "Gewährt",
-    "licenses-are-being-loaded": "Lizenzen werden geladen...",
+  "group": "Gruppe",
-    "loading-contact-details": "Kontaktdaten werden geladen ...",
+  "group-added": "Gruppe hinzugefügt",
-    "loading-donation-details": "Lade Sponsoringdetails",
+  "group-is-being-added": "Gruppe wird erstellt",
-    "loading-donor-details": "Lade Details",
+  "group-name-is-required": "Der Gruppenname muss angegeben werden.",
-    "loading-group-detail": "Lade Gruppendetails...",
+  "group-updated": "Gruppe aktualisiert",
-    "loading-profile-data": "Lade Profildaten",
+  "groups": "Gruppen",
-    "loading-runners": "Läufer:innen werden geladen...",
+  "groups-are-being-loaded": "Gruppen werden geladen",
-    "loading-station-details": "Lade Scanstation-Details ...",
+  "home": "Start",
-    "log_in": "Anmelden",
+  "icon-image-credits": "Wir möchten uns außerdem für die verwendeten Icons und Bilder bedanken bei:",
-    "log_in_to_your_account": "Bitte melde dich an",
+  "if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button": "Wenn du mehrere Blankokarten erstellen willst, nutze doch den \"Blankokarten erstellen\" Knopf.",
-    "login_is_checked": "Login wird überprüft",
+  "import-finished": "Import abgeschlossen",
-    "logout": "Abmelden",
+  "import-runners": "Läufer:innen importieren",
-    "mail-validation-in-progress": "E-Mail Verifizierung läuft... ",
+  "import__target-organization": "Ziel Organisation",
-    "manage-admin-users": "Nutzer verwalten",
+  "imprint": "Impressum ",
-    "middle-name": "Mittelname",
+  "imprint-loading": "Impressum lädt...",
-    "minimum-lap-time-in-s": "Minimale Rundenzeit (in Sekunden)",
+  "inactive": "Inaktiv",
-    "minimum-lap-time-must-be-a-positive-number-or-0": "Die minimale Rundenzeit muss eine positive Zahl oder 0 sein",
+  "installed-version": "Installierte Version",
-    "name": "Name",
+  "internal-error": "Interner Fehler",
-    "name-is-required": "Der Gruppenname muss angegeben werden",
+  "invalid": "Ungültig",
-    "new-password": "Neues Passwort",
+  "invalid-mail-reset": "Das ist keine gültige E-Mail",
-    "no-contact-found": "Keine Kontakte gefunden",
+  "just-enter-how-many-you-want-and-the-system-will-create-them": "Gebe einfach ein, wie viele Blankokarten das System erstellen soll.",
-    "no-contact-selected": "Kein Kontakt ausgewählt",
+  "laeufer-hinzufuegen": "Läufer:in hinzufügen",
-    "no-contact-specified": "Kein Kontakt angegeben",
+  "laeufer-importieren": "Läufer:innen importieren",
-    "no-donors-found": "Keine Spender:innen gefunden",
+  "laptime": "Rundenzeit",
-    "no-license-text-could-be-found": "Kein Lizenz-Text gefunden 😢",
+  "last-name": "Nachname",
-    "no-organization-or-team-found": "Keine Organisationen oder Teams gefunden",
+  "last-name-is-required": "Nachname muss angegeben werden",
-    "no-organization-specified": "Keine Organisation angegeben",
+  "lfk-is-os": "Das \"Lauf für Kaya!\" Frontend ist (wie alle anderen Projekte für den \"LfK!\" auch) ein OpenSource Projekt.",
-    "no-organizations-found": "Keine Organisationen gefunden",
+  "license": "Lizenz",
-    "no-runners-found": "Keine Läufer:innen gefunden",
+  "licenses-are-being-loaded": "Lizenzen werden geladen...",
-    "no-tracks-added-yet": "Es wurden noch keine Tracks erstellt.",
+  "loading-cards": "Läuferkarten werden geladen",
-    "organization": "Organisation",
+  "loading-contact-details": "Kontaktdaten werden geladen ...",
-    "organization-added": "Organisation hinzugefügt",
+  "loading-donation-details": "Lade Sponsoringdetails",
-    "organization-deleted": "Organisation gelöscht",
+  "loading-donor-details": "Lade Details",
-    "organization-detail-is-being-loaded": "Organisationsdetails werden geladen ...",
+  "loading-group-detail": "Lade Gruppendetails...",
-    "organization-is-being-added": "Organisation wird hinzugefügt ...",
+  "loading-profile-data": "Lade Profildaten",
-    "organization-name-is-required": "Der Name muss angegeben werden",
+  "loading-runners": "Läufer:innen werden geladen...",
-    "organizations": "Organisationen",
+  "loading-station-details": "Lade Scanstation-Details ...",
-    "organizations-are-being-loaded": "Organisationen werden geladen ...",
+  "log_in": "Anmelden",
-    "orgs": "Organisationen",
+  "log_in_to_your_account": "Bitte melde dich an",
-    "oss_credit_description": "Wir verwenden eine Menge Open Source-Software bei diesen Projekten und möchten uns bei den folgenden Projekten und Mitwirkenden bedanken, die dazu beitragen, Open Source großartig zu machen!",
+  "login_is_checked": "Login wird überprüft",
-    "password": "Passwort",
+  "logout": "Abmelden",
-    "password-changed": "Passwort wurde aktualisiert!",
+  "mail-validation-in-progress": "E-Mail Verifizierung läuft... ",
-    "password-is-required": "Passwort muss angegeben werden",
+  "manage-admin-users": "Nutzer verwalten",
-    "password-reset-failed": "Passwort zurücksetzen ist fehlgeschlagen!",
+  "middle-name": "Mittelname",
-    "password-reset-in-progress": "Passwort wird zurückgesetzt...",
+  "minimum-lap-time-in-s": "Minimale Rundenzeit (in Sekunden)",
-    "password-reset-mail-sent": "Passwort-Reset Mail wurde an \"{usersEmail}\" geschickt.",
+  "minimum-lap-time-must-be-a-positive-number-or-0": "Die minimale Rundenzeit muss eine positive Zahl oder 0 sein",
-    "password-reset-successful": "Passwort erfolgreich zurückgesetzt!",
+  "must-be-at-least-10-characters-long": "Passwort muss mindestens 10 Zeichen lang sein!",
-    "passwords-dont-match": "Die Passwörter stimmen nicht überein.",
+  "must-contain-a-lowercase-letter": "Passwort muss einen Großbuchstaben enthalten!",
-    "pdf-generation-failed": "PDF Generierung fehlgeschlagen!",
+  "must-contain-a-number": "Passwort muss eine Zahl enthalten!",
-    "pdf-successfully-generated": "PDF wurde erfolgreich generiert!",
+  "must-contain-a-uppercase-letter": "Passwort muss einen Kleinbuchstaben enthalten!",
-    "pdfs-successfully-generated": "Alle PDFs wurden generiert!",
+  "name": "Name",
-    "per-kilometer": "pro Kilometer",
+  "name-is-required": "Der Gruppenname muss angegeben werden",
-    "permissions": "Berechtigungen",
+  "new-password": "Neues Passwort",
-    "permissions-updated": "Berechtigungen aktualisiert!",
+  "no-contact-found": "Keine Kontakte gefunden",
-    "phone": "Telefon",
+  "no-contact-selected": "Kein Kontakt ausgewählt",
-    "please-provide-a-password": "Bitte gebe ein Passwort an...",
+  "no-contact-specified": "Kein Kontakt angegeben",
-    "please-provide-the-nessecary-information-to-add-a-new-donor": "Bitte mach die Notwendigen Angaben, um eine neue Sponsor:in zu erstellen",
+  "no-donors-found": "Keine Spender:innen gefunden",
-    "please-provide-the-nessecary-information-to-create-a-new-donation": "Bitte gebe alle für das Sponsoring notwendigen Daten an.",
+  "no-license-text-could-be-found": "Kein Lizenz-Text gefunden 😢",
-    "please-provide-the-nessecary-information-to-create-a-new-scan": "Bitte gebe alle notwendigen Informationen an, um einen neuen Scan zu erstellen.",
+  "no-organization-or-team-found": "Keine Organisationen oder Teams gefunden",
-    "please-provide-the-required-csv-xlsx-file": "Bitte eine CSV oder XLSX Datei hochladen.",
+  "no-organization-specified": "Keine Organisation angegeben",
-    "please-provide-the-required-information-for-creating-a-new-user-group": "Bitte gebe alle für eine neue Gruppe notwendigen Informationen an.",
+  "no-organizations-found": "Keine Organisationen gefunden",
-    "please-provide-the-required-information-to-add-a-new-contact": "Bitte gebe alle nötigen Informationen an, im den neuen Kontakt zu erstellen.",
+  "no-runners-found": "Keine Läufer:innen gefunden",
-    "please-provide-the-required-information-to-add-a-new-organization": "Bitte gebe alle nötigen Informationen an, im die neue Organisation zu erstellen.",
+  "no-tracks-added-yet": "Es wurden noch keine Tracks erstellt.",
-    "please-provide-the-required-information-to-add-a-new-runner": "Bitte die benötigten Informationen angeben.",
+  "non-blanko": "Keine/Blankokarte",
-    "please-provide-the-required-information-to-add-a-new-team": "Bitte gebe alle nötigen Informationen an, im das neue Team zu erstellen.",
+  "organization": "Organisation",
-    "please-provide-the-required-information-to-add-a-new-track": "Bitte die benötigten Informationen angeben.",
+  "organization-added": "Organisation hinzugefügt",
-    "please-provide-the-required-information-to-add-a-new-user": "Bitte gebe alle nötigen Informationen an, im die neue Benutzer:in zu erstellen.",
+  "organization-deleted": "Organisation gelöscht",
-    "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
+  "organization-detail-is-being-loaded": "Organisationsdetails werden geladen ...",
-    "privacy": "Datenschutz",
+  "organization-is-being-added": "Organisation wird hinzugefügt ...",
-    "privacy-loading": "Datenschutzerklärung lädt...",
+  "organization-name-is-required": "Der Name muss angegeben werden",
-    "profile": "Profil",
+  "organizations": "Organisationen",
-    "profile-picture": "Profilbild",
+  "organizations-are-being-loaded": "Organisationen werden geladen ...",
-    "profile-updated": "Profil wurde aktualisiert!",
+  "orgs": "Organisationen",
-    "read-license": "Lizenz-Text lesen",
+  "oss_credit_description": "Wir verwenden eine Menge Open Source-Software bei diesen Projekten und möchten uns bei den folgenden Projekten und Mitwirkenden bedanken, die dazu beitragen, Open Source großartig zu machen!",
-    "receipt-needed": "Spendenquittung benötigt",
+  "password": "Passwort",
-    "repo_link": "Link",
+  "password-changed": "Passwort wurde aktualisiert!",
-    "request-a-new-reset-mail": "Neue Reset-Mail anfordern",
+  "password-is-required": "Passwort muss angegeben werden",
-    "reset-my-password": "Passwort zurücksetzen",
+  "password-reset-failed": "Passwort zurücksetzen ist fehlgeschlagen!",
-    "reset-password": "Passwort zurücksetzen",
+  "password-reset-in-progress": "Passwort wird zurückgesetzt...",
-    "runner": "Läufer:in",
+  "password-reset-mail-sent": "Passwort-Reset Mail wurde an \"{usersEmail}\" geschickt.",
-    "runner-added": "Läufer:in hinzugefügt",
+  "password-reset-successful": "Passwort erfolgreich zurückgesetzt!",
-    "runner-import": "Läufer:innen Import",
+  "passwords-dont-match": "Die Passwörter stimmen nicht überein!",
-    "runner-is-being-added": "Läufer:in wird hinzugefügt...",
+  "pdf-generation-failed": "PDF Generierung fehlgeschlagen!",
-    "runner-updated": "Läufer:in aktualisiert!",
+  "pdf-successfully-generated": "PDF wurde erfolgreich generiert!",
-    "runnerimport_verify_runners_org": "Bitte die Läufer:innen für den Import in die Organisation \"{org_name}\" bestätigen",
+  "pdfs-successfully-generated": "Alle PDFs wurden generiert!",
-    "runners": "Läufer",
+  "per-kilometer": "pro Kilometer",
-    "runners-are-being-imported": "Läufer:innen werden importiert ...",
+  "permissions": "Berechtigungen",
-    "runners-are-being-loaded": "Läufer:innen werden geladen ...",
+  "permissions-updated": "Berechtigungen aktualisiert!",
-    "save": "Speichern",
+  "phone": "Telefon",
-    "save-changes": "Änderungen speichern",
+  "please-copy-the-token-and-store-it-somewhere-save": "Bitte kopiere dir den Token und bewahre ihn gut auf.",
-    "scan-added": "Scan hinzugefügt",
+  "please-provide-a-password": "Bitte gebe ein Passwort an...",
-    "scan-is-being-updated": "Scan wird aktualisiert",
+  "please-provide-the-nessecary-information-to-add-a-new-donor": "Bitte mach die Notwendigen Angaben, um eine neue Sponsor:in zu erstellen",
-    "scan-with-fixed-distance": "Scan mit Festdistanz",
+  "please-provide-the-nessecary-information-to-create-a-new-donation": "Bitte gebe alle für das Sponsoring notwendigen Daten an.",
-    "scans": "Scans",
+  "please-provide-the-nessecary-information-to-create-a-new-scan": "Bitte gebe alle notwendigen Informationen an, um einen neuen Scan zu erstellen.",
-    "scans-are-being-loaded": "Scans werden geladen",
+  "please-provide-the-required-csv-xlsx-file": "Bitte eine CSV oder XLSX Datei hochladen.",
-    "scanstation": "Scanner Station",
+  "please-provide-the-required-information-for-creating-a-new-user-group": "Bitte gebe alle für eine neue Gruppe notwendigen Informationen an.",
-    "scanstations": "Scanner Stationen",
+  "please-provide-the-required-information-to-add-a-new-contact": "Bitte gebe alle nötigen Informationen an, im den neuen Kontakt zu erstellen.",
-    "scanstations-are-being-loaded": "Scannerstationen werden geladen...",
+  "please-provide-the-required-information-to-add-a-new-organization": "Bitte gebe alle nötigen Informationen an, im die neue Organisation zu erstellen.",
-    "search-for-an-organization-by-name-or-id": "Suche eine Organisation (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-runner": "Bitte die benötigten Informationen angeben.",
-    "search-for-an-organization-or-team-by-name-or-id": "Suche eine Organisation oder ein Team (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-team": "Bitte gebe alle nötigen Informationen an, im das neue Team zu erstellen.",
-    "search-for-donor-name-or-id": "Suche eine Spender:in (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-track": "Bitte die benötigten Informationen angeben.",
-    "search-for-permission": "Berechtigungen durchsuchen",
+  "please-provide-the-required-information-to-add-a-new-user": "Bitte gebe alle nötigen Informationen an, im die neue Benutzer:in zu erstellen.",
-    "search-for-runner-by-name-or-id": "Suche eine Läufer:in (via Name oder Id)",
+  "please-provide-the-required-information-to-create-a-new-scanstation": "Bitte gebe alle für eine Scannerstation notwendigen Informationen an",
-    "select-all": "Alle auswählen",
+  "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
-    "select-language": "Sprache auswählen",
+  "privacy": "Datenschutz",
-    "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
+  "privacy-loading": "Datenschutzerklärung lädt...",
-    "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
+  "profile": "Profil",
-    "settings": "Einstellungen",
+  "profile-picture": "Profilbild",
-    "settings-for-your-profile": "Die Einstellungen deines Accounts",
+  "profile-updated": "Profil wurde aktualisiert!",
-    "something-about-the-group": "Infos zur Gruppe",
+  "read-license": "Lizenz-Text lesen",
-    "stats-are-being-loaded": "Die Statistiken werden geladen...",
+  "receipt-needed": "Spendenquittung benötigt",
-    "status": "Status",
+  "repo_link": "Link",
-    "stuff-that-could-harm-your-profile": "Einstellungen, die deinem Profil nachhaltig schaden können",
+  "request-a-new-reset-mail": "Neue Reset-Mail anfordern",
-    "successful-password-reset": "Passwort erfolgreich zurückgesetzt!",
+  "reset-my-password": "Passwort zurücksetzen",
-    "team": "Team",
+  "reset-password": "Passwort zurücksetzen",
-    "team-detail-is-being-loaded": "Team wird geladen...",
+  "runner": "Läufer:in",
-    "team-name": "Teamname",
+  "runner-added": "Läufer:in hinzugefügt",
-    "team-name-is-required": "Teamname ist erforderlich",
+  "runner-import": "Läufer:innen Import",
-    "teams": "Teams",
+  "runner-is-being-added": "Läufer:in wird hinzugefügt...",
-    "teams-are-being-loaded": "Teams werden geladen ...",
+  "runner-updated": "Läufer:in aktualisiert!",
-    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "Die angegebene Telefonnummer ist nicht korrekt. <br /> Bitte gebe eine Telefonnummer im internationalen Format an...",
+  "runnerimport_verify_runners_org": "Bitte die Läufer:innen für den Import in die Organisation \"{org_name}\" bestätigen",
-    "the-scans-distance-must-be-greater-than-0m": "Die Distanz muss größer als 0m sein.",
+  "runners": "Läufer",
-    "there-are-no-contacts-added-yet": "Es wurden noch keine Kontakte hinzugefügt.",
+  "runners-are-being-imported": "Läufer:innen werden importiert ...",
-    "there-are-no-donations-yet": "Es gibt noch keine Sponsorings",
+  "runners-are-being-loaded": "Läufer:innen werden geladen ...",
-    "there-are-no-donors-yet": "Es gibt noch keine Sponsor:innen",
+  "save": "Speichern",
-    "there-are-no-groups-yet": "Es gibt noch keine Gruppen",
+  "save-changes": "Änderungen speichern",
-    "there-are-no-organizations-added-yet": "Es wurden noch keine Organisationen hinzugefügt.",
+  "scan-added": "Scan hinzugefügt",
-    "there-are-no-runners-added-yet": "Es wurden noch keine Läufer:innen hinzugefügt.",
+  "scan-is-being-updated": "Scan wird aktualisiert",
-    "there-are-no-scans-yet": "Es gibt noch keine Scans",
+  "scan-with-fixed-distance": "Scan mit Festdistanz",
-    "there-are-no-teams-added-yet": "Es wurden noch keine Teams hinzugefügt.",
+  "scans": "Scans",
-    "there-are-no-users-added-yet": "Es wurden noch keine Benutzer hinzugefügt.",
+  "scans-are-being-loaded": "Scans werden geladen",
-    "this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
+  "scanstation": "Scanner Station",
-    "this-scanstation-is": "Diese Station ist",
+  "scanstation-added": "Station wurde erstellt",
-    "total-distance": "gelaufene Strecke",
+  "scanstation-is-being-added": "Scannerstation wird angelegt...",
-    "total-donation-amount": "Gesamtbetrag",
+  "scanstations": "Scanner Stationen",
-    "total-donations": "Spendensumme",
+  "scanstations-are-being-loaded": "Scannerstationen werden geladen...",
-    "total-scans": "gesamte Scans",
+  "search-for-an-organization-by-name-or-id": "Suche eine Organisation (via Name oder Id)",
-    "track": "Track",
+  "search-for-an-organization-or-team-by-name-or-id": "Suche eine Organisation oder ein Team (via Name oder Id)",
-    "track-added": "Track hinzugefügt",
+  "search-for-donor-name-or-id": "Suche eine Spender:in (via Name oder Id)",
-    "track-data-is-being-loaded": "Trackdaten werden geladen",
+  "search-for-permission": "Berechtigungen durchsuchen",
-    "track-is-being-added": "Track wird hinzugefügt...",
+  "search-for-runner-by-name-or-id": "Suche eine Läufer:in (via Name oder Id)",
-    "track-length-in-m": "Tracklänge (in Metern)",
+  "select-all": "Alle auswählen",
-    "track-length-must-be-greater-than-0": "Die Länge muss größer als 0 (Meter) sein",
+  "select-language": "Sprache auswählen",
-    "track-name": "Trackname",
+  "selfservice-registration": "Selfservice Registrierung",
-    "track-name-must-not-be-empty": "Der Name muss angegeben werden",
+  "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
-    "tracks": "Tracks",
+  "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
-    "update-password": "Passwort ändern",
+  "settings": "Einstellungen",
-    "updated-contact": "Kontakt aktualisiert!",
+  "settings-for-your-profile": "Die Einstellungen deines Accounts",
-    "updated-donor": "Sponsor:in wurde aktualisiert",
+  "something-about-the-group": "Infos zur Gruppe",
-    "updated-organization": "Organisation wurde aktualisiert",
+  "stats-are-being-loaded": "Die Statistiken werden geladen...",
-    "updated-scan": "Scan wurde aktualisiert",
+  "status": "Status",
-    "updateing-group": "Gruppe wird aktualisiert...",
+  "stuff-that-could-harm-your-profile": "Einstellungen, die deinem Profil nachhaltig schaden können",
-    "updating-organization": "Organisation wird aktualisiert",
+  "successful-password-reset": "Passwort erfolgreich zurückgesetzt!",
-    "updating-permissions": "Berechtigungen werden aktualisiert...",
+  "team": "Team",
-    "updating-runner": "Läufer:in wird aktualisiert.",
+  "team-detail-is-being-loaded": "Team wird geladen...",
-    "updating-user": "Benutzer:in wird aktualisiert...",
+  "team-name": "Teamname",
-    "updating-your-profile": "Profil wird aktualisiert...",
+  "team-name-is-required": "Teamname ist erforderlich",
-    "user-added": "Benutzer hinzugefügt",
+  "teams": "Teams",
-    "user-groups": "Benutzergruppen",
+  "teams-are-being-loaded": "Teams werden geladen ...",
-    "user-is-being-added": "Benutzer wird hinzugefügt ...",
+  "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "Die angegebene Telefonnummer ist nicht korrekt. <br /> Bitte gebe eine Telefonnummer im internationalen Format an...",
-    "user-updated": "Benutzer:in wurde aktualisiert",
+  "the-scans-distance-must-be-greater-than-0m": "Die Distanz muss größer als 0m sein.",
-    "username": "Benutzername",
+  "the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again": "Der Scannerstation Token wird nur einmal angezeigt - du kannst ihn nicht ändern oder ihn dir nochmal anzeigen lassen!",
-    "users": "Benutzer",
+  "there-are-no-cards-yet": "Es gibt noch keine Läuferkarten.",
-    "valid": "Gültig",
+  "there-are-no-contacts-added-yet": "Es wurden noch keine Kontakte hinzugefügt.",
-    "valid-city-is-required": "Du musst eine Stadt angeben",
+  "there-are-no-donations-yet": "Es gibt noch keine Sponsorings",
-    "valid-email-is-required": "Es wird eine valide E-Mail Adresse benötigt",
+  "there-are-no-donors-yet": "Es gibt noch keine Sponsor:innen",
-    "valid-international-phone-number-is-required": "Du musst eine Telefonnummer im internationalen Format angeben...",
+  "there-are-no-groups-yet": "Es gibt noch keine Gruppen",
-    "valid-zipcode-postal-code-is-required": "Du musst eine valide Postleitzahl angeben",
+  "there-are-no-organizations-added-yet": "Es wurden noch keine Organisationen hinzugefügt.",
-    "verfuegbare": "Verfügbar",
+  "there-are-no-runners-added-yet": "Es wurden noch keine Läufer:innen hinzugefügt.",
-    "welcome_wavinghand": "Willkommen 👋",
+  "there-are-no-scans-yet": "Es gibt noch keine Scans",
-    "yes-i-copied-the-token": "Ja, ich habe den Token kopiert",
+  "there-are-no-teams-added-yet": "Es wurden noch keine Teams hinzugefügt.",
-    "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "Du wirst all deine Berechtigungen und den Zugriff aufs Läufersystem verlieren!",
+  "there-are-no-users-added-yet": "Es wurden noch keine Benutzer hinzugefügt.",
-    "you-can-now-use-your-new-password-to-log-in-to-your-account": "Du kannst dich jetzt mit deinem neuen Passwort anmelden! 🎉",
+  "this-card-is": "Diese Karte ist",
-    "you-dont-have-any-scanstations-yet": "Es gibt noch keine Scannerstationen",
+  "this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
-    "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
+  "this-scanstation-is": "Diese Station ist",
-    "zip-postal-code": "Postleitzahl"
+  "token": "Token",
-}
+  "total-distance": "gelaufene Strecke",
+  "total-donation-amount": "Gesamtbetrag",
+  "total-donations": "Spendensumme",
+  "total-scans": "gesamte Scans",
+  "track": "Track",
+  "track-added": "Track hinzugefügt",
+  "track-data-is-being-loaded": "Trackdaten werden geladen",
+  "track-is-being-added": "Track wird hinzugefügt...",
+  "track-length-in-m": "Tracklänge (in Metern)",
+  "track-length-must-be-greater-than-0": "Die Länge muss größer als 0 (Meter) sein",
+  "track-name": "Trackname",
+  "track-name-must-not-be-empty": "Der Name muss angegeben werden",
+  "tracks": "Tracks",
+  "update-password": "Passwort ändern",
+  "updated-contact": "Kontakt aktualisiert!",
+  "updated-donor": "Sponsor:in wurde aktualisiert",
+  "updated-organization": "Organisation wurde aktualisiert",
+  "updated-scan": "Scan wurde aktualisiert",
+  "updateing-group": "Gruppe wird aktualisiert...",
+  "updating-card": "Karte wird aktualisiert",
+  "updating-organization": "Organisation wird aktualisiert",
+  "updating-permissions": "Berechtigungen werden aktualisiert...",
+  "updating-runner": "Läufer:in wird aktualisiert.",
+  "updating-user": "Benutzer:in wird aktualisiert...",
+  "updating-your-profile": "Profil wird aktualisiert...",
+  "user-added": "Benutzer hinzugefügt",
+  "user-groups": "Benutzergruppen",
+  "user-is-being-added": "Benutzer wird hinzugefügt ...",
+  "user-updated": "Benutzer:in wurde aktualisiert",
+  "username": "Benutzername",
+  "users": "Benutzer",
+  "valid": "Gültig",
+  "valid-city-is-required": "Du musst eine Stadt angeben",
+  "valid-email-is-required": "Es wird eine valide E-Mail Adresse benötigt",
+  "valid-international-phone-number-is-required": "Du musst eine Telefonnummer im internationalen Format angeben...",
+  "valid-zipcode-postal-code-is-required": "Du musst eine valide Postleitzahl angeben",
+  "verfuegbare": "Verfügbar",
+  "welcome_wavinghand": "Willkommen 👋",
+  "yes-i-copied-the-token": "Ja, ich habe den Token kopiert",
+  "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "Du wirst all deine Berechtigungen und den Zugriff aufs Läufersystem verlieren!",
+  "you-can-now-use-your-new-password-to-log-in-to-your-account": "Du kannst dich jetzt mit deinem neuen Passwort anmelden! 🎉",
+  "you-can-provide-a-runner-but-you-dont-have-to": "Du kannst eine Läufer:in angeben, musst aber nicht.",
+  "you-dont-have-any-scanstations-yet": "Es gibt noch keine Scannerstationen",
+  "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
+  "you-have-to-save-your-changes-to-generate-a-link": "Du musst deine Änderungen speichern, um einen Link zu generieren.",
+  "you-must-create-at-least-one-card-or-cancel": "Du musst mindestens eine Blankokarte erstellen (oder abbrechen).",
+  "zip-postal-code": "Postleitzahl",
+  "generate-runner-certificates": "Urkunden generieren"
+}

src/locales/en.json

@@ -1,380 +1,429 @@
 {
-    "404message": "Sorry, the page you are looking for could not be found.",
+  "404message": "Sorry, the page you are looking for could not be found.",
-    "404title": "Error 404",
+  "404title": "Error 404",
-    "about": "About",
+  "about": "About",
-    "action": "Action",
+  "action": "Action",
-    "active": "Active",
+  "active": "Active",
-    "add-donation": "Add donation",
+  "add-card": "Add Card",
-    "add-donor": "add donor",
+  "add-donation": "Add donation",
-    "add-scan": "Add scan",
+  "add-donor": "add donor",
-    "add-the-first-scanstation": "Add your first scanstation.",
+  "add-scan": "Add scan",
-    "add-user-group": "Add User Group",
+  "add-the-first-scanstation": "Add your first scanstation.",
-    "add-your-first-contact": "Add your first contact",
+  "add-user-group": "Add User Group",
-    "add-your-first-donor": "add your first donor",
+  "add-your-first-card": "Add your first card",
-    "add-your-first-group": "Add your first group",
+  "add-your-first-contact": "Add your first contact",
-    "add-your-first-organization": "Add your first organization",
+  "add-your-first-donor": "add your first donor",
-    "add-your-first-runner": "Add your first runner",
+  "add-your-first-group": "Add your first group",
-    "add-your-first-team": "Add your first team",
+  "add-your-first-organization": "Add your first organization",
-    "add-your-first-track": "Add your first track.",
+  "add-your-first-runner": "Add your first runner",
-    "add-your-first-user": "Add your first user",
+  "add-your-first-team": "Add your first team",
-    "add-your-fist-donation": "Add your fist donation",
+  "add-your-first-track": "Add your first track.",
-    "add-your-fist-scan": "Add your fist scan",
+  "add-your-first-user": "Add your first user",
-    "adding-scan": "Adding Scan",
+  "add-your-fist-donation": "Add your fist donation",
-    "address": "Address",
+  "add-your-fist-scan": "Add your fist scan",
-    "address-is-required": "Address is required",
+  "adding-card": "Adding Card",
-    "after-deletion-we-cant-restore-your-old-profile": "After deletion we can't restore your old profile!",
+  "adding-scan": "Adding Scan",
-    "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "After the update you'll get logged out - Please login with your new password after that.",
+  "address": "Address",
-    "all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
+  "address-is-required": "Address is required",
-    "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
+  "after-deletion-we-cant-restore-your-old-profile": "After deletion we can't restore your old profile!",
-    "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
+  "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "After the update you'll get logged out - Please login with your new password after that.",
-    "amount-per-kilometer": "Amount per kilometer",
+  "all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
-    "apartment-suite-etc": "Apartment, suite, etc.",
+  "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
-    "application_name": "Lauf für Kaya! - Admin",
+  "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
-    "applying-changes": "Applying Changes",
+  "amount": "Amount",
-    "attention": "Attention!",
+  "amount-per-kilometer": "Amount per kilometer",
-    "author": "Author",
+  "apartment-suite-etc": "Apartment, suite, etc.",
-    "bitte-bestaetige-diese-laeufer-fuer-den-import": "Please confirm these runners for import.",
+  "application_name": "Lauf für Kaya! - Admin",
-    "by": "by",
+  "applying-changes": "Applying Changes",
-    "cancel": "Cancel",
+  "attention": "Attention!",
-    "cancel-delete": "Cancel Delete",
+  "author": "Author",
-    "cancel-keep-donor": "Cancel, keep donor",
+  "bitte-bestaetige-diese-laeufer-fuer-den-import": "Please confirm these runners for import.",
-    "cancel-keep-my-profile": "Cancel, keep my profile",
+  "by": "by",
-    "cancel-keep-organization": "Cancel, keep organization",
+  "cancel": "Cancel",
-    "cancel-keep-team": "Cancel, keep team",
+  "cancel-delete": "Cancel Delete",
-    "cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
+  "cancel-keep-donor": "Cancel, keep donor",
-    "change-your-password-here": "Change your password here",
+  "cancel-keep-my-profile": "Cancel, keep my profile",
-    "changing-your-password": "Changing your password",
+  "cancel-keep-organization": "Cancel, keep organization",
-    "city": "City",
+  "cancel-keep-team": "Cancel, keep team",
-    "close": "Close",
+  "cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
-    "configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
+  "card-added": "Card added",
-    "confirm": "Confirm",
+  "card-deleted": "Card deleted",
-    "confirm-delete": "Confirm Delete",
+  "card-updated": "Card updated",
-    "confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
+  "cards": "Cards",
-    "confirm-delete-my-user-profile": "Confirm, delete my user profile",
+  "change-your-password-here": "Change your password here",
-    "confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
+  "changing-your-password": "Changing your password",
-    "confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
+  "city": "City",
-    "confirm-deletion": "Confirm Deletion",
+  "click-to-copy-the-link-into-your-clipboard": "Click to copy the link into your clipboard",
-    "confirm-the-new-password": "Confirm the new password",
+  "click-to-copy-token-to-clipboard": "Click to copy the token to your clipboard",
-    "contact": "Contact",
+  "close": "Close",
-    "contact-deleted": "Contact deleted",
+  "code": "Code",
-    "contact-information": "Contact Information",
+  "configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
-    "contact-is-being-updated": "Contact is being updated...",
+  "confirm": "Confirm",
-    "contact-is-not-a-member-in-any-group": "Contact is not a member in any group",
+  "confirm-delete": "Confirm Delete",
-    "contacts": "Contacts",
+  "confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
-    "contacts-are-being-loaded": "contacts are being loaded...",
+  "confirm-delete-my-user-profile": "Confirm, delete my user profile",
-    "count_organizations": "# Organizations",
+  "confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
-    "count_teams": "# Teams",
+  "confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
-    "create": "Create",
+  "confirm-deletion": "Confirm Deletion",
-    "create-a-new": "Create a new",
+  "confirm-the-new-password": "Confirm the new password",
-    "create-a-new-contact": "Create a new contact",
+  "contact": "Contact",
-    "create-a-new-distance-donation": "Create a new distance donation",
+  "contact-deleted": "Contact deleted",
-    "create-a-new-donor": "Create a new donor",
+  "contact-information": "Contact Information",
-    "create-a-new-fixed-donation": "Create a new fixed donation",
+  "contact-is-being-updated": "Contact is being updated...",
-    "create-a-new-organization": "Create a new Organization",
+  "contact-is-not-a-member-in-any-group": "Contact is not a member in any group",
-    "create-a-new-runner": "Create a new Runner",
+  "contacts": "Contacts",
-    "create-a-new-scan-fixed-only": "Create a new scan (fixed only)",
+  "contacts-are-being-loaded": "contacts are being loaded...",
-    "create-a-new-scanstation": "Create a new station",
+  "copied-link-to-clipboard": "Copied link to clipboard",
-    "create-a-new-team": "Create a new team",
+  "copied-token-to-clipboard": "Copied token to clipboard",
-    "create-a-new-track": "Create a new Track",
+  "count_organizations": "# Organizations",
-    "create-a-new-user": "Create a new User",
+  "count_teams": "# Teams",
-    "create-a-new-user-group": "Create a new user group",
+  "create": "Create",
-    "create-organization": "Create Organization",
+  "create-a-new": "Create a new",
-    "create-team": "Create Team",
+  "create-a-new-card": "Create a new card",
-    "create-track": "Create Track",
+  "create-a-new-contact": "Create a new contact",
-    "create-user": "Create User",
+  "create-a-new-distance-donation": "Create a new distance donation",
-    "credits": "Credits",
+  "create-a-new-donor": "Create a new donor",
-    "csv_import__class": "Class",
+  "create-a-new-fixed-donation": "Create a new fixed donation",
-    "csv_import__firstname": "Firstname",
+  "create-a-new-organization": "Create a new Organization",
-    "csv_import__lastname": "Lastname",
+  "create-a-new-runner": "Create a new Runner",
-    "csv_import__middlename": "Middlename",
+  "create-a-new-scan-fixed-only": "Create a new scan (fixed only)",
-    "csv_import__team": "Team",
+  "create-a-new-scanstation": "Create a new station",
-    "danger-zone": "Danger zone",
+  "create-a-new-team": "Create a new team",
-    "dashboard-greeting": "Hello",
+  "create-a-new-track": "Create a new Track",
-    "dashboard-title": "Dashboard",
+  "create-a-new-user": "Create a new User",
-    "datatable": {
+  "create-a-new-user-group": "Create a new user group",
-        "search": "🔍 Search...",
+  "create-and-generate-pdf": "Create and generate PDF",
-        "sort_column_ascending": "Sort column ascending",
+  "create-bulk-blanco-cards": "Create bulk blanco cards",
-        "sort_column_descending": "Sort column descending",
+  "create-bulk-cards": "Add blanco cards",
-        "previous": "Previous",
+  "create-organization": "Create Organization",
-        "next": "Next",
+  "create-team": "Create Team",
-        "page": "Page",
+  "create-track": "Create Track",
-        "showing": "Showing",
+  "create-user": "Create User",
-        "records": "Records",
+  "create-without-pdf": "Create without PDF",
-        "of": "of",
+  "created-blanco-cards": "Created blanco cards",
-        "to": "to",
+  "creating-blanco-cards": "Creating blanco cards",
-        "loading": "Loading...",
+  "credits": "Credits",
-        "no_matching_records_found": "No matching records found",
+  "csv_import__class": "Class",
-        "an_error_happened_while_fetching_the_data": "An error happened while fetching the data"
+  "csv_import__firstname": "Firstname",
-    },
+  "csv_import__lastname": "Lastname",
-    "delete": "Delete",
+  "csv_import__middlename": "Middlename",
-    "delete-contact": "Delete Contact",
+  "csv_import__team": "Team",
-    "delete-donation": "Delete Donation",
+  "danger-zone": "Danger zone",
-    "delete-donor": "Delete donor",
+  "dashboard-greeting": "Hello",
-    "delete-group": "Delete Group",
+  "dashboard-title": "Dashboard",
-    "delete-organization": "Delete Organization",
+  "datatable": {
-    "delete-profile": "Delete Profile",
+    "search": "🔍 Search...",
-    "delete-runner": "Delete Runner",
+    "sort_column_ascending": "Sort column ascending",
-    "delete-scan": "Delete scan",
+    "sort_column_descending": "Sort column descending",
-    "delete-station": "Delete station",
+    "previous": "Previous",
-    "delete-team": "Delete Team",
+    "next": "Next",
-    "delete-user": "Delete User",
+    "page": "Page",
-    "deleted-scan": "Deleted scan",
+    "showing": "Showing",
-    "dependency_name": "Name",
+    "records": "Records",
-    "description": "description",
+    "of": "of",
-    "description-optional": "Description (optional)",
+    "to": "to",
-    "deselect-all": "deselect all",
+    "loading": "Loading...",
-    "details": "Details",
+    "no_matching_records_found": "No matching records found",
-    "distance": "Distance",
+    "an_error_happened_while_fetching_the_data": "An error happened while fetching the data"
-    "distance-donation": "distance donation",
+  },
-    "distance-in-km": "Distance in km",
+  "delete": "Delete",
-    "distance-track": "Distance (+Track)",
+  "delete-contact": "Delete Contact",
-    "do-you-really-want-to-delete-your-profile": "Do you really want to delete your profile?",
+  "delete-donation": "Delete Donation",
-    "do-you-want-to-delete-the-organization-delete_org-name": "Do you want to delete the organization {orgname}?",
+  "delete-donor": "Delete donor",
-    "do-you-want-to-delete-the-team-delete_team-name": "Do you want to delete the team {teamname}?",
+  "delete-group": "Delete Group",
-    "do-you-want-to-delete-this-donor-with-all-related-donations": "Do you want to delete this donor with all related donations",
+  "delete-organization": "Delete Organization",
-    "documentation": "Documentation",
+  "delete-profile": "Delete Profile",
-    "donation-amount": "Donation amount",
+  "delete-runner": "Delete Runner",
-    "donation-amount-must-be-greater-that-0-00eur": "Donation amount must be greater that 0.00€",
+  "delete-scan": "Delete scan",
-    "donations": "Donations",
+  "delete-station": "Delete station",
-    "donor": "Donor",
+  "delete-team": "Delete Team",
-    "donor-added": "Donor added",
+  "delete-user": "Delete User",
-    "donor-deleted": "donor deleted",
+  "deleted-scan": "Deleted scan",
-    "donor-has-no-associated-donations": "Donor has no associated donations.",
+  "dependency_name": "Name",
-    "donor-is-being-added": "Donor is being added...",
+  "description": "description",
-    "donor-is-being-updated": "Donor is being updated",
+  "description-optional": "Description (optional)",
-    "donors": "Donors",
+  "deselect-all": "deselect all",
-    "donors-are-being-loaded": "donors are being loaded",
+  "details": "Details",
-    "dont-have-your-email-connected": "Don't have your email connected?",
+  "disabled": "disabled",
-    "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
+  "distance": "Distance",
-    "e-mail-adress": "E-Mail Adress",
+  "distance-donation": "distance donation",
-    "edit": "Edit",
+  "distance-in-km": "Distance in km",
-    "edit-permissions": "edit permissions",
+  "distance-track": "Distance (+Track)",
-    "email_address_or_username": "Email / username",
+  "do-you-really-want-to-delete-your-profile": "Do you really want to delete your profile?",
-    "enabled": "enabled",
+  "do-you-want-to-delete-the-organization-delete_org-name": "Do you want to delete the organization {orgname}?",
-    "english": "English",
+  "do-you-want-to-delete-the-team-delete_team-name": "Do you want to delete the team {teamname}?",
-    "error_on_login": "Error on login",
+  "do-you-want-to-delete-this-donor-with-all-related-donations": "Do you want to delete this donor with all related donations",
-    "erteilte": "Directly granted",
+  "documentation": "Documentation",
-    "everything-concerning-your-profile": "Everything concerning your profile",
+  "donation-amount": "Donation amount",
-    "everything-is-more-fun-together": "everything is more fun together 🏃‍♂️🏃‍♀️🏃‍♂️",
+  "donation-amount-must-be-greater-that-0-00eur": "Donation amount must be greater that 0.00€",
-    "faq": "FAQ",
+  "donations": "Donations",
-    "filter-by-organization-team": "Filter by Organization/ Team",
+  "donor": "Donor",
-    "first-name": "First name",
+  "donor-added": "Donor added",
-    "first-name-is-required": "First Name is required",
+  "donor-deleted": "donor deleted",
-    "first-scan-of-the-day": "First scan of the day.",
+  "donor-has-no-associated-donations": "Donor has no associated donations.",
-    "fixed-donation": "fixed donation",
+  "donor-is-being-added": "Donor is being added...",
-    "forgot_password": "Forgot your password?",
+  "donor-is-being-updated": "Donor is being updated",
-    "geerbte": "inherited",
+  "donors": "Donors",
-    "general-stats": "General Stats",
+  "donors-are-being-loaded": "donors are being loaded",
-    "general_promise_error": "😢 Error",
+  "dont-have-your-email-connected": "Don't have your email connected?",
-    "generate-sponsoring-contract": "generate sponsoring contract",
+  "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
-    "generate-sponsoring-contracts": "generate sponsoring contracts",
+  "e-mail-adress": "E-Mail Adress",
-    "generating-pdf": "generating PDF...",
+  "edit": "Edit",
-    "generating-pdfs": "generating PDFs...",
+  "edit-a-card": "Edit a card",
-    "generic-ui-logic-error": "Something went wrong in the UI logic",
+  "edit-permissions": "edit permissions",
-    "german": "German",
+  "email_address_or_username": "Email / username",
-    "go-to-login": "Go To Login",
+  "enabled": "enabled",
-    "goback": "Go Home",
+  "enabled_large": "Enabled",
-    "granted": "granted",
+  "english": "English",
-    "group": "Group",
+  "error-during-import": "Error during import",
-    "group-added": "Group added",
+  "error-whyile-copying-to-clipboard": "Error while copying to clipboard",
-    "group-is-being-added": "Group is being added...",
+  "error_on_login": "Error on login",
-    "group-name-is-required": "Group name is required",
+  "erteilte": "Directly granted",
-    "group-updated": "group updated",
+  "everything-concerning-your-profile": "Everything concerning your profile",
-    "groups": "Groups",
+  "everything-is-more-fun-together": "everything is more fun together 🏃‍♂️🏃‍♀️🏃‍♂️",
-    "groups-are-being-loaded": "Groups are being loaded",
+  "faq": "FAQ",
-    "home": "Home",
+  "filter-by-organization-team": "Filter by Organization/ Team",
-    "icon-image-credits": "We also want to thank these projects for illustrations and icons:",
+  "first-name": "First name",
-    "import-finished": "Import finished",
+  "first-name-is-required": "First Name is required",
-    "import-runners": "Import runners",
+  "first-scan-of-the-day": "First scan of the day.",
-    "import__target-organization": "Target Organization",
+  "fixed-donation": "fixed donation",
-    "imprint": "Imprint",
+  "forgot_password": "Forgot your password?",
-    "imprint-loading": "Imprint loading...",
+  "geerbte": "inherited",
-    "inactive": "Inactive",
+  "general-stats": "General Stats",
-    "installed-version": "Installed version",
+  "general_promise_error": "😢 Error",
-    "internal-error": "Internal Error",
+  "generate-runnercards": "Generate Runnercards",
-    "invalid": "Invalid",
+  "generate-sponsoring-contract": "generate sponsoring contract",
-    "invalid-mail-reset": "the provided email is invalid",
+  "generate-sponsoring-contracts": "generate sponsoring contracts",
-    "laeufer-hinzufuegen": "Add runner",
+  "generating-pdf": "generating PDF...",
-    "laeufer-importieren": "Läufer importieren",
+  "generating-pdfs": "generating PDFs...",
-    "laptime": "Laptime",
+  "generic-ui-logic-error": "Something went wrong in the UI logic",
-    "last-name": "Last name",
+  "german": "German",
-    "last-name-is-required": "Last Name is required",
+  "go-to-login": "Go To Login",
-    "lfk-is-os": "The \"Lauf für Kaya!\" Frontend is (like all other projects for the \"LfK!\" Also) an open source project.",
+  "goback": "Go Home",
-    "license": "License",
+  "granted": "granted",
-    "licenses-are-being-loaded": "Licenses are being loaded...",
+  "group": "Group",
-    "loading-contact-details": "Loading contact details...",
+  "group-added": "Group added",
-    "loading-donation-details": "Loading donation details",
+  "group-is-being-added": "Group is being added...",
-    "loading-donor-details": "Loading donor details",
+  "group-name-is-required": "Group name is required",
-    "loading-group-detail": "Loading group detail...",
+  "group-updated": "group updated",
-    "loading-profile-data": "Loading profile data",
+  "groups": "Groups",
-    "loading-runners": "loading runners...",
+  "groups-are-being-loaded": "Groups are being loaded",
-    "loading-station-details": "Loading station details",
+  "home": "Home",
-    "log_in": "Log in",
+  "icon-image-credits": "We also want to thank these projects for illustrations and icons:",
-    "log_in_to_your_account": "Log in to your account",
+  "if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button": "If you want to create multiple blanco cards: Try the 'Add blanco cards' button.",
-    "login_is_checked": "Login is being checked...",
+  "import-finished": "Import finished",
-    "logout": "Logout",
+  "import-runners": "Import runners",
-    "mail-validation-in-progress": "mail validation in progress...",
+  "import__target-organization": "Target Organization",
-    "manage-admin-users": "manage admin users",
+  "imprint": "Imprint",
-    "middle-name": "Middle name",
+  "imprint-loading": "Imprint loading...",
-    "minimum-lap-time-in-s": "minimum lap time in s",
+  "inactive": "Inactive",
-    "minimum-lap-time-must-be-a-positive-number-or-0": "minimum lap time must be a positive number or 0",
+  "installed-version": "Installed version",
-    "name": "Name",
+  "internal-error": "Internal Error",
-    "name-is-required": "Name is required",
+  "invalid": "Invalid",
-    "new-password": "New password",
+  "invalid-mail-reset": "the provided email is invalid",
-    "no-contact-found": "No contacts found",
+  "just-enter-how-many-you-want-and-the-system-will-create-them": "Just enter how many you want and the system will create them",
-    "no-contact-selected": "No contact selected",
+  "laeufer-hinzufuegen": "Add runner",
-    "no-contact-specified": "no contact specified",
+  "laeufer-importieren": "Läufer importieren",
-    "no-donors-found": "No donors found",
+  "laptime": "Laptime",
-    "no-license-text-could-be-found": "No license text could be found 😢",
+  "last-name": "Last name",
-    "no-organization-or-team-found": "No organization or team found",
+  "last-name-is-required": "Last Name is required",
-    "no-organization-specified": "no organization specified",
+  "lfk-is-os": "The \"Lauf für Kaya!\" Frontend is (like all other projects for the \"LfK!\" Also) an open source project.",
-    "no-organizations-found": "No organizations found",
+  "license": "License",
-    "no-runners-found": "No runners found",
+  "licenses-are-being-loaded": "Licenses are being loaded...",
-    "no-tracks-added-yet": "there are no tracks added yet.",
+  "loading-cards": "Loading cards",
-    "organization": "Organization",
+  "loading-contact-details": "Loading contact details...",
-    "organization-added": "Organization added",
+  "loading-donation-details": "Loading donation details",
-    "organization-deleted": "Organization deleted",
+  "loading-donor-details": "Loading donor details",
-    "organization-detail-is-being-loaded": "organization detail is being loaded...",
+  "loading-group-detail": "Loading group detail...",
-    "organization-is-being-added": "Organization is being added...",
+  "loading-profile-data": "Loading profile data",
-    "organization-name-is-required": "Organization name is required",
+  "loading-runners": "loading runners...",
-    "organizations": "Organizations",
+  "loading-station-details": "Loading station details",
-    "organizations-are-being-loaded": "organizations are being loaded...",
+  "log_in": "Log in",
-    "orgs": "Organizations",
+  "log_in_to_your_account": "Log in to your account",
-    "oss_credit_description": "We use a lot of open source software on these projects, and would like to thank the following projects and contributors who help make open source great!",
+  "login_is_checked": "Login is being checked...",
-    "password": "Password",
+  "logout": "Logout",
-    "password-changed": "Password changed!",
+  "mail-validation-in-progress": "mail validation in progress...",
-    "password-is-required": "Password is required",
+  "manage-admin-users": "manage admin users",
-    "password-reset-failed": "Password reset failed!",
+  "middle-name": "Middle name",
-    "password-reset-in-progress": "Password Reset in Progress...",
+  "minimum-lap-time-in-s": "minimum lap time in s",
-    "password-reset-mail-sent": "Password reset mail was sent to \"{usersEmail}\".",
+  "minimum-lap-time-must-be-a-positive-number-or-0": "minimum lap time must be a positive number or 0",
-    "password-reset-successful": "Password Reset successful!",
+  "must-be-at-least-10-characters-long": "Must be at least 10 characters long!",
-    "passwords-dont-match": "Passwords don't match",
+  "must-contain-a-lowercase-letter": "Must contain a lowercase letter!",
-    "pdf-generation-failed": "PDF generation failed!",
+  "must-contain-a-number": "Must contain a number!",
-    "pdf-successfully-generated": "PDF successfully generated!",
+  "must-contain-a-uppercase-letter": "Must contain a uppercase letter!",
-    "pdfs-successfully-generated": "PDFs successfully generated!",
+  "name": "Name",
-    "per-kilometer": "per Kilometer",
+  "name-is-required": "Name is required",
-    "permissions": "Permissions",
+  "new-password": "New password",
-    "permissions-updated": "Permissions updated!",
+  "no-contact-found": "No contacts found",
-    "phone": "Phone",
+  "no-contact-selected": "No contact selected",
-    "please-provide-a-password": "Please provide a password...",
+  "no-contact-specified": "no contact specified",
-    "please-provide-the-nessecary-information-to-add-a-new-donor": "Please provide the nessecary information to add a new donor",
+  "no-donors-found": "No donors found",
-    "please-provide-the-nessecary-information-to-create-a-new-donation": "Please provide the nessecary information to create a new donation",
+  "no-license-text-could-be-found": "No license text could be found 😢",
-    "please-provide-the-nessecary-information-to-create-a-new-scan": "Please provide the nessecary information to create a new scan.",
+  "no-organization-or-team-found": "No organization or team found",
-    "please-provide-the-required-csv-xlsx-file": "Please provide the required csv/ xlsx file",
+  "no-organization-specified": "no organization specified",
-    "please-provide-the-required-information-for-creating-a-new-user-group": "Please provide the required information for creating a new user group.",
+  "no-organizations-found": "No organizations found",
-    "please-provide-the-required-information-to-add-a-new-contact": "Please provide the required information to add a new contact.",
+  "no-runners-found": "No runners found",
-    "please-provide-the-required-information-to-add-a-new-organization": "Please provide the required information to add a new organization.",
+  "no-tracks-added-yet": "there are no tracks added yet.",
-    "please-provide-the-required-information-to-add-a-new-runner": "Please provide the required information to add a new runner.",
+  "non-blanko": "Non/Blanko",
-    "please-provide-the-required-information-to-add-a-new-team": "Please provide the required information to add a new team.",
+  "organization": "Organization",
-    "please-provide-the-required-information-to-add-a-new-track": "Please provide the required information to add a new track.",
+  "organization-added": "Organization added",
-    "please-provide-the-required-information-to-add-a-new-user": "Please provide the required information to add a new user.",
+  "organization-deleted": "Organization deleted",
-    "please-request-a-new-reset-mail": "Please request a new reset mail...",
+  "organization-detail-is-being-loaded": "organization detail is being loaded...",
-    "privacy": "Privacy",
+  "organization-is-being-added": "Organization is being added...",
-    "privacy-loading": "Privacy loading...",
+  "organization-name-is-required": "Organization name is required",
-    "profile": "Profile",
+  "organizations": "Organizations",
-    "profile-picture": "Profile Picture",
+  "organizations-are-being-loaded": "organizations are being loaded...",
-    "profile-updated": "Profile updated!",
+  "orgs": "Organizations",
-    "read-license": "Read License",
+  "oss_credit_description": "We use a lot of open source software on these projects, and would like to thank the following projects and contributors who help make open source great!",
-    "receipt-needed": "Receipt needed",
+  "password": "Password",
-    "repo_link": "Link",
+  "password-changed": "Password changed!",
-    "request-a-new-reset-mail": "Request a new reset mail",
+  "password-is-required": "Password is required",
-    "reset-my-password": "Reset my password",
+  "password-reset-failed": "Password reset failed!",
-    "reset-password": "Reset your password",
+  "password-reset-in-progress": "Password Reset in Progress...",
-    "runner": "Runner",
+  "password-reset-mail-sent": "Password reset mail was sent to \"{usersEmail}\".",
-    "runner-added": "Runner added",
+  "password-reset-successful": "Password Reset successful!",
-    "runner-import": "Runner Import",
+  "passwords-dont-match": "Passwords don't match!",
-    "runner-is-being-added": "Runner is being added...",
+  "pdf-generation-failed": "PDF generation failed!",
-    "runner-updated": "Runner updated!",
+  "pdf-successfully-generated": "PDF successfully generated!",
-    "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
+  "pdfs-successfully-generated": "PDFs successfully generated!",
-    "runners": "Runners",
+  "per-kilometer": "per Kilometer",
-    "runners-are-being-imported": "Runners are being imported...",
+  "permissions": "Permissions",
-    "runners-are-being-loaded": "runners are being loaded...",
+  "permissions-updated": "Permissions updated!",
-    "save": "Save",
+  "phone": "Phone",
-    "save-changes": "Save Changes",
+  "please-copy-the-token-and-store-it-somewhere-save": "Please copy the token and store it somewhere safe.",
-    "scan-added": "Scan added",
+  "please-provide-a-password": "Please provide a password...",
-    "scan-is-being-updated": "Scan is being updated",
+  "please-provide-the-nessecary-information-to-add-a-new-donor": "Please provide the nessecary information to add a new donor",
-    "scan-with-fixed-distance": "Scan with fixed distance",
+  "please-provide-the-nessecary-information-to-create-a-new-donation": "Please provide the nessecary information to create a new donation",
-    "scans": "Scans",
+  "please-provide-the-nessecary-information-to-create-a-new-scan": "Please provide the nessecary information to create a new scan.",
-    "scans-are-being-loaded": "Scans are being loaded",
+  "please-provide-the-required-csv-xlsx-file": "Please provide the required csv/ xlsx file",
-    "scanstation": "Scanstation",
+  "please-provide-the-required-information-for-creating-a-new-user-group": "Please provide the required information for creating a new user group.",
-    "scanstations": "Scanstations",
+  "please-provide-the-required-information-to-add-a-new-contact": "Please provide the required information to add a new contact.",
-    "scanstations-are-being-loaded": "Loading scanstations...",
+  "please-provide-the-required-information-to-add-a-new-organization": "Please provide the required information to add a new organization.",
-    "search-for-an-organization-by-name-or-id": "Search for an organization (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-runner": "Please provide the required information to add a new runner.",
-    "search-for-an-organization-or-team-by-name-or-id": "Search for an organization or team (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-team": "Please provide the required information to add a new team.",
-    "search-for-donor-name-or-id": "Search for donor (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-track": "Please provide the required information to add a new track.",
-    "search-for-permission": "Search for permission",
+  "please-provide-the-required-information-to-add-a-new-user": "Please provide the required information to add a new user.",
-    "search-for-runner-by-name-or-id": "Search for runner (by name or id)",
+  "please-provide-the-required-information-to-create-a-new-scanstation": "Please provide the required information to create a new scanstation",
-    "select-all": "select all",
+  "please-request-a-new-reset-mail": "Please request a new reset mail...",
-    "select-language": "Select language",
+  "privacy": "Privacy",
-    "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
+  "privacy-loading": "Privacy loading...",
-    "set-the-user-active-inactive": "set the user active/ inactive",
+  "profile": "Profile",
-    "settings": "Settings",
+  "profile-picture": "Profile Picture",
-    "settings-for-your-profile": "Settings for your profile",
+  "profile-updated": "Profile updated!",
-    "something-about-the-group": "Something about the group...",
+  "read-license": "Read License",
-    "stats-are-being-loaded": "stats are being loaded...",
+  "receipt-needed": "Receipt needed",
-    "status": "Status",
+  "repo_link": "Link",
-    "stuff-that-could-harm-your-profile": "Stuff that could harm your profile",
+  "request-a-new-reset-mail": "Request a new reset mail",
-    "successful-password-reset": "Successful password reset!",
+  "reset-my-password": "Reset my password",
-    "team": "Team",
+  "reset-password": "Reset your password",
-    "team-detail-is-being-loaded": "team detail is being loaded...",
+  "runner": "Runner",
-    "team-name": "Team name",
+  "runner-added": "Runner added",
-    "team-name-is-required": "team name is required",
+  "runner-import": "Runner Import",
-    "teams": "Teams",
+  "runner-is-being-added": "Runner is being added...",
-    "teams-are-being-loaded": "teams are being loaded...",
+  "runner-updated": "Runner updated!",
-    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "the provided phone number is invalid.<br />please enter a valid international number...",
+  "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
-    "the-scans-distance-must-be-greater-than-0m": "The scan's distance must be greater than 0m",
+  "runners": "Runners",
-    "there-are-no-contacts-added-yet": "There are no contacts added yet.",
+  "runners-are-being-imported": "Runners are being imported...",
-    "there-are-no-donations-yet": "There are no donations yet",
+  "runners-are-being-loaded": "runners are being loaded...",
-    "there-are-no-donors-yet": "There are no donors yet",
+  "save": "Save",
-    "there-are-no-groups-yet": "There are no groups yet",
+  "save-changes": "Save Changes",
-    "there-are-no-organizations-added-yet": "There are no organizations added yet.",
+  "scan-added": "Scan added",
-    "there-are-no-runners-added-yet": "There are no runners added yet.",
+  "scan-is-being-updated": "Scan is being updated",
-    "there-are-no-scans-yet": "There are no scans yet",
+  "scan-with-fixed-distance": "Scan with fixed distance",
-    "there-are-no-teams-added-yet": "There are no teams added yet.",
+  "scans": "Scans",
-    "there-are-no-users-added-yet": "There are no users added yet.",
+  "scans-are-being-loaded": "Scans are being loaded",
-    "this-might-take-a-moment": "This might take a moment 👀",
+  "scanstation": "Scanstation",
-    "this-scanstation-is": "This scanstation is",
+  "scanstation-added": "Scanstation added",
-    "total-distance": "total distance",
+  "scanstation-is-being-added": "Adding scanstation...",
-    "total-donation-amount": "total donation amount",
+  "scanstations": "Scanstations",
-    "total-donations": "total donations",
+  "scanstations-are-being-loaded": "Loading scanstations...",
-    "total-scans": "total scans",
+  "search-for-an-organization-by-name-or-id": "Search for an organization (by name or id)",
-    "track": "Track",
+  "search-for-an-organization-or-team-by-name-or-id": "Search for an organization or team (by name or id)",
-    "track-added": "Track added",
+  "search-for-donor-name-or-id": "Search for donor (by name or id)",
-    "track-data-is-being-loaded": "Track data is being loaded",
+  "search-for-permission": "Search for permission",
-    "track-is-being-added": "Track is being added...",
+  "search-for-runner-by-name-or-id": "Search for runner (by name or id)",
-    "track-length-in-m": "Track Length in m",
+  "select-all": "select all",
-    "track-length-must-be-greater-than-0": "Track length must be greater than 0",
+  "select-language": "Select language",
-    "track-name": "Track name",
+  "selfservice-registration": "Selfservice registration",
-    "track-name-must-not-be-empty": "Track name must not be empty",
+  "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
-    "tracks": "Tracks",
+  "set-the-user-active-inactive": "set the user active/ inactive",
-    "update-password": "Update password",
+  "settings": "Settings",
-    "updated-contact": "Updated contact!",
+  "settings-for-your-profile": "Settings for your profile",
-    "updated-donor": "updated donor",
+  "something-about-the-group": "Something about the group...",
-    "updated-organization": "updated organization",
+  "stats-are-being-loaded": "stats are being loaded...",
-    "updated-scan": "updated scan",
+  "status": "Status",
-    "updateing-group": "updateing group...",
+  "stuff-that-could-harm-your-profile": "Stuff that could harm your profile",
-    "updating-organization": "updating organization",
+  "successful-password-reset": "Successful password reset!",
-    "updating-permissions": "updating permissions...",
+  "team": "Team",
-    "updating-runner": "Updating runner...",
+  "team-detail-is-being-loaded": "team detail is being loaded...",
-    "updating-user": "updating user...",
+  "team-name": "Team name",
-    "updating-your-profile": "Updating your profile...",
+  "team-name-is-required": "team name is required",
-    "user-added": "User added",
+  "teams": "Teams",
-    "user-groups": "User Groups",
+  "teams-are-being-loaded": "teams are being loaded...",
-    "user-is-being-added": "User is being added...",
+  "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "the provided phone number is invalid.<br />please enter a valid international number...",
-    "user-updated": "User updated",
+  "the-scans-distance-must-be-greater-than-0m": "The scan's distance must be greater than 0m",
-    "username": "Username",
+  "the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again": "The scanstation api token will only get displayed once - you won't be able to change or view it again!",
-    "users": "Users",
+  "there-are-no-cards-yet": "There are no cards yet.",
-    "valid": "Valid",
+  "there-are-no-contacts-added-yet": "There are no contacts added yet.",
-    "valid-city-is-required": "Valid city is required",
+  "there-are-no-donations-yet": "There are no donations yet",
-    "valid-email-is-required": "valid email is required",
+  "there-are-no-donors-yet": "There are no donors yet",
-    "valid-international-phone-number-is-required": "valid international phone number is required...",
+  "there-are-no-groups-yet": "There are no groups yet",
-    "valid-zipcode-postal-code-is-required": "Valid zipcode/ postal code is required",
+  "there-are-no-organizations-added-yet": "There are no organizations added yet.",
-    "verfuegbare": "availdable",
+  "there-are-no-runners-added-yet": "There are no runners added yet.",
-    "welcome_wavinghand": "Welcome 👋",
+  "there-are-no-scans-yet": "There are no scans yet",
-    "yes-i-copied-the-token": "Yes, I copied the token",
+  "there-are-no-teams-added-yet": "There are no teams added yet.",
-    "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "You are going to loose all permissions and access to the runner system!",
+  "there-are-no-users-added-yet": "There are no users added yet.",
-    "you-can-now-use-your-new-password-to-log-in-to-your-account": "You can now use your new password to log in to your account! 🎉",
+  "this-card-is": "This card is",
-    "you-dont-have-any-scanstations-yet": "You don't have any scanstations yet",
+  "this-might-take-a-moment": "This might take a moment 👀",
-    "you-have-to-provide-an-organization": "You have to provide an organization",
+  "this-scanstation-is": "This scanstation is",
-    "zip-postal-code": "ZIP/ postal code"
+  "token": "Token",
-}
+  "total-distance": "total distance",
+  "total-donation-amount": "total donation amount",
+  "total-donations": "total donations",
+  "total-scans": "total scans",
+  "track": "Track",
+  "track-added": "Track added",
+  "track-data-is-being-loaded": "Track data is being loaded",
+  "track-is-being-added": "Track is being added...",
+  "track-length-in-m": "Track Length in m",
+  "track-length-must-be-greater-than-0": "Track length must be greater than 0",
+  "track-name": "Track name",
+  "track-name-must-not-be-empty": "Track name must not be empty",
+  "tracks": "Tracks",
+  "update-card": "Update Card",
+  "update-password": "Update password",
+  "updated-contact": "Updated contact!",
+  "updated-donor": "updated donor",
+  "updated-organization": "updated organization",
+  "updated-scan": "updated scan",
+  "updateing-group": "updateing group...",
+  "updating-card": "Updating card",
+  "updating-organization": "updating organization",
+  "updating-permissions": "updating permissions...",
+  "updating-runner": "Updating runner...",
+  "updating-user": "updating user...",
+  "updating-your-profile": "Updating your profile...",
+  "user-added": "User added",
+  "user-groups": "User Groups",
+  "user-is-being-added": "User is being added...",
+  "user-updated": "User updated",
+  "username": "Username",
+  "users": "Users",
+  "valid": "Valid",
+  "valid-city-is-required": "Valid city is required",
+  "valid-email-is-required": "valid email is required",
+  "valid-international-phone-number-is-required": "valid international phone number is required...",
+  "valid-zipcode-postal-code-is-required": "Valid zipcode/ postal code is required",
+  "verfuegbare": "availdable",
+  "welcome_wavinghand": "Welcome 👋",
+  "yes-i-copied-the-token": "Yes, I copied the token",
+  "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "You are going to loose all permissions and access to the runner system!",
+  "you-can-now-use-your-new-password-to-log-in-to-your-account": "You can now use your new password to log in to your account! 🎉",
+  "you-can-provide-a-runner-but-you-dont-have-to": "You can provide a runner, but you don't have to.",
+  "you-dont-have-any-scanstations-yet": "You don't have any scanstations yet",
+  "you-have-to-provide-an-organization": "You have to provide an organization",
+  "you-have-to-save-your-changes-to-generate-a-link": "You have to save your changes to generate a link.",
+  "you-must-create-at-least-one-card-or-cancel": "You must create at least one card (or cancel).",
+  "zip-postal-code": "ZIP/ postal code",
+  "generate-runner-certificates": "Generate runner certificates"
+}

src/main.js

@@ -0,0 +1,9 @@
+import 'windi.css';
+import "toastify-js/src/toastify.css";
+import "gridjs/dist/theme/mermaid.css";
+import App from './App.svelte';
+
+const app = new App({
+	target: document.body
+});
+export default app;

src/swmodule.js

@@ -1,14 +0,0 @@
-export const register = () => {
-	if ('serviceWorker' in navigator) {
-		window.addEventListener('load', () => {
-			navigator.serviceWorker.register('/sw.js').then(
-				(registration) => {
-					// console.log(`sw successful with scope: ${registration.scope}`);
-				},
-				(err) => {
-					// console.log(`sw failed: ${err}`);
-				}
-			);
-		});
-	}
-};

tailwind.config.js

@@ -1,14 +1,13 @@
 module.exports = {
-	purge: {
-		content: [ './src/**/*.svelte' ]
-	},
-	// darkMode: 'media',
-	variants: {},
-	plugins: [],
 	theme: {
-		container: {
+		extend: {
-			center: true,
+			colors: {
-			padding: '1.5rem'
+				reepolee: {
+					500: '#b40000',
+					600: '#9c0000',
+					700: '#750000'
+				}
+			}
 		}
 	}
 };

template-copy.js

@@ -1,19 +0,0 @@
-const fs = require('fs');
-let content_svelteconfig = fs.readFileSync('./s-config.template.js', { encoding: 'utf8' });
-let content_html = fs.readFileSync('./index.template.html', { encoding: 'utf8' });
-if (process.env.NODE_ENV_ODIT == 'development_fast') {
-	content_html = content_html.replace(
-		'__TAILWIND_INSERT__',
-		'<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tailwindcss@2.0.2/dist/tailwind.min.css">'
-	);
-	content_svelteconfig = content_svelteconfig.replace('__insert__', '{postcss:{}}');
-} else {
-	content_html = content_html.replace('__TAILWIND_INSERT__', '');
-	content_svelteconfig = content_svelteconfig.replace(
-		'__insert__',
-		"{postcss:{plugins:[require('tailwindcss'),require('autoprefixer')]}}"
-	);
-}
-fs.writeFileSync('./public/index.html', content_html);
-fs.writeFileSync('./svelte.config.js', content_svelteconfig);
-console.info('dev setup script done');

versionbuilder.js

@@ -1,5 +1,5 @@
 const fs = require('fs');
 const package = JSON.parse(fs.readFileSync(`./package.json`, { encoding: 'utf-8' }));
-const original = fs.readFileSync(`./index.template.html`, { encoding: 'utf-8' });
+const original = fs.readFileSync(`./index.html`, { encoding: 'utf-8' });
 let out = original.replace(/RELEASE_INFO-(\S)+-RELEASE_INFO/gi, 'RELEASE_INFO-' + package.version + '-RELEASE_INFO');
-fs.writeFileSync(`./index.template.html`, out);
+fs.writeFileSync(`./index.html`, out);

vite.config.js

@@ -0,0 +1,50 @@
+import svelte from '@sveltejs/vite-plugin-svelte';
+import windiCSS from 'vite-plugin-windicss';
+import { minify } from 'html-minifier';
+import { defineConfig } from 'vite';
+//
+const indexReplace = () => {
+	return {
+		name: 'html-transform',
+		transformIndexHtml(html) {
+			return minify(html, {
+				collapseWhitespace: true
+			});
+		}
+	};
+};
+
+export default defineConfig(({ command, mode }) => {
+	const isProduction = mode === 'production';
+	return {
+		// base: './',
+		build: {
+			polyfillDynamicImport: false,
+			cssCodeSplit: false,
+			minify: isProduction
+		},
+		plugins: [
+			windiCSS({
+				//@ts-ignore
+				verbose: true,
+				silent: false,
+				debug: true,
+				config: 'tailwind.config.js', // tailwind config file path (optional)
+				compile: false, // false: interpretation mode; true: compilation mode
+				prefix: 'windi-', // set compilation mode style prefix
+				globalPreflight: true, // set preflight style is global or scoped
+				globalUtility: true // set utility style is global or scoped
+			}),
+			svelte({
+				//@ts-ignore
+				hot: !isProduction,
+				emitCss: true,
+				extensions: [ '.md', '.svx', '.svelte' ],
+				preprocess: [
+					//
+				]
+			}),
+			indexReplace()
+		]
+	};
+});

workbox-config.js

@@ -1,9 +0,0 @@
-module.exports = {
-	globDirectory: 'public',
-	globPatterns: [ '**/*.{js,ico,png,svg,html,webmanifest,txt,json}' ],
-	globIgnores: [ 'env.js', 'env.sample.js' ],
-	swDest: 'public/sw.js',
-	cleanupOutdatedCaches: true,
-	mode: 'production',
-	sourcemap: false
-};