backend/web/static/js/demo.js

+//////////////////////////////////////
+// sign up form for the demo instance
+//////////////////////////////////////
+
+function submitSignup() {
+	let result = document.querySelector("#signup-result");
+	let email = document.querySelector("#signup-email");
+	let xhr = new XMLHttpRequest();
+	xhr.responseType = "json";
+	let url = "/web/demo-user";
+	xhr.open("POST", url, true);
+	xhr.setRequestHeader("Content-Type", "application/json");
+	xhr.onreadystatechange = function () {
+		if (xhr.readyState === 4) {
+			// In the success case, we get a plain (json) string; in the error
+			// case, we get an object with `errorMessage` property.
+			if (typeof this.response == "object" && "errorMessage" in this.response) {
+				window.console.log("Error in sign-up request.");
+				result.classList.remove("alert-success");
+				result.classList.add("alert-danger");
+				if (
+					this.response.errorMessage ==
+					"[KratosError] Unable to insert or update resource because a resource with that value exists already"
+				) {
+					result.innerHTML = "A user with that email address already exists.";
+				} else if (
+					this.response.errorMessage ==
+					"[KratosError] The request was malformed or contained invalid parameters"
+				) {
+					result.innerHTML = "That doesn't appear to be a valid email address.";
+				} else {
+					result.innerHTML = this.response.errorMessage;
+				}
+			} else {
+				result.classList.add("alert-success");
+				result.classList.remove("alert-danger");
+				result.innerHTML = this.response;
+			}
+			result.style.visibility = "visible";
+		}
+	};
+	// Converting JSON data to string
+	var data = JSON.stringify({ email: email.value });
+	// Sending data with the request
+	xhr.send(data);
+}

backend/web/static/src/input.css

+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+	label {
+		@apply block text-sm font-medium text-gray-700 mb-1;
+	}
+}
+
+@layer components {
+	#pills-tab .nav-link.active {
+		@apply bg-transparent text-gray-800 border-b-2 text-left border-b-primary-700 hover:bg-primary-700 py-2 px-4 rounded-none;
+	}
+	#pills-tab .nav-link:not(.active) {
+		@apply text-gray-500 hover:text-primary-700;
+	}
+}

backend/web/static/style.css

-
-
 div.loginpanel {
     width: 644px;
     margin-left: auto;
@@ -10,3 +8,25 @@ div.loginpanel {
 button {
     margin-top: 10px;
 }
+
+.form-display {
+    font-family: monospace;
+    display: block;
+    width: 100%;
+    padding: .375rem .75rem;
+    font-size: 1rem;
+    line-height: 1.5;
+    color: #495057;
+    background-color: #fff;
+    background-clip: padding-box;
+    border: 1px solid #ced4da;
+    border-radius: .25rem;
+}
+
+#pills-tab {
+    margin-bottom: 1rem;
+}
+
+#totp_qr {
+    padding: 2rem;
+}

backend/web/tailwind.config.js

+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  mode: "jit",
+  content: ["./templates/**/*.{html,htm}", "./static/base.js"],
+  theme: {
+    extend: {
+      colors: {
+        primary: {
+          50: "var(--colour-primary-50)",
+          100: "var(--colour-primary-100)",
+          200: "var(--colour-primary-200)",
+          300: "var(--colour-primary-300)",
+          400: "var(--colour-primary-400)",
+          500: "var(--colour-primary-500)",
+          600: "var(--colour-primary-600)",
+          700: "var(--colour-primary-700)",
+          800: "var(--colour-primary-800)",
+          900: "var(--colour-primary-900)",
+          950: "var(--colour-primary-950)",
+          light: "var(--colour-primary-light)",
+          DEFAULT: "var(--colour-primary-default)",
+          dark: "var(--colour-primary-dark)",
+        },
+      },
+    },
+  },
+  plugins: [],
+};

backend/web/templates/clear.html

+{% extends 'base.html' %}
+
+{% block content %}
+
+<script>
+    // Wipe the local storage
+    localStorage.removeItem("persist:root");
+    // Redirect
+    window.location = '{{ url | safe }}';
+</script>
+
+Clearing session data and redirecting...
+
+{% endblock %}

backend/web/templates/loggedin.html

@@ -4,6 +4,7 @@
 
 <script>
     var api_url = '{{ api_url }}';
+    var dashboard_url = '{{ dashboard_url }}';
 
     // Actions
     $(document).ready(function() {
@@ -17,8 +18,7 @@
 
 <div id="contentMessages"></div>
 <div id="contentWelcome">
-    Welcome{{ name }}, you are logged in.
+    Welcome{{ name }}, you are logged in. We are redirecting you....
 </div>
 
-
 {% endblock %}

backend/web/templates/recover.html

-
-
 {% extends 'base.html' %}
 
 {% block content %}
@@ -8,22 +6,26 @@
     var api_url = '{{ api_url }}';
 
     // Actions
-    $(document).ready(function() {
+    $(document).ready(function () {
         flow_recover();
 
     });
 
 </script>
 
-    <div id="contentMessages"></div>
-    <div id="contentRecover"></div>
-    <div id="contentRecoverRequested" style='display:none'>
-        Thank you for your request. We have sent you an email to recover
-        your account. Please check your e-mail and complete the account
-        recovery. You have limited time to complete this</div>
-
-    <div id="contentHelp">
-        <a href='login'>Back to login page</a> | <a href='https://stackspin.org'>About stackspin</a>
-    </div>
-
-{% endblock %}
+<div id="contentMessages"></div>
+<div id="contentRecover"></div>
+<div id="contentRecoverRequested" class="text-sm px-2 pb-5" style='display:none'>
+    Thank you for your request. If there is an account registered with the
+    given address, we have sent you an e-mail to recover your account.
+    Please check your e-mail and complete the account recovery. You have
+    limited time to complete this.</div>
+
+<div id="contentHelp" class="flex flex-col font-medium text-primary-600 mt-0 pt-2 border-t-gray-50 border-t-2">
+    <a href='login' class="block w-full text-right hover:text-primary-700 mb-2">Back to login page</a><a
+        href='https://stackspin.net' class="block text-right w-full text-sm text-gray-400 hover:text-primary-500">What
+        is
+        Stackspin?</a>
+</div>
+
+{% endblock %}
\ No newline at end of file

deployment/Dockerfile

-FROM nginx:latest
+FROM nginx:1.27
 COPY ./nginx.conf /etc/nginx/nginx.conf
-COPY . /usr/share/nginx/html
+COPY html /usr/share/nginx/html

deployment/helmchart/Chart.lock

 dependencies:
 - name: common
   repository: https://charts.bitnami.com/bitnami
-  version: 2.0.3
-digest: sha256:dfd07906c97f7fca7593af69d01f6f044e10a609a03057352142766a5caca6cd
-generated: "2022-09-29T15:38:57.444746866+02:00"
+  version: 2.14.1
+digest: sha256:31e157c847d806f07ddd0518316a205c315829105cd69ef5c79eff92e2f28967
+generated: "2024-01-30T13:59:56.425668471+01:00"

deployment/helmchart/Chart.yaml

 annotations:
   category: Dashboard
 apiVersion: v2
-appVersion: 0.5.1
+appVersion: 0.13.3
 dependencies:
   - name: common
     # https://artifacthub.io/packages/helm/bitnami/common
@@ -23,4 +23,4 @@ name: stackspin-dashboard
 sources:
   - https://open.greenhost.net/stackspin/dashboard/
   - https://open.greenhost.net/stackspin/dashboard-backend/
-version: 1.5.1
+version: 1.13.3

deployment/helmchart/templates/backend-service.yaml

@@ -40,3 +40,4 @@ spec:
     {{- include "common.tplvalues.render" (dict "value" .Values.backend.service.extraPorts "context" $) | nindent 4 }}
     {{- end }}
   selector: {{- include "common.labels.matchLabels" . | nindent 4 }}
+    component: dashboard-backend