mirror of
https://gh.wpcy.net/https://github.com/discourse/discourse.git
synced 2026-05-14 07:48:28 +08:00
This commit adds a loading spinner when installing a theme as sometimes installing a theme can take quite a bit of time this way we have some indication that things are still working as the theme is being installed.
206 lines
No EOL
6.7 KiB
Handlebars
206 lines
No EOL
6.7 KiB
Handlebars
<DModal
|
|
@bodyClass="install-theme"
|
|
class="admin-install-theme-modal"
|
|
@title={{i18n "admin.customize.theme.install"}}
|
|
@closeModal={{@closeModal}}
|
|
>
|
|
<:body>
|
|
{{#unless this.directRepoInstall}}
|
|
<div class="install-theme-items">
|
|
<InstallThemeItem
|
|
@value="popular"
|
|
@selection={{this.selection}}
|
|
@label="admin.customize.theme.install_popular"
|
|
/>
|
|
<InstallThemeItem
|
|
@value="local"
|
|
@selection={{this.selection}}
|
|
@label="admin.customize.theme.install_upload"
|
|
/>
|
|
<InstallThemeItem
|
|
@value="remote"
|
|
@selection={{this.selection}}
|
|
@label="admin.customize.theme.install_git_repo"
|
|
/>
|
|
<InstallThemeItem
|
|
@value="create"
|
|
@selection={{this.selection}}
|
|
@label="admin.customize.theme.install_create"
|
|
@showIcon={{true}}
|
|
/>
|
|
</div>
|
|
{{/unless}}
|
|
<div class="install-theme-content">
|
|
<ConditionalLoadingSection
|
|
@isLoading={{this.loading}}
|
|
@title={{i18n "admin.customize.theme.installing_message"}}
|
|
>
|
|
{{#if this.popular}}
|
|
<div class="popular-theme-items">
|
|
{{#each this.themes as |theme|}}
|
|
<div class="popular-theme-item" data-name={{theme.name}}>
|
|
<div class="popular-theme-name">
|
|
<a
|
|
href={{theme.meta_url}}
|
|
rel="noopener noreferrer"
|
|
target="_blank"
|
|
>
|
|
{{#if theme.component}}
|
|
{{d-icon
|
|
"puzzle-piece"
|
|
title="admin.customize.theme.component"
|
|
}}
|
|
{{/if}}
|
|
{{theme.name}}
|
|
</a>
|
|
<div class="popular-theme-description">
|
|
{{theme.description}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="popular-theme-buttons">
|
|
{{#if theme.installed}}
|
|
<span>{{i18n "admin.customize.theme.installed"}}</span>
|
|
{{else}}
|
|
<DButton
|
|
class="btn-small"
|
|
@label="admin.customize.theme.install"
|
|
@disabled={{this.installDisabled}}
|
|
@icon="upload"
|
|
@action={{fn this.installThemeFromList theme.value}}
|
|
/>
|
|
|
|
{{#if theme.preview}}
|
|
<a
|
|
href={{theme.preview}}
|
|
rel="noopener noreferrer"
|
|
target="_blank"
|
|
>
|
|
{{d-icon "desktop"}}
|
|
{{i18n "admin.customize.theme.preview"}}
|
|
</a>
|
|
{{/if}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.local}}
|
|
<div class="inputs">
|
|
<input
|
|
{{on "change" this.uploadLocaleFile}}
|
|
type="file"
|
|
id="file-input"
|
|
accept=".dcstyle.json,application/json,.tar.gz,application/x-gzip,.zip,application/zip"
|
|
/>
|
|
<br />
|
|
<span class="description">
|
|
{{i18n "admin.customize.theme.import_file_tip"}}
|
|
</span>
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.remote}}
|
|
<div class="inputs">
|
|
<div class="repo">
|
|
<div class="label">
|
|
{{i18n "admin.customize.theme.import_web_tip"}}
|
|
</div>
|
|
<Input
|
|
@value={{this.uploadUrl}}
|
|
placeholder={{this.urlPlaceholder}}
|
|
/>
|
|
</div>
|
|
<DButton
|
|
class="btn-small advanced-repo"
|
|
@action={{this.toggleAdvanced}}
|
|
@label="admin.customize.theme.import_web_advanced"
|
|
/>
|
|
{{#if this.advancedVisible}}
|
|
<div class="branch">
|
|
<div class="label">
|
|
{{i18n "admin.customize.theme.remote_branch"}}
|
|
</div>
|
|
<Input @value={{this.branch}} placeholder="main" />
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.showPublicKey}}
|
|
<div class="public-key">
|
|
<div class="label">
|
|
{{i18n "admin.customize.theme.public_key"}}
|
|
</div>
|
|
<div class="public-key-text-wrapper">
|
|
<Textarea
|
|
class="public-key-value"
|
|
readonly={{true}}
|
|
@value={{this.publicKey}}
|
|
{{did-insert this.generatePublicKey}}
|
|
/>
|
|
<CopyButton @selector="textarea.public-key-value" />
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.create}}
|
|
<div class="inputs">
|
|
<div class="label">{{i18n
|
|
"admin.customize.theme.create_name"
|
|
}}</div>
|
|
<Input @value={{this.name}} placeholder={{this.placeholder}} />
|
|
<div class="label">{{i18n
|
|
"admin.customize.theme.create_type"
|
|
}}</div>
|
|
<ComboBox
|
|
@valueProperty="value"
|
|
@content={{this.createTypes}}
|
|
@value={{this.selectedType}}
|
|
@onChange={{this.updateSelectedType}}
|
|
/>
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.directRepoInstall}}
|
|
<div class="repo">
|
|
<div class="label">
|
|
{{html-safe
|
|
(i18n
|
|
"admin.customize.theme.direct_install_tip"
|
|
name=this.uploadName
|
|
)
|
|
}}
|
|
</div>
|
|
<pre><code>{{this.uploadUrl}}</code></pre>
|
|
</div>
|
|
{{/if}}
|
|
</ConditionalLoadingSection>
|
|
</div>
|
|
</:body>
|
|
<:footer>
|
|
{{#unless this.popular}}
|
|
{{#if this.duplicateRemoteThemeWarning}}
|
|
<div class="install-theme-warning">
|
|
⚠️
|
|
{{this.duplicateRemoteThemeWarning}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if this.themeCannotBeInstalled}}
|
|
<div class="install-theme-warning">
|
|
⚠️
|
|
{{this.themeCannotBeInstalled}}
|
|
</div>
|
|
{{/if}}
|
|
<DButton
|
|
@action={{this.installTheme}}
|
|
@disabled={{this.installDisabled}}
|
|
class="btn
|
|
{{if this.themeCannotBeInstalled 'btn-danger' 'btn-primary'}}"
|
|
@label={{this.submitLabel}}
|
|
/>
|
|
<DButton
|
|
class="btn-flat d-modal-cancel"
|
|
@action={{@closeModal}}
|
|
@label="cancel"
|
|
/>
|
|
{{/unless}}
|
|
</:footer>
|
|
</DModal> |