Add loading dialogue while waiting on API

src/suggesetor/VerseEditorSuggester.ts

@@ -39,6 +39,10 @@ export class VerseEditorSuggester extends EditorSuggest<VerseSuggesting> {
  editor: Editor,
  _: TFile
  ): EditorSuggestTriggerInfo | null {
+ // @ts-ignore
+ const suggestEl = (this.suggestEl as HTMLDivElement)
+ suggestEl.createDiv({ cls: 'obr-loading-container' }).hide()
+
  const currentContent = editor.getLine(cursor.line).substring(0, cursor.ch)
  const match = VerseTypoCheck(currentContent)
  if (match) {
@@ -62,7 +66,22 @@ export class VerseEditorSuggester extends EditorSuggest<VerseSuggesting> {
  async getSuggestions(
  context: EditorSuggestContext
  ): Promise<VerseSuggesting[]> {
- return getSuggestionsFromQuery(context.query, this.settings)
+ // @ts-ignore
+ const suggestEl = (this.suggestEl as HTMLDivElement)
+ // @ts-ignore
+ const suggestionsEl = (this.suggestions as any).containerEl as HTMLDivElement
+ suggestionsEl.hide()
+
+ const loadingContainer = (suggestEl.getElementsByClassName('obr-loading-container')[0] as HTMLDivElement)
+ loadingContainer.setText('Waiting on API response...')
+ loadingContainer.show()
+
+ const suggestions = getSuggestionsFromQuery(context.query, this.settings)
+
+ return suggestions.finally(() => {
+ loadingContainer.hide()
+ suggestionsEl.show()
+ })
  }
 
  renderSuggestion(suggestion: VerseSuggesting, el: HTMLElement): void {

styles.css

@@ -9,3 +9,7 @@ If your plugin does not need CSS, delete this file.
 .callout[data-callout='bible'] {
  --callout-icon: '<svg xmlns="http:https://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 336v-288C448 21.49 426.5 0 400 0H96C42.98 0 0 42.98 0 96v320c0 53.02 42.98 96 96 96h320c17.67 0 32-14.33 32-31.1c0-11.72-6.607-21.52-16-27.1v-81.36C441.8 362.8 448 350.2 448 336zM144 144c0-8.875 7.125-15.1 16-15.1L208 128V80c0-8.875 7.125-15.1 16-15.1l32 .0009c8.875 0 16 7.12 16 15.1V128L320 128c8.875 0 16 7.121 16 15.1v32c0 8.875-7.125 16-16 16L272 192v112c0 8.875-7.125 16-16 16l-32-.0002c-8.875 0-16-7.127-16-16V192L160 192c-8.875 0-16-7.127-16-16V144zM384 448H96c-17.67 0-32-14.33-32-32c0-17.67 14.33-32 32-32h288V448z"/></svg>';
 }
+
+.obr-loading-container {
+ padding: 1em;
+}