discourse/app/assets/javascripts/admin/addon/components/ace-editor.hbs
Alan Guo Xiang Tan 7d8dd0d8e3
UX: Show loading spinner while loading dependencies for ace-editor (#26099)
Why this change?

On a slow network, using the `AceEditor` component will result in a blob
of text being shown first before being swapped out with the `ace.js`
editor after it has completed loading.

There is also a problem when setting the theme for the editor which
would result in a "flash" as reported in
https://github.com/ajaxorg/ace/issues/3286. To avoid this, we need to
load the theme js file before displaying the editor.

What does this change do?

1. Adds a loading spinner and set the `div.ace` with a `.hidden` class.
2. Once all the relevant scripts and initialization is done, we will
   then remove the loading spinner and remove `div.ace`.
2024-03-11 06:56:17 +08:00

5 lines
116 B
Handlebars

{{#if this.isLoading}}
{{loading-spinner size="small"}}
{{else}}
<div class="ace">{{this.content}}</div>
{{/if}}