From da2dbeb0fc62e9c87de3a18b04eb8bb3647ee7df Mon Sep 17 00:00:00 2001
From: TanelOrumaa <orumaa.tanel@gmail.com>
Date: Mon, 6 Dec 2021 21:08:15 +0200
Subject: [PATCH] MOB-42 Redid the whole frontend part in Vue

---
 demoBackend/pom.xml                           |  87 ++++++++++++
 demoBackend/src/demo-website/.npmrc           | Bin 118 -> 122 bytes
 .../src/demo-website/package-lock.json        | 132 +++++++++++++++---
 demoBackend/src/demo-website/package.json     |   7 +-
 demoBackend/src/demo-website/src/App.vue      |  26 ++++
 .../src/demo-website/src/components/Login.vue |  69 ++++++---
 .../demo-website/src/components/Navbar.vue    |  26 +++-
 .../demo-website/src/components/Welcome.vue   |  30 ++++
 demoBackend/src/demo-website/src/main.js      |  50 +++++++
 .../src/demo-website/src/pages/login/main.js  |  10 --
 .../demo-website/src/pages/welcome/main.js    |  10 --
 .../src/demo-website/src/router/index.js      |  31 ++++
 .../{pages/login/App.vue => views/Login.vue}  |   8 +-
 .../welcome/App.vue => views/Welcome.vue}     |   8 +-
 demoBackend/src/demo-website/src/web-eid.js   |   4 +-
 demoBackend/src/demo-website/vue.config.js    |  16 ---
 .../config/ValidationConfiguration.kt         |   4 +-
 .../demobackend/web/LoginController.kt        |  20 ---
 .../demobackend/web/SignatureController.kt    |  20 ---
 .../web/rest/AuthenticationController.kt      |   2 +-
 .../src/main/resources/static/css/main.css    |  29 ----
 .../src/main/resources/static/js/index.js     |  14 --
 .../src/main/resources/static/js/main.js      |  71 ----------
 .../src/main/resources/templates/index.html   |  38 -----
 .../main/resources/templates/signature.html   |  35 -----
 25 files changed, 426 insertions(+), 321 deletions(-)
 create mode 100644 demoBackend/src/demo-website/src/App.vue
 create mode 100644 demoBackend/src/demo-website/src/components/Welcome.vue
 create mode 100644 demoBackend/src/demo-website/src/main.js
 delete mode 100644 demoBackend/src/demo-website/src/pages/login/main.js
 delete mode 100644 demoBackend/src/demo-website/src/pages/welcome/main.js
 create mode 100644 demoBackend/src/demo-website/src/router/index.js
 rename demoBackend/src/demo-website/src/{pages/login/App.vue => views/Login.vue} (63%)
 rename demoBackend/src/demo-website/src/{pages/welcome/App.vue => views/Welcome.vue} (63%)
 delete mode 100644 demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/LoginController.kt
 delete mode 100644 demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/SignatureController.kt
 delete mode 100644 demoBackend/src/main/resources/static/css/main.css
 delete mode 100644 demoBackend/src/main/resources/static/js/index.js
 delete mode 100644 demoBackend/src/main/resources/static/js/main.js
 delete mode 100644 demoBackend/src/main/resources/templates/index.html
 delete mode 100644 demoBackend/src/main/resources/templates/signature.html

diff --git a/demoBackend/pom.xml b/demoBackend/pom.xml
index 8b1f7a3..5ca20d3 100644
--- a/demoBackend/pom.xml
+++ b/demoBackend/pom.xml
@@ -18,6 +18,8 @@
         <kotlin.version>1.5.31</kotlin.version>
         <caffeine.version>2.8.5</caffeine.version>
         <javaxcache.version>1.1.1</javaxcache.version>
+        <node.version>v16.13.0</node.version>
+        <npm.version>8.1.4</npm.version>
     </properties>
     <dependencies>
         <dependency>
@@ -115,6 +117,91 @@
                     </dependency>
                 </dependencies>
             </plugin>
+            <!-- Plugin to install node and npm and then build the vue project -->
+            <plugin>
+                <groupId>com.github.eirslett</groupId>
+                <artifactId>frontend-maven-plugin</artifactId>
+                <version>1.12.0</version>
+
+                <executions>
+                    <execution>
+                        <id>Install node and npm</id>
+                        <goals>
+                            <goal>install-node-and-npm</goal>
+                        </goals>
+                        <phase>generate-resources</phase>
+                        <configuration>
+                            <nodeVersion>${node.version}</nodeVersion>
+                            <npmVersion>${npm.version}</npmVersion>
+                        </configuration>
+                    </execution>
+
+                    <execution>
+                        <id>npm install</id>
+                        <goals>
+                            <goal>npm</goal>
+                        </goals>
+                        <phase>generate-resources</phase>
+                        <configuration>
+                            <arguments>install</arguments>
+                        </configuration>
+                    </execution>
+
+                    <execution>
+                        <id>npm build</id>
+                        <goals>
+                            <goal>npm</goal>
+                        </goals>
+                        <phase>process-resources</phase>
+                        <configuration>
+                            <arguments>run build</arguments>
+                        </configuration>
+                    </execution>
+                </executions>
+                <configuration>
+                    <nodeVersion>${node.version}</nodeVersion>
+                    <workingDirectory>src/demo-website</workingDirectory>
+                    <!--                    <installDirectory>src/demo-website/dist</installDirectory>-->
+                </configuration>
+            </plugin>
+            <!-- Plugin to copy built vue project from src/frontend/dist to target/classes/static -->
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-resources-plugin</artifactId>
+                <executions>
+                    <execution>
+                        <id>Copy web-eid.js file to Vue root folder.</id>
+                        <phase>generate-resources</phase>
+                        <goals>
+                            <goal>copy-resources</goal>
+                        </goals>
+                        <configuration>
+                            <outputDirectory>src/demo-website/src</outputDirectory>
+                            <resources>
+                                <resource>
+                                    <directory>src/demo-website/node_modules/@web-eid/web-eid-library/dist/es</directory>
+                                </resource>
+                            </resources>
+                        </configuration>
+                    </execution>
+                    <execution>
+                        <id>Copy Vue frontend into Spring Boot target static folder</id>
+                        <phase>process-resources</phase>
+                        <goals>
+                            <goal>copy-resources</goal>
+                        </goals>
+                        <configuration>
+                            <outputDirectory>target/classes/static</outputDirectory>
+                            <resources>
+                                <resource>
+                                    <directory>src/demo-website/dist</directory>
+                                    <filtering>true</filtering>
+                                </resource>
+                            </resources>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
         </plugins>
     </build>
 
diff --git a/demoBackend/src/demo-website/.npmrc b/demoBackend/src/demo-website/.npmrc
index ff1b0421a912f682b70b16977475e71f92df1512..85bdadef3f0a43b7945e6850d4b950ad7a2bd439 100644
GIT binary patch
delta 12
ScmXS`Vtc=TFAz;+Dggj33<lHy

delta 8
Pcmb;_WBUJZB3lUn5<~<0

diff --git a/demoBackend/src/demo-website/package-lock.json b/demoBackend/src/demo-website/package-lock.json
index 4ca20a5..986b94d 100644
--- a/demoBackend/src/demo-website/package-lock.json
+++ b/demoBackend/src/demo-website/package-lock.json
@@ -10,10 +10,15 @@
       "dependencies": {
         "@web-eid/web-eid-library": "../../../../web-eid.js/",
         "core-js": "^3.6.5",
-        "vue": "^3.0.0"
+        "js-cookie": "^3.0.1",
+        "vue": "^3.0.0",
+        "vue-router": "^4.0.0-0",
+        "vuex": "^4.0.2",
+        "vuex-persistedstate": "^4.1.0"
       },
       "devDependencies": {
         "@vue/cli-plugin-babel": "~4.5.0",
+        "@vue/cli-plugin-router": "~4.5.0",
         "@vue/cli-service": "~4.5.0",
         "@vue/compiler-sfc": "^3.0.0",
         "babel-eslint": "^10.1.0",
@@ -1729,17 +1734,6 @@
         "node": ">= 6"
       }
     },
-    "node_modules/@popperjs/core": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.0.tgz",
-      "integrity": "sha512-zrsUxjLOKAzdewIDRWy9nsV1GQsKBCWaGwsZQlCgr6/q+vjyZhFgqedLfFBuI9anTPEUT4APq9Mu0SZBTzIcGQ==",
-      "dev": true,
-      "peer": true,
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/popperjs"
-      }
-    },
     "node_modules/@soda/friendly-errors-webpack-plugin": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz",
@@ -2567,6 +2561,11 @@
       "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
       "dev": true
     },
+    "node_modules/@vue/devtools-api": {
+      "version": "6.0.0-beta.20.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.20.1.tgz",
+      "integrity": "sha512-R2rfiRY+kZugzWh9ZyITaovx+jpU4vgivAEAiz80kvh3yviiTU3CBuGuyWpSwGz9/C7TkSWVM/FtQRGlZ16n8Q=="
+    },
     "node_modules/@vue/preload-webpack-plugin": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz",
@@ -8669,6 +8668,14 @@
       "integrity": "sha512-JVAfqNPTvNq3sB/VHQJAFxN/sPgKnsKrCwyRt15zwNCdrMMJDdcEOdubuy+DuJYYdm0ox1J4uzEuYKkN+9yhVg==",
       "dev": true
     },
+    "node_modules/js-cookie": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.1.tgz",
+      "integrity": "sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -12104,6 +12111,11 @@
       "integrity": "sha512-Vpfqwm4EnqGdlsBFNmHhxhElJYrdfcxPThu+ryKS5J8L/fhAwLazFZtq+S+TWZ9ANj2piSQLGj6NQg+lKPmxrw==",
       "dev": true
     },
+    "node_modules/shvl": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.3.tgz",
+      "integrity": "sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw=="
+    },
     "node_modules/side-channel": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
@@ -14151,6 +14163,17 @@
       "integrity": "sha1-M7QHd3VMZDJXPBIMw4CLvRDUfwQ=",
       "dev": true
     },
+    "node_modules/vue-router": {
+      "version": "4.0.12",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.12.tgz",
+      "integrity": "sha512-CPXvfqe+mZLB1kBWssssTiWg4EQERyqJZes7USiqfW9B5N2x+nHlnsM1D3b5CaJ6qgCvMmYJnz+G0iWjNCvXrg==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.0.0-beta.18"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/vue-style-loader": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz",
@@ -14173,6 +14196,37 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
+    "node_modules/vuex": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
+      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.2"
+      }
+    },
+    "node_modules/vuex-persistedstate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-4.1.0.tgz",
+      "integrity": "sha512-3SkEj4NqwM69ikJdFVw6gObeB0NHyspRYMYkR/EbhR0hbvAKyR5gksVhtAfY1UYuWUOCCA0QNGwv9pOwdj+XUQ==",
+      "dependencies": {
+        "deepmerge": "^4.2.2",
+        "shvl": "^2.0.3"
+      },
+      "peerDependencies": {
+        "vuex": "^3.0 || ^4.0.0-rc"
+      }
+    },
+    "node_modules/vuex-persistedstate/node_modules/deepmerge": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
+      "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/watchpack": {
       "version": "1.7.5",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
@@ -16370,13 +16424,6 @@
       "integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==",
       "dev": true
     },
-    "@popperjs/core": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.0.tgz",
-      "integrity": "sha512-zrsUxjLOKAzdewIDRWy9nsV1GQsKBCWaGwsZQlCgr6/q+vjyZhFgqedLfFBuI9anTPEUT4APq9Mu0SZBTzIcGQ==",
-      "dev": true,
-      "peer": true
-    },
     "@soda/friendly-errors-webpack-plugin": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/@soda/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-1.8.1.tgz",
@@ -17081,6 +17128,11 @@
         }
       }
     },
+    "@vue/devtools-api": {
+      "version": "6.0.0-beta.20.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.20.1.tgz",
+      "integrity": "sha512-R2rfiRY+kZugzWh9ZyITaovx+jpU4vgivAEAiz80kvh3yviiTU3CBuGuyWpSwGz9/C7TkSWVM/FtQRGlZ16n8Q=="
+    },
     "@vue/preload-webpack-plugin": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz",
@@ -21944,6 +21996,11 @@
       "integrity": "sha512-JVAfqNPTvNq3sB/VHQJAFxN/sPgKnsKrCwyRt15zwNCdrMMJDdcEOdubuy+DuJYYdm0ox1J4uzEuYKkN+9yhVg==",
       "dev": true
     },
+    "js-cookie": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.1.tgz",
+      "integrity": "sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw=="
+    },
     "js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -24809,6 +24866,11 @@
       "integrity": "sha512-Vpfqwm4EnqGdlsBFNmHhxhElJYrdfcxPThu+ryKS5J8L/fhAwLazFZtq+S+TWZ9ANj2piSQLGj6NQg+lKPmxrw==",
       "dev": true
     },
+    "shvl": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.3.tgz",
+      "integrity": "sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw=="
+    },
     "side-channel": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
@@ -26491,6 +26553,14 @@
         }
       }
     },
+    "vue-router": {
+      "version": "4.0.12",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.12.tgz",
+      "integrity": "sha512-CPXvfqe+mZLB1kBWssssTiWg4EQERyqJZes7USiqfW9B5N2x+nHlnsM1D3b5CaJ6qgCvMmYJnz+G0iWjNCvXrg==",
+      "requires": {
+        "@vue/devtools-api": "^6.0.0-beta.18"
+      }
+    },
     "vue-style-loader": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz",
@@ -26515,6 +26585,30 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
+    "vuex": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
+      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
+      "requires": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      }
+    },
+    "vuex-persistedstate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-4.1.0.tgz",
+      "integrity": "sha512-3SkEj4NqwM69ikJdFVw6gObeB0NHyspRYMYkR/EbhR0hbvAKyR5gksVhtAfY1UYuWUOCCA0QNGwv9pOwdj+XUQ==",
+      "requires": {
+        "deepmerge": "^4.2.2",
+        "shvl": "^2.0.3"
+      },
+      "dependencies": {
+        "deepmerge": {
+          "version": "4.2.2",
+          "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
+          "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
+        }
+      }
+    },
     "watchpack": {
       "version": "1.7.5",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
diff --git a/demoBackend/src/demo-website/package.json b/demoBackend/src/demo-website/package.json
index 9df9b72..6b29f94 100644
--- a/demoBackend/src/demo-website/package.json
+++ b/demoBackend/src/demo-website/package.json
@@ -10,10 +10,15 @@
   "dependencies": {
     "@web-eid/web-eid-library": "../../../../web-eid.js/",
     "core-js": "^3.6.5",
-    "vue": "^3.0.0"
+    "js-cookie": "^3.0.1",
+    "vue": "^3.0.0",
+    "vue-router": "^4.0.0-0",
+    "vuex": "^4.0.2",
+    "vuex-persistedstate": "^4.1.0"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",
+    "@vue/cli-plugin-router": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "@vue/compiler-sfc": "^3.0.0",
     "babel-eslint": "^10.1.0",
diff --git a/demoBackend/src/demo-website/src/App.vue b/demoBackend/src/demo-website/src/App.vue
new file mode 100644
index 0000000..159a761
--- /dev/null
+++ b/demoBackend/src/demo-website/src/App.vue
@@ -0,0 +1,26 @@
+<template>
+  <router-view/>
+</template>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+}
+
+#nav {
+  padding: 30px;
+}
+
+#nav a {
+  font-weight: bold;
+  color: #2c3e50;
+}
+
+#nav a.router-link-exact-active {
+  color: #42b983;
+}
+</style>
diff --git a/demoBackend/src/demo-website/src/components/Login.vue b/demoBackend/src/demo-website/src/components/Login.vue
index 61858d4..dffcaf7 100644
--- a/demoBackend/src/demo-website/src/components/Login.vue
+++ b/demoBackend/src/demo-website/src/components/Login.vue
@@ -8,7 +8,16 @@
       <p class="text-center">Read more from <a href="https://github.com/TanelOrumaa/Estonian-ID-card-mobile-authenticator-POC">here.</a></p>
     </div>
     <div class="justify-content-center d-flex">
-      <button type="button" class="btn btn-lg btn-dark" v-on:click="authenticate">Authenticate</button>
+
+      <button type="button" class="btn loginButton btn-dark" v-on:click="authenticate">
+        <div v-if="loading" class="d-flex justify-content-center">
+          <div class="spinner-border text-light spinner-border-sm" role="status">
+            <span class="visually-hidden">Loading...</span>
+          </div>
+        </div>
+        <span v-else>Authenticate</span>
+      </button>
+
     </div>
     <div class="btn-group-sm d-flex justify-content-center" role="group" aria-label="Basic radio toggle button group">
       <input type="radio" class="btn-check" name="btnradio" id="btnCardReader" autocomplete="off" v-on:click="useCardReader">
@@ -18,7 +27,6 @@
       <label class="btn btn-outline-secondary" for="btnApp">using Android App</label>
     </div>
     <div id="canvas"></div>
-    <p>Token: {{ csrftoken }}</p>
   </div>
 
 </template>
@@ -26,39 +34,41 @@
 
 <script>
 import * as webeid from '../web-eid.js';
+import router from "@/router";
 
 export default {
-  name: 'Login',
+  name: 'LoginComponent',
   props: {
     "csrftoken": String,
+    "csrfHeaderName": String,
   },
   data() {
     return {
-      useApp: true,
-
+      useAndroidApp: true,
+      loading: false,
     }
   },
   methods: {
     useApp: function() {
-      this.useApp = true;
+      this.useAndroidApp = true;
     },
 
     useCardReader: function() {
-      this.useApp = false;
+      this.useAndroidApp = false;
     },
 
     authenticate: async function () {
-      const csrfToken = document.querySelector('#csrftoken').content;
-      const csrfHeaderName = document.querySelector('#csrfheadername').content;
+      this.loading = true;
 
       const options = {
         getAuthChallengeUrl: window.location.origin + "/auth/challenge",
         postAuthTokenUrl: window.location.origin + "/auth/login",
         getAuthSuccessUrl: window.location.origin + "/auth/login",
-        useAuthApp: this.useApp,
+        useAuthApp: this.useAndroidApp,
         headers: {
-          [csrfHeaderName]: csrfToken
-        }
+          [this.csrfHeaderName]: this.csrftoken
+        },
+
       };
 
       console.log(options);
@@ -66,29 +76,42 @@ export default {
       try {
         const response = await webeid.authenticate(options);
         console.log("Authentication successful! Response:", response);
-
-        window.location.href = "/welcome";
+        this.loading = false;
+        this.$store.commit("setLoggedIn", true);
+        await router.push("welcome");
 
       } catch (error) {
         console.log("Authentication failed! Error:", error);
+        alert(error.message);
+        this.loading = false;
         throw error;
       }
     }
   },
-  mounted() {
-    fetch("/auth/challenge")
-        .then((response) => response.text()
-        ).then((data) => {
-          console.log(data)
-          this.msg = data
-        }
-    )
+  computed: {
+    isLoggedIn() {
+      return this.$store.authenticated;
+    },
+    loading() {
+      return this.loading;
+    }
   }
 }
 </script>
 
 <style scoped>
-div {
+.container > div {
   margin-top: 2vh;
 }
+.loginButton {
+  height: 4vh;
+  width: 20vh;
+  line-height: 3vh;
+}
+
+.loginButton > p {
+  font-size: 3vh;
+  text-align: center;
+
+}
 </style>
diff --git a/demoBackend/src/demo-website/src/components/Navbar.vue b/demoBackend/src/demo-website/src/components/Navbar.vue
index 39fa050..6297a76 100644
--- a/demoBackend/src/demo-website/src/components/Navbar.vue
+++ b/demoBackend/src/demo-website/src/components/Navbar.vue
@@ -1,18 +1,36 @@
 <template>
   <!-- As a heading -->
-  <nav class="navbar navbar-light bg-light">
-    <div class="container-fluid">
+  <nav class="navbar navbar-dark bg-dark container-fluid flex-row">
+    <div class="">
       <span class="navbar-brand mb-0 h1">Mobile authentication demo</span>
     </div>
+    <div v-if="isLoggedIn" class="nav-item">
+      <button type="button" class="btn btn-light" v-on:click="logOut">Log out</button>
+    </div>
   </nav>
 </template>
 
 <script>
+import router from "@/router";
+
 export default {
-  name: "Navbar"
+  name: "Navbar",
+  computed: {
+    isLoggedIn() {
+      return this.$store.getters.getAuthenticated;
+    }
+  },
+  methods: {
+    logOut: function () {
+      this.$store.commit("setLoggedIn", false);
+      router.push("/");
+    }
+  }
 }
 </script>
 
 <style scoped>
-
+  nav {
+    height: 5vh;
+  }
 </style>
\ No newline at end of file
diff --git a/demoBackend/src/demo-website/src/components/Welcome.vue b/demoBackend/src/demo-website/src/components/Welcome.vue
new file mode 100644
index 0000000..fd86c45
--- /dev/null
+++ b/demoBackend/src/demo-website/src/components/Welcome.vue
@@ -0,0 +1,30 @@
+<template>
+  <div class="container container-md d-flex flex-column">
+    <div>
+      <h3 class="text-center">Congratulations, you logged into the site. Log out to try again.</h3>
+      <p class="text-center">Read more from <a href="https://github.com/TanelOrumaa/Estonian-ID-card-mobile-authenticator-POC">here.</a></p>
+    </div>
+  </div>
+
+</template>
+
+
+<script>
+export default {
+  name: 'WelcomeComponent',
+  props: {
+    "csrftoken": String,
+  },
+  computed: {
+    isLoggedIn() {
+      return this.$store.getters.getAuthenticated;
+    }
+  }
+}
+</script>
+
+<style scoped>
+div {
+  margin-top: 2vh;
+}
+</style>
diff --git a/demoBackend/src/demo-website/src/main.js b/demoBackend/src/demo-website/src/main.js
new file mode 100644
index 0000000..79fe7bc
--- /dev/null
+++ b/demoBackend/src/demo-website/src/main.js
@@ -0,0 +1,50 @@
+import {createApp} from 'vue';
+import App from './App.vue';
+import {createStore} from 'vuex'
+import BootstrapVue3 from 'bootstrap-vue-3'
+import createPersistedState from "vuex-persistedstate";
+
+import 'bootstrap/dist/css/bootstrap.css'
+import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
+import router from "./router/index";
+
+// Create a new store instance.
+const store = createStore({
+    state() {
+        return {
+            authenticated: false,
+        }
+    },
+    mutations: {
+        setLoggedIn(state, isLoggedIn) {
+            console.log("Setting logged in: " + isLoggedIn);
+            state.authenticated = isLoggedIn;
+        }
+    },
+    getters: {
+      getAuthenticated: state => {
+          return state.authenticated;
+      }
+    },
+    plugins: [createPersistedState()],
+})
+
+router.beforeEach((to, from, next) => {
+    if (to.matched.some(record => record.meta.requiresAuth)) {
+        // this route requires auth, check if logged in
+        // if not, redirect to login page.
+        if (!store.state.authenticated) {
+            next({name: 'Login'})
+        } else {
+            next() // go to wherever I'm going
+        }
+    } else {
+        next() // does not require auth, make sure to always call next()!
+    }
+})
+
+const app = createApp(App)
+app.use(BootstrapVue3)
+app.use(router)
+app.use(store)
+app.mount('#app')
\ No newline at end of file
diff --git a/demoBackend/src/demo-website/src/pages/login/main.js b/demoBackend/src/demo-website/src/pages/login/main.js
deleted file mode 100644
index e56c388..0000000
--- a/demoBackend/src/demo-website/src/pages/login/main.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { createApp } from 'vue';
-import App from './App.vue';
-import BootstrapVue3 from 'bootstrap-vue-3'
-
-import 'bootstrap/dist/css/bootstrap.css'
-import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
-
-const app = createApp(App)
-app.use(BootstrapVue3)
-app.mount('#app')
\ No newline at end of file
diff --git a/demoBackend/src/demo-website/src/pages/welcome/main.js b/demoBackend/src/demo-website/src/pages/welcome/main.js
deleted file mode 100644
index e56c388..0000000
--- a/demoBackend/src/demo-website/src/pages/welcome/main.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { createApp } from 'vue';
-import App from './App.vue';
-import BootstrapVue3 from 'bootstrap-vue-3'
-
-import 'bootstrap/dist/css/bootstrap.css'
-import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
-
-const app = createApp(App)
-app.use(BootstrapVue3)
-app.mount('#app')
\ No newline at end of file
diff --git a/demoBackend/src/demo-website/src/router/index.js b/demoBackend/src/demo-website/src/router/index.js
new file mode 100644
index 0000000..4762302
--- /dev/null
+++ b/demoBackend/src/demo-website/src/router/index.js
@@ -0,0 +1,31 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import Login from '@/views/Login.vue'
+import Welcome from "@/views/Welcome";
+
+const routes = [
+  {
+    path: '/',
+    name: 'Login',
+    component: Login,
+    meta: {
+      requiresAuth: false
+    }
+  },
+  {
+    path: '/welcome',
+    name: 'Welcome',
+    component: Welcome,
+    meta: {
+      requiresAuth: true
+    }
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(process.env.BASE_URL),
+  routes
+})
+
+
+
+export default router
diff --git a/demoBackend/src/demo-website/src/pages/login/App.vue b/demoBackend/src/demo-website/src/views/Login.vue
similarity index 63%
rename from demoBackend/src/demo-website/src/pages/login/App.vue
rename to demoBackend/src/demo-website/src/views/Login.vue
index aca0338..cb251da 100644
--- a/demoBackend/src/demo-website/src/pages/login/App.vue
+++ b/demoBackend/src/demo-website/src/views/Login.vue
@@ -1,16 +1,16 @@
 <template>
   <Navbar/>
-  <hello-world v-bind:csrftoken="csrf_token()"/>
+  <LoginComponent/>
 </template>
 
 <script>
-import HelloWorld from '../../components/Login.vue'
+import LoginComponent from '@/components/Login'
 import Navbar from "@/components/Navbar";
 
 export default {
-  name: 'App',
+  name: 'Login',
   components: {
-    HelloWorld,
+    LoginComponent,
     Navbar
   },
   methods: {
diff --git a/demoBackend/src/demo-website/src/pages/welcome/App.vue b/demoBackend/src/demo-website/src/views/Welcome.vue
similarity index 63%
rename from demoBackend/src/demo-website/src/pages/welcome/App.vue
rename to demoBackend/src/demo-website/src/views/Welcome.vue
index aca0338..4e2d061 100644
--- a/demoBackend/src/demo-website/src/pages/welcome/App.vue
+++ b/demoBackend/src/demo-website/src/views/Welcome.vue
@@ -1,16 +1,16 @@
 <template>
   <Navbar/>
-  <hello-world v-bind:csrftoken="csrf_token()"/>
+  <WelcomeComponent/>
 </template>
 
 <script>
-import HelloWorld from '../../components/Login.vue'
+import WelcomeComponent from '@/components/Welcome'
 import Navbar from "@/components/Navbar";
 
 export default {
-  name: 'App',
+  name: 'Welcome',
   components: {
-    HelloWorld,
+    WelcomeComponent,
     Navbar
   },
   methods: {
diff --git a/demoBackend/src/demo-website/src/web-eid.js b/demoBackend/src/demo-website/src/web-eid.js
index d655148..e71efcf 100644
--- a/demoBackend/src/demo-website/src/web-eid.js
+++ b/demoBackend/src/demo-website/src/web-eid.js
@@ -8776,7 +8776,9 @@ class WebExtensionService {
     onAckTimeout(pending) {
         var _a, _b;
         console.log("onAckTimeout", pending.message.action);
-        if (pending.message.authApp && pending.message.authApp == true) {
+        console.log("Pending message");
+        console.log(pending.message.authApp);
+        if (pending.message.useAuthApp && pending.message.useAuthApp == true) {
             (_a = pending.reject) === null || _a === void 0 ? void 0 : _a.call(pending, new AuthAppNotInstalledError());
         }
         else {
diff --git a/demoBackend/src/demo-website/vue.config.js b/demoBackend/src/demo-website/vue.config.js
index a8783a7..e1fdace 100644
--- a/demoBackend/src/demo-website/vue.config.js
+++ b/demoBackend/src/demo-website/vue.config.js
@@ -17,20 +17,4 @@ module.exports = {
             }
         }
     },
-    pages: {
-        index: {
-            entry: "./src/pages/home/main.js",
-            template: "public/index.html",
-            filename: "index.html",
-            title: "Home",
-            chunks: [],
-        },
-        legal: {
-            entry: "./src/pages/legal/main.js",
-            template: "public/index.html",
-            filename: "legal.html",
-            title: "Legal",
-            chunks:,
-        }
-    }
 }
\ No newline at end of file
diff --git a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/config/ValidationConfiguration.kt b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/config/ValidationConfiguration.kt
index 3bdefc4..e59b67f 100644
--- a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/config/ValidationConfiguration.kt
+++ b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/config/ValidationConfiguration.kt
@@ -13,6 +13,7 @@ import org.webeid.security.validator.AuthTokenValidator
 import org.webeid.security.validator.AuthTokenValidatorBuilder
 import java.io.IOException
 import java.net.URI
+import java.net.URL
 import java.security.KeyStore
 import java.security.KeyStoreException
 import java.security.NoSuchAlgorithmException
@@ -39,7 +40,7 @@ class ValidationConfiguration {
 
     private val NONCE_TTL_MINUTES: Long = 5
     private val CACHE_NAME = "nonceCache"
-    private val CERTS_RESOURCE_PATH = "/certs/"
+    private val CERTS_RESOURCE_PATH = "/certs"
     private val TRUSTED_CERTIFICATES_JKS = "trusted_certificates.jks"
     private val TRUSTSTORE_PASSWORD = "changeit"
     companion object {
@@ -65,6 +66,7 @@ class ValidationConfiguration {
             LOG.warn("Creating new cache.")
             cache = createNonceCache(cacheManager)
         }
+
         return cache
     }
 
diff --git a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/LoginController.kt b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/LoginController.kt
deleted file mode 100644
index e4c6535..0000000
--- a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/LoginController.kt
+++ /dev/null
@@ -1,20 +0,0 @@
-package com.tarkvaratehnika.demobackend.web
-
-import com.tarkvaratehnika.demobackend.config.ApplicationConfiguration
-import org.springframework.stereotype.Controller
-import org.springframework.ui.Model
-import org.springframework.web.bind.annotation.GetMapping
-
-@Controller
-class LoginController {
-
-    @GetMapping
-    fun login(model : Model) : String {
-        model.addAttribute("intentUrl", ApplicationConfiguration.AUTH_APP_LAUNCH_INTENT)
-        model.addAttribute("challengeUrl", ApplicationConfiguration.CHALLENGE_ENDPOINT_URL)
-        model.addAttribute("originUrl", ApplicationConfiguration.WEBSITE_ORIGIN_URL)
-        model.addAttribute("loggedInUrl", "/signature")
-        model.addAttribute("authenticationRequestUrl", ApplicationConfiguration.AUTHENTICATION_ENDPOINT_URL)
-        return "index"
-    }
-}
\ No newline at end of file
diff --git a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/SignatureController.kt b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/SignatureController.kt
deleted file mode 100644
index d526fec..0000000
--- a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/SignatureController.kt
+++ /dev/null
@@ -1,20 +0,0 @@
-package com.tarkvaratehnika.demobackend.web
-
-import com.tarkvaratehnika.demobackend.config.ValidationConfiguration.Companion.ROLE_USER
-import org.springframework.security.access.prepost.PreAuthorize
-import org.springframework.stereotype.Controller
-import org.springframework.ui.Model
-import org.springframework.web.bind.annotation.GetMapping
-
-@Controller
-class SignatureController {
-
-
-    @PreAuthorize("hasAuthority('$ROLE_USER')")
-    @GetMapping("signature")
-    fun signature(model : Model) : String {
-//        model.addAttribute("intentUrl", ApplicationConfiguration.AUTH_APP_LAUNCH_INTENT)
-//        model.addAttribute("challengeUrl", ApplicationConfiguration.CHALLENGE_ENDPOINT_URL)
-        return "signature"
-    }
-}
\ No newline at end of file
diff --git a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/rest/AuthenticationController.kt b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/rest/AuthenticationController.kt
index 6414441..ed06682 100644
--- a/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/rest/AuthenticationController.kt
+++ b/demoBackend/src/main/kotlin/com/tarkvaratehnika/demobackend/web/rest/AuthenticationController.kt
@@ -30,7 +30,7 @@ class AuthenticationController {
     }
 
     @GetMapping("authentication", produces = [MediaType.APPLICATION_JSON_VALUE])
-    fun getAuthenticated(@RequestParam challenge: String) : Authentication? {
+    fun getAuthenticated(headers: String) : Authentication? {
         val auth = WebEidAuthentication.fromChallenge(challenge)
         if (auth == null) {
             throw ResponseStatusException(HttpStatus.FORBIDDEN, "Not allowed.")
diff --git a/demoBackend/src/main/resources/static/css/main.css b/demoBackend/src/main/resources/static/css/main.css
deleted file mode 100644
index 1b6bc96..0000000
--- a/demoBackend/src/main/resources/static/css/main.css
+++ /dev/null
@@ -1,29 +0,0 @@
-html {
-    font-size: 2vh;
-}
-
-.navbar {
-    padding-left: 1rem;
-    padding-right: 1rem;
-}
-
-.cont {
-    display: grid;
-    width: 80%;
-    padding-top: 10%;
-    margin-left: auto;
-    margin-right: auto;
-    justify-items: center;
-}
-
-h4 {
-    margin: 10%;
-}
-
-#loginButton {
-    width: 40%;
-}
-
-.cont > * {
-    margin: 1rem;
-}
\ No newline at end of file
diff --git a/demoBackend/src/main/resources/static/js/index.js b/demoBackend/src/main/resources/static/js/index.js
deleted file mode 100644
index 083655f..0000000
--- a/demoBackend/src/main/resources/static/js/index.js
+++ /dev/null
@@ -1,14 +0,0 @@
-window.onload = () => {
-    // Add event listener for login button.
-    let loginButton = document.getElementById("loginButton");
-
-    if (loginButton != null) {
-        loginButton.addEventListener("click", () => {
-            let action = loginButton.getAttribute("data-action");
-            loginButton.setAttribute("disabled", "true");
-            loginButton.textContent = "Logging in";
-            launchAuthApp(action);
-        })
-    }
-}
-
diff --git a/demoBackend/src/main/resources/static/js/main.js b/demoBackend/src/main/resources/static/js/main.js
deleted file mode 100644
index 46b607a..0000000
--- a/demoBackend/src/main/resources/static/js/main.js
+++ /dev/null
@@ -1,71 +0,0 @@
-const POLLING_INTERVAL = 1000;
-const POLLING_RETRIES = 120;
-
-function launchAuthApp(action) {
-    if (!isAndroid()) {
-        alert("Functionality only available for Android devices.")
-        return null
-    }
-
-    // Fetch challenge.
-    httpGetAsync(originUrl + challengeUrl, (body) => {
-        let data = JSON.parse(body);
-        let challenge = data.nonce;
-        let intent = createParametrizedIntentUrl(challenge, action, originUrl); // TODO: Error handling.
-        console.log(intent);
-        window.location.href = intent;
-        pollForAuth(POLLING_INTERVAL, challenge);
-    })
-}
-
-function pollForAuth(timeout, challenge) {
-    console.log("Polling for auth");
-    let encodedChallenge = encodeURIComponent(challenge);
-    let requestUrl = originUrl + authenticationRequestUrl + "?challenge=" + encodedChallenge;
-    let counter = 0;
-    let timer = setInterval(() => {
-        // Fetch authentication object.
-        httpGetAsync(requestUrl, (body) => {
-            console.log(body);
-            // If this is a successful request, stop the polling.
-            clearInterval(timer);
-            window.location.href = originUrl + loggedInUrl;
-        });
-        counter++;
-        if (counter > POLLING_RETRIES) {
-            clearInterval(timer); // Stop polling after some time.
-            let loginErrorAlert = document.getElementById("loginErrorAlert");
-            loginErrorAlert.classList.remove("d-none")
-        }
-    }, timeout)
-
-}
-
-function createParametrizedIntentUrl(challenge, action) {
-    if (action == null) {
-        console.error("There has to be an action for intent.")
-    }
-    else if (challenge == null) {
-        console.error("Challenge missing, can't authenticate without it.")
-    } else {
-        return intentUrl + "?" + "action=" + action + "&challenge=" + encodeURIComponent(challenge) + "&authUrl=" + authenticationRequestUrl + "&originUrl=" + originUrl;
-    }
-}
-
-function isAndroid() {
-    // Check if using Android device.
-    const ua = navigator.userAgent.toLowerCase();
-    return ua.indexOf("android") > -1;
-}
-
-function httpGetAsync(theUrl, callback) {
-    console.log("Sending a request.")
-    const xmlHttp = new XMLHttpRequest();
-    xmlHttp.onreadystatechange = function () {
-        if (xmlHttp.readyState === 4 && xmlHttp.status === 200) {
-            callback(xmlHttp.responseText);
-        }
-    }
-    xmlHttp.open("GET", theUrl, true); // true for asynchronous
-    xmlHttp.send(null);
-}
\ No newline at end of file
diff --git a/demoBackend/src/main/resources/templates/index.html b/demoBackend/src/main/resources/templates/index.html
deleted file mode 100644
index a436fea..0000000
--- a/demoBackend/src/main/resources/templates/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!DOCTYPE HTML>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-    <title>Login</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
-          integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
-    <link th:href="@{/css/main.css}" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
-            integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
-            crossorigin="anonymous"></script>
-    <script type="text/javascript" th:src="@{/js/index.js}"></script>
-    <script type="text/javascript" th:src="@{/js/main.js}"></script>
-    <script th:inline="javascript">const originUrl = [[${originUrl}]];
-    const intentUrl = [[${intentUrl}]];
-    const challengeUrl = [[${challengeUrl}]];
-    const loggedInUrl = [[${loggedInUrl}]];
-    const authenticationRequestUrl = [[${authenticationRequestUrl}]]</script> <!-- Pass some values to JS -->
-
-</head>
-<body>
-<nav class="navbar navbar-dark bg-dark">
-    <div class="container-fluid">
-        <a class="navbar-brand" href="#">Auth demo webapp</a>
-    </div>
-</nav>
-<div class="cont">
-    <h4>Welcome to Estonian ID card mobile authentication demo website. When using a mobile phone, you can log in to the
-        website using your ID card by using the button below.</h4>
-    <h5>Make sure you've installed the authentication app from: <a
-            href="https://github.com/TanelOrumaa/Estonian-ID-card-mobile-authenticator-POC">GitHub</a></h5>
-    <button type="button" class="btn btn-lg btn-secondary" id="loginButton" data-action="auth">Log in</button>
-    <div class="alert alert-danger d-none" role="alert" id="loginErrorAlert">
-        Login failed. Refresh the page to try again.
-    </div>
-</div>
-</body>
-</html>
\ No newline at end of file
diff --git a/demoBackend/src/main/resources/templates/signature.html b/demoBackend/src/main/resources/templates/signature.html
deleted file mode 100644
index 5c4bd12..0000000
--- a/demoBackend/src/main/resources/templates/signature.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE HTML>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-    <title>Login</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
-          integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
-    <link th:href="@{/css/main.css}" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
-            integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
-            crossorigin="anonymous"></script>
-    <script type="text/javascript" th:src="@{/js/signature.js}"></script>
-    <script type="text/javascript" th:src="@{/js/main.js}"></script>
-
-</head>
-<body>
-<nav class="navbar navbar-dark bg-dark">
-    <a class="navbar-brand" href="#">Auth demo web application</a>
-    <ul class="navbar-nav mr-auto">
-        <li class="nav-item">
-            <a href="/" class="btn btn-danger">Log out</a>
-        </li>
-    </ul>
-</nav>
-<div class="cont">
-    <h4>Congratulations! You have just authenticated yourself using your mobile phone and your ID-card. You can try to
-        give a signature to a file now.</h4>
-    <h5>This page is still WIP, signing a document feature will be implemented later.</h5>
-    <div class="custom-file">
-        <input type="file" class="custom-file-input" id="customFile">
-    </div>
-    <button type="button" class="btn btn-secondary" id="signFile" data-action="auth">Sign</button>
-</div>
-</body>
-</html>
\ No newline at end of file