Add "Complement automatically" status to the status bar (#122)

src/main.ts

@@ -49,11 +49,15 @@ export default class VariousComponents extends Plugin {
     this.statusBar = ProviderStatusBar.new(
       this.addStatusBarItem(),
       this.settings.showMatchStrategy,
-      this.settings.showIndexingStatus
+      this.settings.showIndexingStatus,
+      this.settings.showComplementAutomatically
     );
     this.statusBar.setOnClickStrategyListener(async () => {
       await this.settingTab.toggleMatchStrategy();
     });
+    this.statusBar.setOnClickComplementAutomatically(async () => {
+      await this.settingTab.toggleComplementAutomatically();
+    });
 
     const debouncedSaveData = debounce(async () => {
       await this.saveData(this.settings);

src/setting/settings.ts

@@ -28,6 +28,7 @@ export interface Settings {
 
   // appearance
   showMatchStrategy: boolean;
+  showComplementAutomatically: boolean;
   showIndexingStatus: boolean;
   descriptionOnSuggestion: string;
 
@@ -93,6 +94,7 @@ export const DEFAULT_SETTINGS: Settings = {
 
   // appearance
   showMatchStrategy: true,
+  showComplementAutomatically: true,
   showIndexingStatus: true,
   descriptionOnSuggestion: "Short",
 
@@ -344,6 +346,20 @@ export class VariousComplementsSettingTab extends PluginSettingTab {
         );
       });
 
+    new Setting(containerEl)
+      .setName("Show Complement automatically")
+      .setDesc(
+        "Show complement automatically at the status bar. Changing this option requires a restart to take effect."
+      )
+      .addToggle((tc) => {
+        tc.setValue(this.plugin.settings.showComplementAutomatically).onChange(
+          async (value) => {
+            this.plugin.settings.showComplementAutomatically = value;
+            await this.plugin.saveSettings();
+          }
+        );
+      });
+
     new Setting(containerEl)
       .setName("Show Indexing status")
       .setDesc(

src/ui/AutoCompleteSuggest.ts

@@ -308,6 +308,9 @@ export class AutoCompleteSuggest
     this.settings = settings;
 
     this.statusBar.setMatchStrategy(this.matchStrategy);
+    this.statusBar.setComplementAutomatically(
+      this.settings.complementAutomatically
+    );
 
     try {
       this.tokenizer = await createTokenizer(this.tokenizerStrategy, this.app);

src/ui/ProviderStatusBar.ts

@@ -7,13 +7,15 @@ export class ProviderStatusBar {
     public customDictionary: HTMLElement | null,
     public internalLink: HTMLElement | null,
     public frontMatter: HTMLElement | null,
-    public matchStrategy: HTMLElement | null
+    public matchStrategy: HTMLElement | null,
+    public complementAutomatically: HTMLElement | null
   ) {}
 
   static new(
     statusBar: HTMLElement,
     showMatchStrategy: boolean,
-    showIndexingStatus: boolean
+    showIndexingStatus: boolean,
+    showComplementAutomatically: boolean
   ): ProviderStatusBar {
     const currentFile = showIndexingStatus
       ? statusBar.createEl("span", {
@@ -53,19 +55,31 @@ export class ProviderStatusBar {
         })
       : null;
 
+    console.log(showComplementAutomatically);
+    const complementAutomatically = showComplementAutomatically
+      ? statusBar.createEl("span", {
+          text: "---",
+          cls: "various-complements__footer various-complements__footer__complement-automatically",
+        })
+      : null;
+
     return new ProviderStatusBar(
       currentFile,
       currentVault,
       customDictionary,
       internalLink,
       frontMatter,
-      matchStrategy
+      matchStrategy,
+      complementAutomatically
     );
   }
 
   setOnClickStrategyListener(listener: () => void) {
     this.matchStrategy?.addEventListener("click", listener);
   }
+  setOnClickComplementAutomatically(listener: () => void) {
+    this.complementAutomatically?.addEventListener("click", listener);
+  }
 
   setCurrentFileDisabled() {
     this.currentFile?.setText("---");
@@ -118,4 +132,7 @@ export class ProviderStatusBar {
   setMatchStrategy(strategy: MatchStrategy) {
     this.matchStrategy?.setText(strategy.name);
   }
+  setComplementAutomatically(automatically: boolean) {
+    this.complementAutomatically?.setText(automatically ? "auto" : "manual");
+  }
 }