v0.2.79

static/js/note-editor.js

@@ -2102,13 +2102,44 @@ export function startNoteEditor(adapter) {
     grid: document.querySelector("#emoji-grid"),
     empty: document.querySelector("#emoji-empty"),
   };
+  const emojiLoading = document.querySelector("#emoji-loading");
+  const emojiLoadingText = document.querySelector("#emoji-loading-text");
+  const emojiContent = document.querySelector("#emoji-content");
   let emojiPickerLoad = null;
+  let emojiPickerBound = false;
+
+  const setEmojiPickerState = state => {
+    const failed = state === "error";
+    const ready = state === "ready";
+    emojiPickerArgs.details?.setAttribute("aria-busy", String(state === "loading"));
+    if (emojiLoading) {
+      emojiLoading.hidden = ready;
+      emojiLoading.classList.toggle("is-error", failed);
+      const spinner = emojiLoading.querySelector(".ui-spinner");
+      if (spinner) spinner.hidden = failed;
+    }
+    if (emojiLoadingText) {
+      emojiLoadingText.textContent = failed
+        ? t("editor.emojiLoadFailed", {}, "Could not load emoji. Close and reopen the picker to retry.")
+        : t("editor.emojiLoading", {}, "Loading emoji…");
+    }
+    if (emojiContent) emojiContent.hidden = !ready;
+  };
+
   const loadEmojiPicker = async () => {
+    if (emojiPickerBound) {
+      setEmojiPickerState("ready");
+      return;
+    }
     if (emojiPickerLoad) return emojiPickerLoad;
+    setEmojiPickerState("loading");
     emojiPickerLoad = import("@rustpad/emoji-picker").then(({ bindEmojiPicker }) => {
       bindEmojiPicker(emojiPickerArgs);
+      emojiPickerBound = true;
+      setEmojiPickerState("ready");
     }).catch(error => {
       emojiPickerLoad = null;
+      setEmojiPickerState("error");
       throw error;
     });
     return emojiPickerLoad;