completed #67 - "Cache" Loaded Channels

apps/home/static/home/js/servers.js

@@ -50,14 +50,50 @@ function removeFromLoadedServers(id) {
 // region Loaded Channels
 
 var _loadedChannels = {};
-function loadedChannels(serverId) {
+async function loadedChannels(serverId) {
     if (!(serverId in _loadedChannels)) {
-        throw new Error(`channels not loaded for server: ${serverId}`);
+        await fetchChannels(serverId);
     }
 
     return _loadedChannels[serverId]
 }
 
+$(document).on("selectedServerChange", async function() {
+    // Try load channels to determine if bot has permissions
+    loadedChannels(selectedServer.id);
+});
+
+const fetchChannels = async serverId => {
+    $(".sidebar .sidebar-item").prop("disabled", true);
+
+    try {
+        $(`.sidebar .sidebar-item[data-id="${serverId}"]`).removeClass("is-not-operational");
+        channels = await ajaxRequest(`/generate-channels?guild=${serverId}`, "GET");
+        _loadedChannels[serverId] = channels;
+    }
+    catch (error) {
+        logError(error);
+
+        switch (error?.status) {
+            case 429:
+                rateLimitedLoadingChannels(error.responseJSON.retry_after);
+                break;
+
+            case 403:
+                notAuthorisedLoadingChannels(serverId);
+                break;
+
+            default:
+                alert("unknown error loading channels");
+                break;
+        }
+        
+    }
+    finally {
+        $(".sidebar .sidebar-item").prop("disabled", false);
+    }
+}
+
 const rateLimitedLoadingChannels = retryAfterSeconds => {
     createModal({
         title: "Failed to Fetch Server Channels",
@@ -75,18 +111,18 @@ const rateLimitedLoadingChannels = retryAfterSeconds => {
     });
 }
 
-const notAuthorisedLoadingChannels = () => {
+const notAuthorisedLoadingChannels = serverId => {
     // Mark the sidebar item as non-operational
     $(`.sidebar .sidebar-item[data-id="${serverId}"]`).addClass("is-not-operational");
 
     const inviteBotToServer = () => {
         window.open(
             `https://discord.com/oauth2/authorize
-    ?client_id=${discordClientId}
+?client_id=${discordClientId}
-    &permissions=2147534848
+&permissions=2147534848
-    &scope=bot+applications.commands
+&scope=bot+applications.commands
-    &guild_id=${serverId}
+&guild_id=${serverId}
-    &disable_guild_select=true`,
+&disable_guild_select=true`,
             "_blank"
         );
     }
@@ -115,39 +151,6 @@ const notAuthorisedLoadingChannels = () => {
     });
 }
 
-$(document).on("selectedServerChange", async function() {
-    serverId = selectedServer.id;  // take note incase 'selectedServer' changes
-
-    $(".sidebar .sidebar-item").prop("disabled", true);
-
-    try {
-        $(`.sidebar .sidebar-item[data-id="${serverId}"]`).removeClass("is-not-operational");
-        channels = await ajaxRequest(`/generate-channels?guild=${serverId}`, "GET");
-        _loadedChannels[serverId] = channels;
-    }
-    catch (error) {
-        logError(error);
-
-        switch (error?.status) {
-            case 429:
-                rateLimitedLoadingChannels(error.responseJSON.retry_after);
-                break;
-
-            case 403:
-                notAuthorisedLoadingChannels();
-                break;
-
-            default:
-                alert("unknown error loading channels");
-                break;
-        }
-        
-    }
-    finally {
-        $(".sidebar .sidebar-item").prop("disabled", false);
-    }
-});
-
 
 // region UI Buttons
 

apps/home/static/home/js/tabs/subs.js

@@ -270,7 +270,7 @@ async function loadSubModalOptions($input, url) {
 }
 
 // Channel options aren't loaded from an API, like other options.
-function loadChannelOptions() {
+async function loadChannelOptions() {
     $input = $(subModalId).find('[data-field="channels"]');
 
     $input.val("").change();
@@ -282,7 +282,7 @@ function loadChannelOptions() {
         }
     });
 
-    const data = loadedChannels(selectedServer.id);
+    const data = await loadedChannels(selectedServer.id);
     data.forEach(item => {
         $input.append($(
             "<option>",