Skip to content

add waiting state to the import upload button. #797

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
KevinJump merged 1 commit into from
Sep 9, 2025
+11 −1
Merged

add waiting state to the import upload button. #797

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions uSync.Backoffice.Management.Client/usync-assets/src/lang/files/en-us.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ export default {
noChangesImport: 'No changes where made to this item',
noChangesReport: 'No changes detected',

importHeader: 'Import from file',
Comment thread
KevinJump marked this conversation as resolved.

success: 'Success',
change: 'Change',
changeType: 'Type',
Expand Down
10 changes: 9 additions & 1 deletion ...fice.Management.Client/usync-assets/src/workspace/components/usync-file-upload.element.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,16 @@ import {
UmbTemporaryFileModel,
} from '@umbraco-cms/backoffice/temporary-file';
import { uSyncFilePickerChangeEvent, uSyncFilePickerUploadedEvent } from './events';
import { UUIButtonState } from '@umbraco-cms/backoffice/external/uui';

@customElement('usync-file-upload')
export class uSyncFileUploadElement extends UmbLitElement {
#fileManager: UmbTemporaryFileManager;
#repository: uSyncActionRepository;

@state()
buttonState?: UUIButtonState;

@state()
selected: File | null | undefined;

Expand All @@ -36,6 +40,7 @@ export class uSyncFileUploadElement extends UmbLitElement {
value.forEach((file) => {
if (file.status === TemporaryFileStatus.SUCCESS) {
this.#uploadComplete(file.temporaryUnique);
this.buttonState = 'success';

Copilot AI Sep 9, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The button state is set to 'success' but never reset. This means subsequent uploads will start with a success state instead of the default state. Consider resetting the button state when starting a new upload or after a timeout.

Copilot uses AI. Check for mistakes.
}
});
});
Expand All @@ -44,6 +49,8 @@ export class uSyncFileUploadElement extends UmbLitElement {
#onUpload() {
if (!this.selected) return;

this.buttonState = 'waiting';

const upload: UmbTemporaryFileModel = {
temporaryUnique: UmbId.new(),
file: this.selected,
Expand Down Expand Up @@ -93,7 +100,8 @@ export class uSyncFileUploadElement extends UmbLitElement {
type="button"
look="primary"
@click="${this.#onUpload}"
label="Upload"></uui-button>`;
label="Upload"
.state=${this.buttonState}></uui-button>`;
}

static styles = css`
Expand Down
Loading