Skip to content
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.

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

Fix: Add tus data to ecc-utils-design-form on upload #388

Merged
merged 5 commits into from
Dec 5, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
5 changes: 5 additions & 0 deletions .changeset/afraid-pugs-rush.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@elixir-cloud/design": patch
---

return data from tus upload on ecc-utils-design-form
35 changes: 25 additions & 10 deletions packages/ecc-utils-design/src/components/form/form.ts
Original file line number Diff line number Diff line change
Expand Up @@ -164,12 +164,12 @@ export default class EccUtilsDesignForm extends LitElement {
private handleTusFileUpload = async (
e: Event,
field: Field
): Promise<void> => {
): Promise<Record<string, string> | null> => {
const file = (e.target as HTMLInputElement).files?.[0];

if (!file) {
console.error("No file selected for upload.");
return;
return null;
}

try {
Expand All @@ -194,11 +194,20 @@ export default class EccUtilsDesignForm extends LitElement {
this.requestUpdate();
},
onSuccess: () => {
const data: any = {
url: upload.url,
file,
name: "",
};

if ("name" in upload.file) {
console.log("Download %s from %s", upload.file.name, upload.url);
data.name = upload.file.name;
} else {
console.log("Download file from %s", upload.url);
}

return data;
},
});

Expand All @@ -211,6 +220,8 @@ export default class EccUtilsDesignForm extends LitElement {
} catch (error) {
console.error("An error occurred while initializing the upload:", error);
}

return null;
};

renderInputTemplate(field: Field, path: string): TemplateResult {
Expand Down Expand Up @@ -248,7 +259,12 @@ export default class EccUtilsDesignForm extends LitElement {
class="file-input"
?disabled=${field.fieldOptions?.readonly}
@change=${async (e: Event) => {
await this.handleTusFileUpload(e, field);
const data = await this.handleTusFileUpload(e, field);

if (data) {
_.set(this.form, path, data);
this.alertFieldChange(field.key, data);
}
}}
/>
<div class="progress-bar-container">
Expand Down Expand Up @@ -548,17 +564,19 @@ export default class EccUtilsDesignForm extends LitElement {
if (field.type === "array") {
return this.renderArrayTemplate(field, newPath);
}
if (field.type === "switch") {
return this.renderSwitchTemplate(field, newPath);
}

if (field.fieldOptions?.required) {
if (
!_.get(this.form, newPath) &&
!this.requiredButEmpty.includes(field.key)
) {
// add to requiredButEmpty

// eslint-disable-next-line no-empty
if (!this.hasUpdated && field.fieldOptions.default) {
} else this.requiredButEmpty.push(field.key);
if (this.hasUpdated || !field.fieldOptions.default) {
this.requiredButEmpty.push(field.key);
}
} else if (_.get(this.form, newPath)) {
// remove from requiredButEmpty
this.requiredButEmpty = this.requiredButEmpty.filter(
Expand All @@ -567,9 +585,6 @@ export default class EccUtilsDesignForm extends LitElement {
}
}

if (field.type === "switch") {
return this.renderSwitchTemplate(field, newPath);
}
return this.renderInputTemplate(field, newPath);
}

Expand Down