Implemented Modals <= flekschas/svelte-simple-modal

src/main/java/com/faf223/expensetrackerfaf/web/package-lock.json

@@ -16,6 +16,7 @@
 				"js-cookie": "^3.0.5",
 				"svelte-cookie": "^1.0.1",
 				"svelte-fa": "^3.0.4",
+				"svelte-simple-modal": "^1.6.1",
 				"svelte-spa-router": "^3.3.0"
 			},
 			"devDependencies": {
@@ -45,7 +46,6 @@
 			"version": "2.2.1",
 			"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
 			"integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
-			"dev": true,
 			"dependencies": {
 				"@jridgewell/gen-mapping": "^0.3.0",
 				"@jridgewell/trace-mapping": "^0.3.9"
@@ -547,7 +547,6 @@
 			"version": "0.3.3",
 			"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
 			"integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
-			"dev": true,
 			"dependencies": {
 				"@jridgewell/set-array": "^1.0.1",
 				"@jridgewell/sourcemap-codec": "^1.4.10",
@@ -561,7 +560,6 @@
 			"version": "3.1.1",
 			"resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
 			"integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
-			"dev": true,
 			"engines": {
 				"node": ">=6.0.0"
 			}
@@ -570,7 +568,6 @@
 			"version": "1.1.2",
 			"resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
 			"integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
-			"dev": true,
 			"engines": {
 				"node": ">=6.0.0"
 			}
@@ -578,14 +575,12 @@
 		"node_modules/@jridgewell/sourcemap-codec": {
 			"version": "1.4.15",
 			"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
-			"integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==",
+			"integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
-			"dev": true
 		},
 		"node_modules/@jridgewell/trace-mapping": {
 			"version": "0.3.19",
 			"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.19.tgz",
 			"integrity": "sha512-kf37QtfW+Hwx/buWGMPcR60iF9ziHa6r/CZJIHbmcm4+0qrXiVdxegAH0F6yddEVQ7zdkjcGCgCzUu+BcbhQxw==",
-			"dev": true,
 			"dependencies": {
 				"@jridgewell/resolve-uri": "^3.1.0",
 				"@jridgewell/sourcemap-codec": "^1.4.14"
@@ -735,14 +730,12 @@
 		"node_modules/@types/estree": {
 			"version": "1.0.2",
 			"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.2.tgz",
-			"integrity": "sha512-VeiPZ9MMwXjO32/Xu7+OwflfmeoRwkE/qzndw42gGtgJwZopBnzy2gD//NN1+go1mADzkDcqf/KnFRSjTJ8xJA==",
+			"integrity": "sha512-VeiPZ9MMwXjO32/Xu7+OwflfmeoRwkE/qzndw42gGtgJwZopBnzy2gD//NN1+go1mADzkDcqf/KnFRSjTJ8xJA=="
-			"dev": true
 		},
 		"node_modules/acorn": {
 			"version": "8.10.0",
 			"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz",
 			"integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==",
-			"dev": true,
 			"bin": {
 				"acorn": "bin/acorn"
 			},
@@ -809,7 +802,6 @@
 			"version": "5.3.0",
 			"resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
 			"integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
-			"dev": true,
 			"dependencies": {
 				"dequal": "^2.0.3"
 			}
@@ -833,7 +825,6 @@
 			"version": "3.2.1",
 			"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.2.1.tgz",
 			"integrity": "sha512-jsyHu61e6N4Vbz/v18DHwWYKK0bSWLqn47eeDSKPB7m8tqMHF9YJ+mhIk2lVteyZrY8tnSj/jHOv4YiTCuCJgg==",
-			"dev": true,
 			"dependencies": {
 				"dequal": "^2.0.3"
 			}
@@ -894,7 +885,6 @@
 			"version": "1.0.4",
 			"resolved": "https://registry.npmjs.org/code-red/-/code-red-1.0.4.tgz",
 			"integrity": "sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==",
-			"dev": true,
 			"dependencies": {
 				"@jridgewell/sourcemap-codec": "^1.4.15",
 				"@types/estree": "^1.0.1",
@@ -965,7 +955,6 @@
 			"version": "2.3.1",
 			"resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
 			"integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
-			"dev": true,
 			"dependencies": {
 				"mdn-data": "2.0.30",
 				"source-map-js": "^1.0.1"
@@ -1030,7 +1019,6 @@
 			"version": "2.0.3",
 			"resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
 			"integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
-			"dev": true,
 			"engines": {
 				"node": ">=6"
 			}
@@ -1298,7 +1286,6 @@
 			"version": "3.0.3",
 			"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
 			"integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
-			"dev": true,
 			"dependencies": {
 				"@types/estree": "^1.0.0"
 			}
@@ -1607,7 +1594,6 @@
 			"version": "3.0.2",
 			"resolved": "https://registry.npmjs.org/is-reference/-/is-reference-3.0.2.tgz",
 			"integrity": "sha512-v3rht/LgVcsdZa3O2Nqs+NMowLOxeOm7Ay9+/ARQ2F+qEoANRcqrjAZKGN0v8ymUetZGgkp26LTnGT7H0Qo9Pg==",
-			"dev": true,
 			"dependencies": {
 				"@types/estree": "*"
 			}
@@ -1705,8 +1691,7 @@
 		"node_modules/locate-character": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
-			"integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==",
+			"integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA=="
-			"dev": true
 		},
 		"node_modules/locate-path": {
 			"version": "6.0.0",
@@ -1745,7 +1730,6 @@
 			"version": "0.30.4",
 			"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.4.tgz",
 			"integrity": "sha512-Q/TKtsC5BPm0kGqgBIF9oXAs/xEf2vRKiIB4wCRQTJOQIByZ1d+NnUOotvJOvNpi5RNIgVOMC3pOuaP1ZTDlVg==",
-			"dev": true,
 			"dependencies": {
 				"@jridgewell/sourcemap-codec": "^1.4.15"
 			},
@@ -1756,8 +1740,7 @@
 		"node_modules/mdn-data": {
 			"version": "2.0.30",
 			"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
-			"integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
+			"integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA=="
-			"dev": true
 		},
 		"node_modules/mime": {
 			"version": "3.0.0",
@@ -1949,7 +1932,6 @@
 			"version": "3.1.0",
 			"resolved": "https://registry.npmjs.org/periscopic/-/periscopic-3.1.0.tgz",
 			"integrity": "sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==",
-			"dev": true,
 			"dependencies": {
 				"@types/estree": "^1.0.0",
 				"estree-walker": "^3.0.0",
@@ -2295,7 +2277,6 @@
 			"version": "1.0.2",
 			"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
 			"integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
-			"dev": true,
 			"engines": {
 				"node": ">=0.10.0"
 			}
@@ -2340,7 +2321,6 @@
 			"version": "4.2.1",
 			"resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.1.tgz",
 			"integrity": "sha512-LpLqY2Jr7cRxkrTc796/AaaoMLF/1ax7cto8Ot76wrvKQhrPmZ0JgajiWPmg9mTSDqO16SSLiD17r9MsvAPTmw==",
-			"dev": true,
 			"dependencies": {
 				"@ampproject/remapping": "^2.2.1",
 				"@jridgewell/sourcemap-codec": "^1.4.15",
@@ -2409,6 +2389,14 @@
 				"svelte": "^3.19.0 || ^4.0.0"
 			}
 		},
+		"node_modules/svelte-simple-modal": {
+			"version": "1.6.1",
+			"resolved": "https://registry.npmjs.org/svelte-simple-modal/-/svelte-simple-modal-1.6.1.tgz",
+			"integrity": "sha512-D4/Z7LQ6ThawYb7FlAeS/qGbcwVlqzRHn1zZgWPlEK0cp4l2UMcscqel58mp+gTuk4UX9gl516GYXcHFvuyslA==",
+			"peerDependencies": {
+				"svelte": "^3.30.0 || ^4.0.0"
+			}
+		},
 		"node_modules/svelte-spa-router": {
 			"version": "3.3.0",
 			"resolved": "https://registry.npmjs.org/svelte-spa-router/-/svelte-spa-router-3.3.0.tgz",

src/main/java/com/faf223/expensetrackerfaf/web/package.json

@@ -32,6 +32,7 @@
 		"js-cookie": "^3.0.5",
 		"svelte-cookie": "^1.0.1",
 		"svelte-fa": "^3.0.4",
+		"svelte-simple-modal": "^1.6.1",
 		"svelte-spa-router": "^3.3.0"
 	}
 }

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte

@@ -1,7 +1,7 @@
 <script>
-	import DashHeader from "./DashHeader.svelte";
+	import DashHeader from "./other/DashHeader.svelte";
-	import DataMenu from "./DataMenu.svelte";
+	import DataMenu from "./other/DataMenu.svelte";
-	import QuickInfobar from "./QuickInfobar.svelte";
+	import QuickInfobar from "./other/QuickInfobar.svelte";
     import { getCookie } from "svelte-cookie";
     import {onMount} from "svelte";
 

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/infolists/Expenses.svelte

@@ -2,6 +2,7 @@
     import { onMount, afterUpdate } from 'svelte';
     import axios from 'axios';
     import { getCookie } from "svelte-cookie";
+    import Modal from 'svelte-simple-modal';
 
     let data = [];
     let parentHeight;

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/infolists/Incomes.svelte

@@ -1,7 +1,12 @@
 <script>
     import { onMount, afterUpdate } from 'svelte';
     import axios from 'axios';
-    import { getCookie } from "svelte-cookie";
+    import {deleteCookie, getCookie} from "svelte-cookie";
+    import Modal from 'svelte-simple-modal';
+    import { getContext } from 'svelte';
+
+    const { open } = getContext('simple-modal');
+    const showSurprise = () => open(Popup, { message: "It's a modal!" });
 
     let data = [];
     let parentHeight;
@@ -30,7 +35,27 @@
 </script>
 
 <div id="incomeInfo" style="max-height: {parentHeight}px;">
+    <Modal>
+        <div> lololol </div>
+    </Modal>
+    <div>
         <h2 id="text">Incomes</h2>
+        <div id="logout" role="button"
+             tabindex="0"
+             on:click={() => {
+        deleteCookie('access_token');
+        deleteCookie('refresh_token');
+        window.location.href = '/auth/login';}}
+             on:keydown={e => {
+        if (e.key === 'Enter' || e.key === ' ') {
+            deleteCookie('access_token');
+            deleteCookie('refresh_token');
+            window.location.href = '/auth/login';
+        }}}>
+            Log out
+        </div>
+    </div>
+
     <div id="incomeList">
         <ul>
             {#each data as item}

src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/other/DataMenu.svelte

@@ -1,9 +1,9 @@
 <script>
-    import Graph1 from './graphs/Graph1.svelte';
+    import Graph1 from '../graphs/Graph1.svelte';
-    import Graph2 from './graphs/Graph2.svelte';
+    import Graph2 from '../graphs/Graph2.svelte';
-    import Graph3 from './graphs/Graph3.svelte';
+    import Graph3 from '../graphs/Graph3.svelte';
-    import Expenses from "./Expenses.svelte";
+    import Expenses from "../infolists/Expenses.svelte";
-    import Incomes from "./Incomes.svelte";
+    import Incomes from "../infolists/Incomes.svelte";
 </script>
 
 <div id="dataMenu">