2 files changed, 36 insertions, 0 deletions
diff --git a/174bg/database/volumes/pocketbase/pb_hooks/views/_layout.html b/174bg/database/volumes/pocketbase/pb_hooks/views/_layout.html
new file mode 100644
index 0000000..4771057
--- /dev/null
+++ b/174bg/database/volumes/pocketbase/pb_hooks/views/_layout.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>{{block "title" .}}Default app title{{end}}</title>
+</head>
+<body>
+    {{block "body" .}}
+        Default app body...
+    {{end}}
+</body>
+</html>
+\ No newline at end of file
diff --git a/174bg/database/volumes/pocketbase/pb_hooks/views/stats.html b/174bg/database/volumes/pocketbase/pb_hooks/views/stats.html
new file mode 100644
index 0000000..b59c1a7
--- /dev/null
+++ b/174bg/database/volumes/pocketbase/pb_hooks/views/stats.html
@@ -0,0 +1,25 @@
+{{define "title"}}
+    stats
+{{end}}
+
+{{define "body"}}
+    <p id="timeDifference">Time Difference: {{.timeDifference}}</p>
+    <p id="withinThreshold">Within Threshold: {{.withinThreshold}}</p>
+
+    <script>
+        window.addEventListener("load", () => {
+            setInterval(fetchStats, 100);
+        });
+
+        async function fetchStats() {
+            let heartbeat = await fetch("/api/heartbeat");
+            heartbeat = await heartbeat.json();
+
+            const timeDifference = heartbeat.timeDifference;
+            const withinThreshold = heartbeat.withinThreshold;
+
+            document.getElementById("timeDifference").textContent = `Time Difference: ${timeDifference}`;
+            document.getElementById("withinThreshold").textContent = `Within Threshold: ${withinThreshold}`;
+        }
+    </script>
+{{end}}
+\ No newline at end of file