✨ feat: Add sub-category handling and URL synchronization in category.js

public/themes/dist_static/static/js/category.js

@@ -16,6 +16,20 @@ function getCategoryIdFromQuery() {
 	if (id && document.querySelector(`[data-category-item="${id}"]`)) return id;
 	return getDefaultCategoryId();
 }
+function getSubIdFromQuery(categoryId) {
+	const subId = new URLSearchParams(window.location.search).get("sub");
+	if (!subId || !categoryId) return "";
+	const exists = document.querySelector(`.c-sidebar__sub[data-category-id="${categoryId}"][data-sub-id="${subId}"]`);
+	return exists ? subId : "";
+}
+function syncUrl(state) {
+	const url = new URL(window.location.href);
+	if (state.categoryId) url.searchParams.set("cat", state.categoryId);
+	else url.searchParams.delete("cat");
+	if (state.subId) url.searchParams.set("sub", state.subId);
+	else url.searchParams.delete("sub");
+	window.history.replaceState(null, "", url);
+}
 function getCategoryName(categoryId) {
 	return document.querySelector(`.c-sidebar__trigger[data-category-id="${categoryId}"]`)?.dataset.categoryName || "";
 }
@@ -73,6 +87,7 @@ function bindEvents(state) {
 			state.categoryId = trigger.dataset.categoryId;
 			state.subId = trigger.dataset.subId;
 			state.expandedId = trigger.dataset.categoryId;
+			syncUrl(state);
 		} else {
 			const id = trigger.dataset.categoryId;
 			if (state.expandedId === id) state.expandedId = "";
@@ -80,9 +95,7 @@ function bindEvents(state) {
 				state.expandedId = id;
 				state.categoryId = id;
 				state.subId = "";
-				const url = new URL(window.location.href);
-				url.searchParams.set("cat", id);
-				window.history.replaceState(null, "", url);
+				syncUrl(state);
 			}
 		}
 		updateView(state);
@@ -93,7 +106,7 @@ $(function() {
 	const state = {
 		categoryId,
 		expandedId: categoryId,
-		subId: ""
+		subId: getSubIdFromQuery(categoryId)
 	};
 	setActiveNav();
 	updateView(state);