From 80f4f51b02bfddeddac74809e98a49eb03da72b9 Mon Sep 17 00:00:00 2001
From: Eli Ribble <eli@gleipnir.technology>
Date: Sat, 21 Mar 2026 19:34:23 +0000
Subject: [PATCH] Add bootstrap-icons, make sidebar work with bundle logic

I'm starting to get a sense how to do all of this with these new tools.
I've semi-ported the sidebar at this point.
---
 build.js                                     |  8 ++++++--
 html/template/sync/layout/authenticated.html |  4 +---
 ts/main.ts                                   | 20 ++++++++++++++++++++
 ts/sidebar.ts                                |  5 +----
 ts/style/style.scss                          |  3 +++
 5 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/build.js b/build.js
index 888f3f67..0f075ee7 100644
--- a/build.js
+++ b/build.js
@@ -13,7 +13,7 @@ const config = {
 	plugins: [
 		sassPlugin({
 			quietDeps: true,
-			silenceDeprecations: ["import"], // silence known issue with Bootstrap #40962
+			silenceDeprecations: ["import"],
 			type: "css",
 		}),
 		vue(),
@@ -26,10 +26,14 @@ const config = {
 	minify,
 	loader: {
 		".css": "css",
+		".woff": "file",
+		".woff2": "file",
+		".ttf": "file",
+		".eot": "file",
 	},
 	outdir: "static/gen",
 	outbase: "ts",
-	assetNames: "css/[name]",
+	assetNames: "fonts/[name]",
 };
 
 if (watch) {
diff --git a/html/template/sync/layout/authenticated.html b/html/template/sync/layout/authenticated.html
index b9b8d07f..6578e53e 100644
--- a/html/template/sync/layout/authenticated.html
+++ b/html/template/sync/layout/authenticated.html
@@ -10,9 +10,7 @@
 		<script src="/static/js/events.js"></script>
 		<script src="{{ bundlePathJS }}"></script>
 		{{ block "extraheader" . }}{{ end }}
-		<script>
-			const USER = {{ .User.AsJSON|json }};
-		</script> {{ if not .Config.IsProductionEnvironment }}
+		{{ if not .Config.IsProductionEnvironment }}
 			<script src="/.flogo/injector.js"></script>
 		{{ end }}
 	</head>
diff --git a/ts/main.ts b/ts/main.ts
index 7879d88d..635ae6e7 100644
--- a/ts/main.ts
+++ b/ts/main.ts
@@ -5,6 +5,8 @@ import { SSEManager } from './sse-manager';
 import { SetupSidebar } from "./sidebar";
 import 'maplibre-gl/dist/maplibre-gl.css';
 
+// Import Bootstrap Icons CSS
+import 'bootstrap-icons/font/bootstrap-icons.css';
 // Import Bootstrap SCSS
 import './style/style.scss';
 
@@ -37,6 +39,24 @@ document.addEventListener("DOMContentLoaded", () => {
 	SSEManager.connect("/api/events");
 	SetupSidebar();
 });
+	document.addEventListener("alpine:init", () => {
+		 const user = {
+			"display_name":"",
+			"initials":"",
+			"notifications":[],
+			"notification_counts":{
+				"communication":0,
+				"home":0,
+				"review":0
+			},
+			"organization":{
+				"name":""
+			},
+			"role":"",
+			"username":""
+		};
+		 Alpine.store("user",user);
+	})
 interface GreetingComponent {
     message: string;
     name: string;
diff --git a/ts/sidebar.ts b/ts/sidebar.ts
index 92dd3665..d6af5b59 100644
--- a/ts/sidebar.ts
+++ b/ts/sidebar.ts
@@ -1,5 +1,4 @@
 export function SetupSidebar() {
-	console.log("setting up sidebar");
 	var popoverTriggerList = [].slice.call(
 		document.querySelectorAll('[data-bs-toggle="popover"]'),
 	);
@@ -23,9 +22,6 @@ export function SetupSidebar() {
 			updateUserState();
 		}
 	});
-	document.addEventListener("alpine:init", () => {
-		Alpine.store("user", USER);
-	})
 	document.getElementById("sidebarToggle").addEventListener("click", () => {
 		const sidebar = document.getElementById("sidebar");
 		sidebar.classList.toggle("collapsed");
@@ -36,6 +32,7 @@ export function SetupSidebar() {
 			(!sidebar.classList.contains("collapsed")).toString(),
 		);
 	});
+	updateUserState();
 }
 function restoreLocalStorage() {
 	const expanded = localStorage.getItem("sidebar.expanded");
diff --git a/ts/style/style.scss b/ts/style/style.scss
index eae7dee4..bb40a1af 100644
--- a/ts/style/style.scss
+++ b/ts/style/style.scss
@@ -60,4 +60,7 @@ i.bi svg {
 // Import all of Bootstrap (or pick specific components)
 @import "bootstrap/scss/bootstrap";
 
+// Import Bootstrap Icons
+//@import "bootstrap-icons/font/bootstrap-icons.scss";
+
 @import "./sidebar.scss";