feat(settings): add button to reload custom icons

aidenlx · Jan 4, 2022 · 28a9fe6 · 28a9fe6
1 parent e760e5e
commit 28a9fe6
Show file tree

Hide file tree

Showing 2 changed files with 70 additions and 52 deletions.
diff --git a/src/icon-packs/pack-manager.ts b/src/icon-packs/pack-manager.ts
@@ -124,7 +124,7 @@ export default class PackManager extends Events {
     return !(pack in status) || status[pack as keyof typeof status] === true;
   }
 
-  private refresh() {
+  private refreshPackNames() {
     this._cutomsIconPacknames.clear();
     for (const [, { pack }] of this._customIcons) {
       this._cutomsIconPacknames.add(pack);
@@ -136,7 +136,12 @@ export default class PackManager extends Events {
 
   private _loaded = false;
   async loadCustomIcons(): Promise<void> {
-    if (this._loaded) return;
+    if (this._loaded) {
+      this._fuse.setCollection([]);
+      this._customIcons.clear();
+      this._cutomsIconPacknames.clear();
+      this._loaded = false;
+    }
     if (!(await this.vault.adapter.exists(this.customIconsDir))) {
       await this.vault.adapter.mkdir(this.customIconsDir);
       return;
@@ -165,7 +170,7 @@ export default class PackManager extends Events {
         console.error("Failed to load icon", result.reason);
     }
     this._loaded = true;
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("initialized", this.plugin.api);
   }
   async backupCustomIcons(pack?: string): Promise<void> {
@@ -281,7 +286,7 @@ export default class PackManager extends Events {
         addedIds.push(result.value);
       }
     }
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("changed", this.plugin.api);
     new Notice(addedIds.length.toString() + " icons added");
   }
@@ -311,7 +316,7 @@ export default class PackManager extends Events {
       }
     }
     if (changed) {
-      this.refresh();
+      this.refreshPackNames();
       this.trigger("changed", this.plugin.api);
     }
   }
@@ -331,7 +336,7 @@ export default class PackManager extends Events {
       return result;
     });
     if (toDelete.size === 0) return;
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("changed", this.plugin.api);
     const queue = [...toDelete].map(async (path) => {
       try {
@@ -368,7 +373,7 @@ export default class PackManager extends Events {
     }
     this.set(renameTo, info, false);
     this.delete(id, false, false);
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("changed", this.plugin.api);
     return newId;
   }
@@ -414,7 +419,7 @@ export default class PackManager extends Events {
       new IconFileOpError("rename", id, error, targetId);
     }
 
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("changed", this.plugin.api);
     return targetId;
   }
@@ -443,7 +448,7 @@ export default class PackManager extends Events {
       };
     this._fuse.add(iconId);
     if (refresh) {
-      this.refresh();
+      this.refreshPackNames();
       this.trigger("changed", this.plugin.api);
     }
   }
@@ -465,7 +470,7 @@ export default class PackManager extends Events {
     const result = this._customIcons.delete(id);
     this._fuse.remove((icon) => icon.id === id);
     if (refresh) {
-      this.refresh();
+      this.refreshPackNames();
       this.trigger("changed", this.plugin.api);
     }
     return result;
@@ -481,7 +486,7 @@ export default class PackManager extends Events {
     }
     this._customIcons.clear();
     this._fuse.remove((id) => !BuiltInIconIds.includes(id));
-    this.refresh();
+    this.refreshPackNames();
     this.trigger("changed", this.plugin.api);
   }
 

diff --git a/src/settings.ts b/src/settings.ts
@@ -50,7 +50,7 @@ export class IconSCSettingTab extends PluginSettingTab {
   display(): void {
     const { containerEl } = this;
 
-    containerEl.empty();
+    this.containerEl.empty();
 
     new Setting(containerEl)
       .setName("Replace emoji shortcode with emoji character")
@@ -88,7 +88,57 @@ export class IconSCSettingTab extends PluginSettingTab {
       });
 
     this.skipIconPack();
-    this.manageCustomIcons();
+
+    // custom icon manage section
+    const managerContainer = createDiv({
+      cls: ["isc-settings-custom-icon", "installed-plugins-container"],
+    });
+    new Setting(this.containerEl)
+      .setHeading()
+      .setName("Custom Icons")
+      .addExtraButton((btn) =>
+        btn
+          .setIcon("sheets-in-box")
+          .setTooltip("Backup icons")
+          .onClick(() => this.plugin.packManager.backupCustomIcons()),
+      )
+      .addExtraButton((btn) =>
+        btn
+          .setIcon("restore-file-glyph")
+          .setTooltip("Restore backup")
+          .onClick(async () =>
+            this.plugin.packManager.importCustomIcons(
+              await fileDialog({ multiple: false, accept: ".zip" }),
+              false,
+            ),
+          ),
+      )
+      .addExtraButton((btn) =>
+        btn
+          .setIcon("switch")
+          .setTooltip("Reload custom icons")
+          .onClick(async () => {
+            await this.plugin.packManager.loadCustomIcons();
+            this.manageCustomIcons(managerContainer);
+            new Notice("Custom icons reloaded");
+          }),
+      )
+      .then(
+        (s) =>
+          Platform.isDesktopApp &&
+          s.addExtraButton((btn) =>
+            btn
+              .setIcon("folder")
+              .setTooltip("Open Icons Folder")
+              .onClick(() =>
+                this.app.openWithDefaultApp(
+                  this.plugin.packManager.customIconsDir,
+                ),
+              ),
+          ),
+      );
+    this.containerEl.appendChild(managerContainer);
+    this.manageCustomIcons(managerContainer);
   }
 
   skipIconPack(): void {
@@ -144,45 +194,8 @@ export class IconSCSettingTab extends PluginSettingTab {
     );
   }
 
-  manageCustomIcons(): void {
-    new Setting(this.containerEl)
-      .setHeading()
-      .setName("Custom Icons")
-      .addExtraButton((btn) =>
-        btn
-          .setIcon("sheets-in-box")
-          .setTooltip("Backup icons")
-          .onClick(() => this.plugin.packManager.backupCustomIcons()),
-      )
-      .addExtraButton((btn) =>
-        btn
-          .setIcon("restore-file-glyph")
-          .setTooltip("Restore backup")
-          .onClick(async () =>
-            this.plugin.packManager.importCustomIcons(
-              await fileDialog({ multiple: false, accept: ".zip" }),
-              false,
-            ),
-          ),
-      )
-      .then(
-        (s) =>
-          Platform.isDesktopApp &&
-          s.addExtraButton((btn) =>
-            btn
-              .setIcon("folder")
-              .setTooltip("Open Icons Folder")
-              .onClick(() =>
-                this.app.openWithDefaultApp(
-                  this.plugin.packManager.customIconsDir,
-                ),
-              ),
-          ),
-      );
-
-    const containerEl = this.containerEl.createDiv({
-      cls: ["isc-settings-custom-icon", "installed-plugins-container"],
-    });
+  manageCustomIcons(containerEl: HTMLElement): void {
+    if (containerEl.hasChildNodes()) containerEl.empty();
 
     const isPacknameInvalid = (name: string) =>
       !/^[A-Za-z0-9]+$/.test(name) ||