{{#if this.file}}
    {{!-- Upload in progress! --}}
    {{#if this.failureMessage}}
        <div class="failed">{{this.failureMessage}}</div>
    {{/if}}
    <div class="progress-container">
        <div class="progress">
            <div class="bar {{if this.failureMessage "fail"}}" style={{this.progressStyle}}></div>
        </div>
    </div>
    {{#if this.failureMessage}}
        <button class="gh-btn gh-btn-green" {{action "reset"}}><span>{{t "Try Again"}}</span></button>
    {{/if}}
{{else}}
    {{!-- file selection/drag-n-drop  --}}
    <div class="upload-form">
        <GhFileInput @multiple={{false}} @alt={{this.description}} @action={{action "fileSelected"}} @accept={{this.accept}}>
            <div class="gh-btn gh-btn-outline" data-test-file-input-description><span>{{this.description}}</span></div>
        </GhFileInput>

        {{#if (and this.allowUnsplash this.settings.unsplash.isActive)}}
            <div class="gh-image-uploader-unsplash" {{action (toggle "_showUnsplash" this)}}>
                {{svg-jar "unsplash"}}
            </div>
        {{/if}}
    </div>
{{/if}}

{{#if this._showUnsplash}}
    <GhUnsplash
        @select={{action "addUnsplashPhoto"}}
        @close={{action (toggle "_showUnsplash" this)}}
    />
{{/if}}