Add proper view segregation

src/main/resources/static/js/admin.js

@@ -14,7 +14,6 @@ function connect() {
             handleEvent(body);
         });
         fetchAssets();
-        fetchAdmins();
     });
 }
 
@@ -22,18 +21,6 @@ function fetchAssets() {
     fetch(`/api/channels/${broadcaster}/assets`).then(r => r.json()).then(renderAssets);
 }
 
-function fetchAdmins() {
-    fetch(`/api/channels/${broadcaster}/admins`).then(r => r.json()).then(list => {
-        const adminList = document.getElementById('admin-list');
-        adminList.innerHTML = '';
-        list.forEach(a => {
-            const li = document.createElement('li');
-            li.textContent = a;
-            adminList.appendChild(li);
-        });
-    }).catch(() => {});
-}
-
 function renderAssets(list) {
     list.forEach(asset => assets.set(asset.id, asset));
     draw();
@@ -77,16 +64,6 @@ function uploadAsset() {
     });
 }
 
-function addAdmin() {
-    const usernameInput = document.getElementById('new-admin');
-    const username = usernameInput.value;
-    fetch(`/api/channels/${broadcaster}/admins`, {
-        method: 'POST',
-        headers: {'Content-Type': 'application/json'},
-        body: JSON.stringify({username})
-    }).then(() => fetchAdmins());
-}
-
 window.addEventListener('resize', () => {
     canvas.width = canvas.offsetWidth;
     canvas.height = canvas.offsetHeight;

src/main/resources/static/js/dashboard.js

@@ -0,0 +1,44 @@
+function renderAdmins(list) {
+    const adminList = document.getElementById('admin-list');
+    adminList.innerHTML = '';
+    if (!list || list.length === 0) {
+        const empty = document.createElement('li');
+        empty.textContent = 'No channel admins yet';
+        adminList.appendChild(empty);
+        return;
+    }
+
+    list.forEach((admin) => {
+        const li = document.createElement('li');
+        li.textContent = admin;
+        adminList.appendChild(li);
+    });
+}
+
+function fetchAdmins() {
+    fetch(`/api/channels/${broadcaster}/admins`)
+        .then((r) => r.json())
+        .then(renderAdmins)
+        .catch(() => renderAdmins([]));
+}
+
+function addAdmin() {
+    const input = document.getElementById('new-admin');
+    const username = input.value.trim();
+    if (!username) {
+        alert('Enter a Twitch username to add as an admin.');
+        return;
+    }
+
+    fetch(`/api/channels/${broadcaster}/admins`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ username })
+    })
+        .then(() => {
+            input.value = '';
+            fetchAdmins();
+        });
+}
+
+fetchAdmins();