The last few tweaks that were needed to make this work

static/crossroad.mts

@@ -1,7 +1,7 @@
 import { initializeAddInstanceDialog } from "./add_an_instance.mjs";
 import { initializeInstanceDetailsDialog } from "./confirm_instance_details.mjs";
 import knownSoftware from "./known_software.mjs";
-import storageManager from "./storage_manager.mjs";
+import storageManager, { Instance } from "./storage_manager.mjs";
 console.log(knownSoftware);
 
 console.log(storageManager.storage.instances);
@@ -17,12 +17,15 @@ const instanceDetailsDialogCallback = (
     software: string,
     icon: string | null
 ) => {
-    storageManager.storage.instances.push({
+    const instance: Instance = {
         name,
         origin: `http${hostSecure ? "s" : ""}://${host}`,
         software,
         iconURL: icon ?? undefined
-    });
+    };
+    storageManager.storage.instances.push(instance);
+    storageManager.save();
+    console.log("Successfully added new instance:", instance);
 };
 
 const detailsDialog = document.querySelector("#instanceDetails");
@@ -42,7 +45,7 @@ const addInstanceDialogCallback = async (
     try {
         if (!autoQueryMetadata) throw new Error("Don't");
         const { name, software, iconURL } =
-            await fetch(`/api/instance_info/${secure}/${encodeURI(host)}`)
+            await fetch(`/api/instance_info/${secure}/${encodeURIComponent(host)}`)
                 .then(r => r.json());
         if (
             typeof name !== "string"

static/storage_manager.mts

@@ -1,4 +1,4 @@
-type Instance = {
+export type Instance = {
     /**
      * The instance's (nick)name
      * @example "eepy.moe"