From 4923ccf30c188acaadff0fd7f46084965cdc003e Mon Sep 17 00:00:00 2001
From: aki <aki@mailserver.opossum-arcturus.ts.net>
Date: Tue, 8 Apr 2025 11:48:56 +0800
Subject: [PATCH] feat: Preparations for TopBar modifications

---
 src/components/TopBar.ts | 45 ++++++++++++++++------------------------
 1 file changed, 18 insertions(+), 27 deletions(-)

diff --git a/src/components/TopBar.ts b/src/components/TopBar.ts
index 82c0e23..807b51c 100644
--- a/src/components/TopBar.ts
+++ b/src/components/TopBar.ts
@@ -4,11 +4,13 @@ import { globalAPI, ApiResponse, ProfileResponseData } from '../api/api'; // Imp
 
 export class TopBar {
     private container: HTMLElement;
+    private menuItems: Array<HTMLElement>;
     private profileDropdownVisible: boolean = false;
     private profileData: ProfileResponseData | null = null;
 
     constructor() {
         this.container = createElement('nav');
+        this.menuItems = [];
         this.container.classList.add('top-bar', 'navbar', 'navbar-expand-lg', 'navbar-light', 'bg-darker', 'mb-3', 'px-4');
         this.fetchProfileData();
     }
@@ -29,6 +31,19 @@ export class TopBar {
         }
     }
 
+    addMenuItem(text: string, href: string) {
+        const menuItem = createElement('li');
+        menuItem.classList.add('nav-item');
+        const itemLink = createElement('a');
+        itemLink.classList.add('nav-link');
+
+        itemLink.href = href;
+        itemLink.textContent = text;
+
+        menuItem.appendChild(itemLink);
+        this.menuItems.push(menuItem)
+    }
+
     render(): HTMLElement {
         this.container.innerHTML = '';
 
@@ -54,33 +69,9 @@ export class TopBar {
         const menuPages = createElement('ul');
         menuPages.classList.add('navbar-nav', 'me-auto', 'mb-2', 'mb-lg-0');
 
-        const dashboardMenuItem = createElement('li');
-        dashboardMenuItem.classList.add('nav-item');
-        const dashboardLink = createElement('a');
-        dashboardLink.classList.add('nav-link');
-        dashboardLink.href = '#/dashboard';
-        dashboardLink.textContent = 'Dashboard';
-        dashboardMenuItem.appendChild(dashboardLink);
-        menuPages.appendChild(dashboardMenuItem);
-
-        const classroomsMenuItem = createElement('li');
-        classroomsMenuItem.classList.add('nav-item');
-        const classroomsLink = createElement('a');
-        classroomsLink.classList.add('nav-link');
-        classroomsLink.href = '#/classrooms';
-        classroomsLink.textContent = 'Classrooms';
-        classroomsMenuItem.appendChild(classroomsLink);
-        menuPages.appendChild(classroomsMenuItem);
-
-        const adminMenuItem = createElement('li');
-        adminMenuItem.classList.add('nav-item');
-        const adminLink = createElement('a');
-        adminLink.classList.add('nav-link');
-        adminLink.href = '#/admin';
-        adminLink.textContent = 'Admin';
-        adminMenuItem.appendChild(adminLink);
-        menuPages.appendChild(adminMenuItem);
-
+        for (const item of this.menuItems) {
+            menuPages.appendChild(item);
+        }
 
         const profileSection = createElement('div');
         profileSection.classList.add('d-flex', 'align-items-center', 'ms-auto');