Merge pull request 'merge new features' (#9) from supabase into main

Reviewed-on: erman/esn-code-scanner-app#9
2025-06-25 14:17:09 +02:00
parent 5ea15fa75c 906f0376d2
commit ee6bfbe34c
15 changed files with 722 additions and 37 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,9 @@
 				"@sveltejs/adapter-node": "^5.2.12",
 				"googleapis": "^150.0.1",
 				"papaparse": "^5.5.3",
-				"quoted-printable": "^1.0.1"
+				"qrcode": "^1.5.4",
+				"quoted-printable": "^1.0.1",
+				"simple-icons": "^15.3.0"
 			},
 			"devDependencies": {
 				"@sveltejs/kit": "^2.16.0",
@@ -1416,6 +1418,30 @@
 				"node": ">= 14"
 			}
 		},
+		"node_modules/ansi-regex": {
+			"version": "5.0.1",
+			"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+			"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/ansi-styles": {
+			"version": "4.3.0",
+			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+			"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+			"license": "MIT",
+			"dependencies": {
+				"color-convert": "^2.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/chalk/ansi-styles?sponsor=1"
+			}
+		},
 		"node_modules/aria-query": {
 			"version": "5.3.2",
 			"resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
@@ -1498,6 +1524,15 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/camelcase": {
+			"version": "5.3.1",
+			"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
+			"integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=6"
+			}
+		},
 		"node_modules/chokidar": {
 			"version": "4.0.3",
 			"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
@@ -1524,6 +1559,17 @@
 				"node": ">=18"
 			}
 		},
+		"node_modules/cliui": {
+			"version": "6.0.0",
+			"resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
+			"integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+			"license": "ISC",
+			"dependencies": {
+				"string-width": "^4.2.0",
+				"strip-ansi": "^6.0.0",
+				"wrap-ansi": "^6.2.0"
+			}
+		},
 		"node_modules/clsx": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
@@ -1533,6 +1579,24 @@
 				"node": ">=6"
 			}
 		},
+		"node_modules/color-convert": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+			"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+			"license": "MIT",
+			"dependencies": {
+				"color-name": "~1.1.4"
+			},
+			"engines": {
+				"node": ">=7.0.0"
+			}
+		},
+		"node_modules/color-name": {
+			"version": "1.1.4",
+			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+			"license": "MIT"
+		},
 		"node_modules/commondir": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
@@ -1587,6 +1651,15 @@
 				}
 			}
 		},
+		"node_modules/decamelize": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+			"integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/deepmerge": {
 			"version": "4.3.1",
 			"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
@@ -1612,6 +1685,12 @@
 			"integrity": "sha512-maua5KUiapvEwiEAe+XnlZ3Rh0GD+qI1J/nb9vrJc3muPXvcF/8gXYTWF76+5DAqHyDUtOIImEuo0YKE9mshVw==",
 			"license": "MIT"
 		},
+		"node_modules/dijkstrajs": {
+			"version": "1.0.3",
+			"resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
+			"integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==",
+			"license": "MIT"
+		},
 		"node_modules/dunder-proto": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -1635,6 +1714,12 @@
 				"safe-buffer": "^5.0.1"
 			}
 		},
+		"node_modules/emoji-regex": {
+			"version": "8.0.0",
+			"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+			"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+			"license": "MIT"
+		},
 		"node_modules/enhanced-resolve": {
 			"version": "5.18.1",
 			"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.18.1.tgz",
@@ -1783,6 +1868,19 @@
 				"node": "^12.20 || >= 14.13"
 			}
 		},
+		"node_modules/find-up": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+			"integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+			"license": "MIT",
+			"dependencies": {
+				"locate-path": "^5.0.0",
+				"path-exists": "^4.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/formdata-polyfill": {
 			"version": "4.0.10",
 			"resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
@@ -1846,6 +1944,15 @@
 				"node": ">=18"
 			}
 		},
+		"node_modules/get-caller-file": {
+			"version": "2.0.5",
+			"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+			"integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+			"license": "ISC",
+			"engines": {
+				"node": "6.* || 8.* || >= 10.*"
+			}
+		},
 		"node_modules/get-intrinsic": {
 			"version": "1.3.0",
 			"resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
@@ -2030,6 +2137,15 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/is-fullwidth-code-point": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+			"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/is-module": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/is-module/-/is-module-1.0.0.tgz",
@@ -2329,6 +2445,18 @@
 			"integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==",
 			"license": "MIT"
 		},
+		"node_modules/locate-path": {
+			"version": "5.0.0",
+			"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+			"integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+			"license": "MIT",
+			"dependencies": {
+				"p-locate": "^4.1.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/lodash.castarray": {
 			"version": "4.4.0",
 			"resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
@@ -2499,12 +2627,57 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/p-limit": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+			"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+			"license": "MIT",
+			"dependencies": {
+				"p-try": "^2.0.0"
+			},
+			"engines": {
+				"node": ">=6"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
+		"node_modules/p-locate": {
+			"version": "4.1.0",
+			"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+			"integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+			"license": "MIT",
+			"dependencies": {
+				"p-limit": "^2.2.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/p-try": {
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+			"integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=6"
+			}
+		},
 		"node_modules/papaparse": {
 			"version": "5.5.3",
 			"resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.5.3.tgz",
 			"integrity": "sha512-5QvjGxYVjxO59MGU2lHVYpRWBBtKHnlIAcSe1uNFCkkptUh63NFRj0FJQm7nR67puEruUci/ZkjmEFrjCAyP4A==",
 			"license": "MIT"
 		},
+		"node_modules/path-exists": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+			"integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/path-parse": {
 			"version": "1.0.7",
 			"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
@@ -2529,6 +2702,15 @@
 				"url": "https://github.com/sponsors/jonschlinkert"
 			}
 		},
+		"node_modules/pngjs": {
+			"version": "5.0.0",
+			"resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
+			"integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=10.13.0"
+			}
+		},
 		"node_modules/postcss": {
 			"version": "8.5.3",
 			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
@@ -2677,6 +2859,23 @@
 				}
 			}
 		},
+		"node_modules/qrcode": {
+			"version": "1.5.4",
+			"resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.4.tgz",
+			"integrity": "sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==",
+			"license": "MIT",
+			"dependencies": {
+				"dijkstrajs": "^1.0.1",
+				"pngjs": "^5.0.0",
+				"yargs": "^15.3.1"
+			},
+			"bin": {
+				"qrcode": "bin/qrcode"
+			},
+			"engines": {
+				"node": ">=10.13.0"
+			}
+		},
 		"node_modules/qs": {
 			"version": "6.14.0",
 			"resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
@@ -2718,6 +2917,21 @@
 				"url": "https://paulmillr.com/funding/"
 			}
 		},
+		"node_modules/require-directory": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+			"integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+			"license": "MIT",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/require-main-filename": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+			"integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
+			"license": "ISC"
+		},
 		"node_modules/resolve": {
 			"version": "1.22.10",
 			"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
@@ -2809,6 +3023,12 @@
 			],
 			"license": "MIT"
 		},
+		"node_modules/set-blocking": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+			"integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
+			"license": "ISC"
+		},
 		"node_modules/set-cookie-parser": {
 			"version": "2.7.1",
 			"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
@@ -2887,6 +3107,25 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/simple-icons": {
+			"version": "15.3.0",
+			"resolved": "https://registry.npmjs.org/simple-icons/-/simple-icons-15.3.0.tgz",
+			"integrity": "sha512-wcaQWT4FOMQ59qe+9zNJpby286UPr8rNDuRzlXzBSu/cKECEzwvCFgCmaWUNGbpBzjeYk6WykzmOmAyGKTe/Kg==",
+			"funding": [
+				{
+					"type": "opencollective",
+					"url": "https://opencollective.com/simple-icons"
+				},
+				{
+					"type": "github",
+					"url": "https://github.com/sponsors/simple-icons"
+				}
+			],
+			"license": "CC0-1.0",
+			"engines": {
+				"node": ">=0.12.18"
+			}
+		},
 		"node_modules/sirv": {
 			"version": "3.0.1",
 			"resolved": "https://registry.npmjs.org/sirv/-/sirv-3.0.1.tgz",
@@ -2910,6 +3149,32 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/string-width": {
+			"version": "4.2.3",
+			"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+			"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+			"license": "MIT",
+			"dependencies": {
+				"emoji-regex": "^8.0.0",
+				"is-fullwidth-code-point": "^3.0.0",
+				"strip-ansi": "^6.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/strip-ansi": {
+			"version": "6.0.1",
+			"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+			"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+			"license": "MIT",
+			"dependencies": {
+				"ansi-regex": "^5.0.1"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/supports-preserve-symlinks-flag": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
@@ -3037,6 +3302,14 @@
 			"integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==",
 			"license": "MIT"
 		},
+		"node_modules/tslib": {
+			"version": "2.8.1",
+			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+			"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+			"dev": true,
+			"license": "0BSD",
+			"optional": true
+		},
 		"node_modules/typescript": {
 			"version": "5.8.3",
 			"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
@@ -3193,6 +3466,26 @@
 				"webidl-conversions": "^3.0.0"
 			}
 		},
+		"node_modules/which-module": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz",
+			"integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==",
+			"license": "ISC"
+		},
+		"node_modules/wrap-ansi": {
+			"version": "6.2.0",
+			"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+			"integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+			"license": "MIT",
+			"dependencies": {
+				"ansi-styles": "^4.0.0",
+				"string-width": "^4.1.0",
+				"strip-ansi": "^6.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/ws": {
 			"version": "8.18.2",
 			"resolved": "https://registry.npmjs.org/ws/-/ws-8.18.2.tgz",
@@ -3214,6 +3507,12 @@
 				}
 			}
 		},
+		"node_modules/y18n": {
+			"version": "4.0.3",
+			"resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+			"integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
+			"license": "ISC"
+		},
 		"node_modules/yallist": {
 			"version": "5.0.0",
 			"resolved": "https://registry.npmjs.org/yallist/-/yallist-5.0.0.tgz",
@@ -3224,6 +3523,41 @@
 				"node": ">=18"
 			}
 		},
+		"node_modules/yargs": {
+			"version": "15.4.1",
+			"resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
+			"integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
+			"license": "MIT",
+			"dependencies": {
+				"cliui": "^6.0.0",
+				"decamelize": "^1.2.0",
+				"find-up": "^4.1.0",
+				"get-caller-file": "^2.0.1",
+				"require-directory": "^2.1.1",
+				"require-main-filename": "^2.0.0",
+				"set-blocking": "^2.0.0",
+				"string-width": "^4.2.0",
+				"which-module": "^2.0.0",
+				"y18n": "^4.0.0",
+				"yargs-parser": "^18.1.2"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
+		"node_modules/yargs-parser": {
+			"version": "18.1.3",
+			"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
+			"integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
+			"license": "ISC",
+			"dependencies": {
+				"camelcase": "^5.0.0",
+				"decamelize": "^1.2.0"
+			},
+			"engines": {
+				"node": ">=6"
+			}
+		},
 		"node_modules/zimmerframe": {
 			"version": "1.1.2",
 			"resolved": "https://registry.npmjs.org/zimmerframe/-/zimmerframe-1.1.2.tgz",
--- a/package.json
+++ b/package.json
@@ -34,6 +34,8 @@
 		"@sveltejs/adapter-node": "^5.2.12",
 		"googleapis": "^150.0.1",
 		"papaparse": "^5.5.3",
-		"quoted-printable": "^1.0.1"
+		"qrcode": "^1.5.4",
+		"quoted-printable": "^1.0.1",
+		"simple-icons": "^15.3.0"
 	}
 }
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -6,6 +6,8 @@
    <h1 class="text-3xl font-bold text-center mb-2">ESN Scanner App</h1>
    <h2 class="text-lg text-gray-600 text-center mb-8">Make entrance to your events a breeze.</h2>
    <div class="flex space-x-4 w-full justify-center">
-        <a href="/private/home" class="w-64 py-2 bg-blue-600 text-white rounded-lg text-center hover:bg-blue-700 transition">Get started</a>
+        <a href="/private/home" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full shadow-none border border-gray-300 w-64 text-center transition">
+            Get started
+        </a>
    </div>
 </div>
--- a/src/routes/private/+layout.svelte
+++ b/src/routes/private/+layout.svelte
@@ -7,7 +7,7 @@
    <ul class="flex space-x-4">
        <li><a href="/private/home" class="hover:underline">Home</a></li>
        <li><a href="/private/scanner" class="hover:underline">Scanner</a></li>
-        <li><a href="/private/creator" class="hover:underline">Creator</a></li>
+        <li><a href="/private/events" class="hover:underline">Events</a></li>
    </ul>
 </nav>

--- a/src/routes/private/creator/+page.svelte
+++ b/src/routes/private/creator/+page.svelte
@@ -7,15 +7,14 @@

  let { data, form } = $props();

-  let new_event = $state({});
+  let event = $state({});
  let participants = $state([]);
-  let subject = $state('');
-  let body = $state('');
+  let email = $state({'body': '', 'subject': ''});
  let authorized = $state(false);

  $effect(() => {
    if (form && form.new_event) {
-      new_event = form.new_event;
+      event = form.new_event;
    }
    if (form && form.participants) {
      participants = form.participants;
@@ -33,12 +32,20 @@

  let step: number = $state(0);

-  let stepConditions = $derived([
-    authorized,
-    !!new_event?.name,
-    !!participants?.length,
-    !!subject && !!body
-  ]);
+  // let stepConditions = $derived([
+  //   authorized,
+  //   !!new_event?.name,
+  //   !!participants?.length,
+  //   !!subject && !!body
+  // ]);
+
+  // for debugging purpouses
+  let stepConditions = [
+    true,
+    true,
+    true,
+    true
+  ];

  function nextStep() {
    if (step < steps.length - 1) step += 1;
@@ -71,17 +78,17 @@
 {#if step == 0}
  <StepConnectGoogle bind:authorized />
 {:else if step == 1}
-  <StepCreateEvent events={data.events} {new_event} />
+  <StepCreateEvent {event} />
 {:else if step == 2}
  <StepUploadFiles {participants} />
 {:else if step == 3}
-  <StepCraftEmail bind:subject bind:body />
+  <StepCraftEmail bind:email />
 {:else if step == 4}
  <StepOverview
-    {new_event}
+    {data}
+    {event}
    {participants}
-    {subject}
-    {body}
+    {email}
    {stepConditions}
  />
 {/if}
--- a/src/routes/private/creator/finish/+page.svelte
+++ b/src/routes/private/creator/finish/+page.svelte
@@ -0,0 +1,125 @@
+<script lang="ts">
+	import { page } from '$app/state';
+	import { onMount } from 'svelte';
+    import QRCode from 'qrcode';
+
+    let { data } = $props();
+	let session_storage_id = page.url.searchParams.get('data');
+	let all_data = {};
+
+	const StepStatus = {
+		Loading: 'loading',
+		Waiting: 'waiting',
+		Success: 'success',
+		Failure: 'failure'
+	} as const;
+	type StepStatus = (typeof StepStatus)[keyof typeof StepStatus];
+	let supabase_status: StepStatus = $state(StepStatus.Waiting);
+	let email_status: StepStatus = $state(StepStatus.Waiting);
+
+	onMount(async () => {
+		if (!session_storage_id) {
+			console.error('No session storage ID provided in the URL');
+			return;
+		}
+		all_data = JSON.parse(sessionStorage.getItem(session_storage_id) || '{}');
+
+		supabase_status = StepStatus.Loading;
+		try {
+			const { result } = await insert_data_supabase(all_data.participants, all_data.event);
+			supabase_status = StepStatus.Success;
+			// Now send emails
+			email_status = StepStatus.Loading;
+			let allSuccess = true;
+			for (const obj of result) {
+				let qr_code = await dataToBase64(obj.id);
+				const payload = {
+					action: 'send',
+					to: obj.email,
+					subject: all_data.email.subject,
+					text: all_data.email.body,
+					qr_code: qr_code,
+					refreshToken: localStorage.getItem('gmail_refresh_token')
+				};
+				const res = await fetch('/private/api/gmail', {
+					method: 'POST',
+					headers: { 'Content-Type': 'application/json' },
+					body: JSON.stringify(payload)
+				});
+				if (!res.ok) {
+					allSuccess = false;
+					console.error('Failed to send email to', obj.email, await res.text());
+				}
+			}
+			email_status = allSuccess ? StepStatus.Success : StepStatus.Failure;
+		} catch (e) {
+			supabase_status = StepStatus.Failure;
+			email_status = StepStatus.Failure;
+			console.error(e);
+		}
+	});
+
+    async function dataToBase64(data: string): Promise<string> {
+        try {
+            const url = await QRCode.toDataURL(data);
+            const parts = url.split(',');
+            const base64 = parts[1];
+            return base64;
+        } catch (err) {
+            console.error(err);
+            return '';
+        }
+    }
+
+	async function insert_data_supabase(participants, event) {
+		const names = participants.map((p) => p.name);
+		const surnames = participants.map((p) => p.surname);
+		const emails = participants.map((p) => p.email);
+		const {
+			data: { user },
+			error: authError
+		} = await data.supabase.auth.getUser();
+		const { data: user_profile, error: profileError } = await data.supabase
+			.from('profiles')
+			.select('*, section:sections (id, name)')
+			.eq('id', user?.id)
+			.single();
+		const { data: result, error: qrCodeError } = await data.supabase.rpc('create_qrcodes_bulk', {
+			p_section_id: user_profile?.section.id,
+			p_event_id: event.id,
+			p_names: names,
+			p_surnames: surnames,
+			p_emails: emails
+		});
+		
+		return { result };
+	}
+</script>
+
+<!-- Creating Database Entries -->
+<div class="mb-4 rounded border border-gray-300 bg-white p-4">
+	<h2 class="mb-2 text-xl font-bold">Creating database entries</h2>
+	{#if supabase_status === StepStatus.Waiting}
+		<span class="text-black-600">Waiting...</span>
+	{:else if supabase_status === StepStatus.Loading}
+		<span class="text-black-600">Creating entries...</span>
+	{:else if supabase_status === StepStatus.Success}
+		<span class="text-green-600">Database entries created successfully.</span>
+	{:else if supabase_status === StepStatus.Failure}
+		<span class="text-red-600">Failed to create database entries.</span>
+	{/if}
+</div>
+
+<!-- Sending Emails -->
+<div class="rounded border border-gray-300 bg-white p-4">
+	<h2 class="mb-2 text-xl font-bold">Sending emails</h2>
+	{#if email_status === StepStatus.Waiting}
+		<span class="text-black-600">Waiting...</span>
+	{:else if email_status === StepStatus.Loading}
+		<span class="text-black-600">Sending emails...</span>
+	{:else if email_status === StepStatus.Success}
+		<span class="text-green-600">Emails sent successfully.</span>
+	{:else if email_status === StepStatus.Failure}
+		<span class="text-red-600">Failed to send emails.</span>
+	{/if}
+</div>
--- a/src/routes/private/creator/steps/StepCraftEmail.svelte
+++ b/src/routes/private/creator/steps/StepCraftEmail.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
-  export let subject: string;
-  export let body: string;
+  export let email: { subject: string, body: string } = { subject: '', body: '' };
 </script>

 <form class="flex flex-col space-y-4 bg-white p-8 rounded border border-gray-300 w-full shadow-none">
@@ -9,7 +8,7 @@
    Subject
    <input
      type="text"
-      bind:value={subject}
+      bind:value={email.subject}
      class="mt-1 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-200"
      required
    />
@@ -17,7 +16,7 @@
  <label class="flex flex-col text-gray-700">
    Body
    <textarea
-      bind:value={body}
+      bind:value={email.body}
      class="mt-1 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-200 resize-none"
      rows="6"
      required
--- a/src/routes/private/creator/steps/StepCreateEvent.svelte
+++ b/src/routes/private/creator/steps/StepCreateEvent.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { enhance } from '$app/forms';

-	let { events, new_event } = $props();
+	let { event } = $props();
 	let loading = $state(false);

 	function handleEnhance() {
@@ -52,7 +52,7 @@
  </button>
 </form>

-{#if Object.keys(new_event).length === 0}
+{#if Object.keys(event).length === 0}
  <div class="mt-4 rounded border-l-4 border-gray-500 bg-gray-100 p-4 text-gray-700">
    {#if loading}
      <strong>Loading...</strong>
@@ -63,9 +63,9 @@
 {:else}
  <div class="rounded border-l-4 border-green-500 bg-green-100 p-4 text-green-700 mt-4">
    <ol>
-      <li><strong>{new_event.name}</strong></li>
-      <li>{new_event.date}</li>
-      <li>{new_event.description}</li>
+      <li><strong>{event.name}</strong></li>
+      <li>{event.date}</li>
+      <li>{event.description}</li>
    </ol>
  </div>
 {/if}
--- a/src/routes/private/creator/steps/StepFinal.svelte
+++ b/src/routes/private/creator/steps/StepFinal.svelte
@@ -0,0 +1,59 @@
+<script lang="ts">
+    import QRCode from 'qrcode';
+
+	const StepState = {
+		Waiting: 'waiting',
+		Processing: 'processing',
+		FinishedSuccess: 'finished_success',
+		FinishedFail: 'finished_fail'
+	};
+
+	let qr_codes_state = $state(StepState.Processing);
+	let emails_state = $state(StepState.FinishedSuccess);
+
+	// Inserts all participants into the database and returns their assigned IDs.
+	async function insert_data_supabase(data, participants, new_event) {
+		const names = participants.map((p) => p.name);
+		const surnames = participants.map((p) => p.surname);
+		const emails = participants.map((p) => p.email);
+		const {
+			data: { user },
+			error: authError
+		} = await data.supabase.auth.getUser();
+		const { data: user_profile, error: profileError } = await data.supabase
+			.from('profiles')
+			.select('*, section:sections (id, name)')
+			.eq('id', user?.id)
+			.single();
+		const { data: result, error: qrCodeError } = await data.supabase.rpc('create_qrcodes_bulk', {
+			p_section_id: user_profile?.section.id,
+			p_event_id: new_event.id,
+			p_names: names,
+			p_surnames: surnames,
+			p_emails: emails
+		});
+
+		return { result };
+	}
+
+    // Creates a base64 interpretation of the ticket ID
+	function createB64QRCode(data) {
+		QRCode.toDataURL('I am a pony!')
+            .then((url) => {
+                const parts = url.split(',');
+                return { base64data: parts[1] };
+			})
+			.catch((err) => {
+				console.error(err);
+			});
+	}
+
+    function sendEmail(email, subject, body, qr_code_base64) {
+        // Here you would implement the logic to send the email.
+        // This is a placeholder function.
+        console.log(`Sending email to ${email} with subject "${subject}" and body "${body}"`);
+        console.log(`QR Code Base64: ${qr_code_base64}`);
+    }
+</script>
+
+Pl
--- a/src/routes/private/creator/steps/StepOverview.svelte
+++ b/src/routes/private/creator/steps/StepOverview.svelte
@@ -1,24 +1,39 @@
 <script lang="ts">
-	let { new_event, participants, subject, body, stepConditions } = $props();
+	import { goto } from '$app/navigation';
+	
+	let { data, event, participants, email, stepConditions } = $props();
+
+	function redirectToFinish() {
+		// Generate a random variable name
+		const varName = 'event_' + Math.random().toString(36).substr(2, 9);
+		// Save the data to sessionStorage
+		sessionStorage.setItem(
+			varName,
+			JSON.stringify({ event, participants, email })
+		);
+		// Redirect with the variable name as a query parameter
+		goto(`/private/creator/finish?data=${encodeURIComponent(varName)}`);
+	}
+
 </script>

 <!-- New Event Overview -->
 <div class="mb-4 rounded border border-gray-300 bg-white p-4">
 	<h2 class="mb-2 text-xl font-bold">Event Overview</h2>
 	<ul class="space-y-1">
-		<li><span class="font-semibold">Name:</span> {new_event.name}</li>
-		<li><span class="font-semibold">Date:</span> {new_event.date}</li>
-		<li><span class="font-semibold">Description:</span> {new_event.description}</li>
+		<li><span class="font-semibold">Name:</span> {event.name}</li>
+		<li><span class="font-semibold">Date:</span> {event.date}</li>
+		<li><span class="font-semibold">Description:</span> {event.description}</li>
 	</ul>
 </div>

 <!-- Email Overview -->
 <div class="mb-4 rounded border border-gray-300 bg-white p-4">
 	<h2 class="mb-2 text-xl font-bold">Email Preview</h2>
-	<div class="mb-2"><span class="font-semibold">Subject:</span> {subject}</div>
+	<div class="mb-2"><span class="font-semibold">Subject:</span> {email.subject}</div>
 	<div class="rounded border bg-gray-50 p-2 whitespace-pre-line text-gray-700">
 		<span class="font-semibold"></span>
-		<div>{body}</div>
+		<div>{email.body}</div>
 	</div>
 </div>

@@ -38,9 +53,10 @@
 </div>

 <button
+	onclick={redirectToFinish}
 	class="mt-4 w-full rounded bg-blue-600 px-4 py-3 font-bold text-white
-    transition-colors duration-200 hover:bg-blue-700
-    disabled:cursor-not-allowed disabled:bg-gray-300 disabled:text-gray-500"
+	transition-colors duration-200 hover:bg-blue-700
+	disabled:cursor-not-allowed disabled:bg-gray-300 disabled:text-gray-500"
 	disabled={!stepConditions.every(Boolean)}
 >
 	Generate QR codes and send
--- a/src/routes/private/events/+page.server.ts
+++ b/src/routes/private/events/+page.server.ts
@@ -0,0 +1,8 @@
+export async function load({ locals }) {
+    const { data: events, error } = await locals.supabase
+        .from('events')
+        .select('*')
+        .order('date', { ascending: false });
+    console.log('events', events);  
+    return { events };
+}
--- a/src/routes/private/events/+page.svelte
+++ b/src/routes/private/events/+page.svelte
@@ -0,0 +1,25 @@
+<script lang="ts">
+    export let data;
+</script>
+
+<h1 class="text-2xl font-bold mb-4 mt-2 text-center">All Events</h1>
+<div class="grid grid-cols-1 md:grid-cols-2 gap-4 max-w-2xl mx-auto">
+  {#each data.events as event}
+    <a
+      href={`/private/events/event?id=${event.id}`}
+      class="block border border-gray-300 rounded bg-white p-4 shadow-none transition cursor-pointer hover:border-blue-500 group"
+    >
+      <div class="flex flex-col gap-1">
+        <span class="font-semibold text-lg text-black-700 group-hover:underline">{event.name}</span>
+        <span class="text-gray-500 text-sm">{event.date}</span>
+      </div>
+    </a>
+  {/each}
+</div>
+
+<a
+  href="/private/creator"
+  class="fixed bottom-6 left-1/2 -translate-x-1/2 z-50 bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full shadow-none border border-gray-300"
+>
+  New Event
+</a>
--- a/src/routes/private/events/event/+page.server.ts
+++ b/src/routes/private/events/event/+page.server.ts
@@ -0,0 +1,13 @@
+export async function load({ locals, url }) {
+    const event_id = url.searchParams.get('id');
+    const { data: event_data, error: eventError } = await locals.supabase
+        .from('events')
+        .select('*')
+        .eq('id', event_id)
+        .single()
+    const { data: participants, error: participantsError } = await locals.supabase
+        .from('participants')
+        .select('*, scanned_by:profiles (id, display_name)')
+        .eq('event', event_id)
+    return {event_data, participants};
+}
--- a/src/routes/private/events/event/+page.svelte
+++ b/src/routes/private/events/event/+page.svelte
@@ -0,0 +1,95 @@
+<script lang="ts">
+	let { data } = $props();
+
+	const scannedCount = data.participants.filter((p) => p.scanned).length;
+	const notScannedCount = data.participants.length - scannedCount;
+
+</script>
+
+<h1 class="mt-2 mb-4 text-center text-2xl font-bold">Event Overview</h1>
+
+<div class="mb-2 rounded border border-gray-300 bg-white p-4">
+	<div class="flex flex-col gap-1">
+		<span class="text-black-700 text-lg font-semibold">{data.event_data.name}</span>
+		<span class="text-black-500 text-sm">{data.event_data.date}</span>
+	</div>
+</div>
+
+<div class="mb-2 flex items-center rounded border border-gray-300 bg-white p-4">
+	<div class="flex flex-1 items-center justify-center gap-2">
+		<svg
+			class="inline h-4 w-4 text-green-600"
+			fill="none"
+			stroke="currentColor"
+			stroke-width="2"
+			viewBox="0 0 24 24"
+		>
+			<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
+		</svg>
+		<span class="text-sm text-gray-700">Scanned ({scannedCount})</span>
+	</div>
+	<div class="mx-4 h-8 w-px bg-gray-300"></div>
+	<div class="flex flex-1 items-center justify-center gap-2">
+		<svg
+			class="inline h-4 w-4 text-red-600"
+			fill="none"
+			stroke="currentColor"
+			stroke-width="2"
+			viewBox="0 0 24 24"
+		>
+			<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2" fill="none" />
+			<line x1="8" y1="8" x2="16" y2="16" stroke="currentColor" stroke-width="2" />
+			<line x1="16" y1="8" x2="8" y2="16" stroke="currentColor" stroke-width="2" />
+		</svg>
+		<span class="text-sm text-gray-700">Not scanned ({notScannedCount})</span>
+	</div>
+</div>
+
+<div class="rounded border border-gray-300 bg-white p-4">
+	<h2 class="mb-2 rounded text-xl font-bold">Participants ({data.participants.length})</h2>
+	<ul class="space-y-1">
+		{#each data.participants as p}
+			<li class="flex items-center gap-2 border-b pb-1 last:border-b-0">
+				{#if p.scanned}
+					<svg
+						title="Scanned"
+						class="mr-2 inline h-4 w-4 text-green-600"
+						fill="none"
+						stroke="currentColor"
+						stroke-width="2"
+						viewBox="0 0 24 24"
+					>
+						<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
+					</svg>
+				{:else}
+					<svg
+						title="Not scanned"
+						class="mr-2 inline h-4 w-4 text-red-600"
+						fill="none"
+						stroke="currentColor"
+						stroke-width="2"
+						viewBox="0 0 24 24"
+					>
+						<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2" fill="none" />
+						<line x1="8" y1="8" x2="16" y2="16" stroke="currentColor" stroke-width="2" />
+						<line x1="16" y1="8" x2="8" y2="16" stroke="currentColor" stroke-width="2" />
+					</svg>
+				{/if}
+				<span class="font-semibold">{p.name} {p.surname}</span>
+				<span class="flex-1"></span>
+				{#if p.scanned_by}
+					<div class="flex flex-row items-end ml-2">
+						<span class="mr-1 text-xs text-gray-500">
+							{new Date(p.scanned_at).toLocaleTimeString([], {
+								hour: '2-digit',
+								minute: '2-digit',
+								hour12: false
+							})}
+						</span>
+						<span class="text-xs text-gray-500">by {p.scanned_by.display_name}</span>
+					</div>
+				{/if}
+			</li>
+		{/each}
+	</ul>
+</div>
--- a/src/routes/private/scanner/+page.svelte
+++ b/src/routes/private/scanner/+page.svelte
@@ -15,7 +15,7 @@
 		scan_state = ScanState.scanning;

 		data.supabase
-			.from('qrcodes')
+			.from('participants')
 			.select(`*, event ( id, name ), scanned_by ( id, display_name )`)
 			.eq('id', scanned_id)
 			.then( response => {