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

[SalihuDickson]

Description

Fixes #387

Checklist

• My code follows the contributing guidelines of this project.
• I am aware that all my commits will be squashed into a single commit, using the PR title as the commit message.
• I have performed a self-review of my own code.
• I have commented my code in hard-to-understand areas.
• I have updated the user-facing documentation to describe any new or changed behavior.
• My changes generate no new warnings.
• I have added tests that prove my fix is effective or that my feature works.
• I have not reduced the existing code coverage.

Comments

Summary by Sourcery

Fix the TUS file upload handling in the ecc-utils-design-form component to return upload data and update form state accordingly. Enhance the management of required fields and document the changes with a new changeset file.

Bug Fixes:

• Fix the return value of the handleTusFileUpload function to return upload data instead of void.

Enhancements:

• Update the form handling logic to store and alert field changes when TUS upload data is available.
• Improve the management of required fields by updating the requiredButEmpty list based on form data presence.

Chores:

• Add a changeset file to document the patch changes for the TUS upload data return feature.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
elixir-cloud-components	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 25, 2024 3:14pm

[changeset-bot]

🦋 Changeset detected

Latest commit: 1613b89

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@elixir-cloud/design	Patch
@elixir-cloud/tes	Patch
@elixir-cloud/wes	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[sourcery-ai]

Reviewer's Guide by Sourcery

This PR modifies the file upload handling in the EccUtilsDesignForm component to properly return and store TUS (resumable upload protocol) data after a successful file upload. The implementation includes returning upload metadata, updating form data, and improving the handling of required fields validation.

Sequence diagram for TUS file upload process

sequenceDiagram
    actor User
    participant Form as EccUtilsDesignForm
    participant Server

    User->>Form: Select file for upload
    Form->>Server: Initialize TUS upload
    Server-->>Form: Upload URL
    Form->>Server: Upload file
    Server-->>Form: Upload success
    Form->>Form: Return upload data
    Form->>Form: Update form data
    Form->>User: Notify upload success

Loading

Updated class diagram for EccUtilsDesignForm

classDiagram
    class EccUtilsDesignForm {
        -handleTusFileUpload(Event, Field) Promise<Record<string, string> | null>
        -renderInputTemplate(Field, string) TemplateResult
        -render()
        -requiredButEmpty: string[]
        +alertFieldChange(string, Record<string, string>)
    }
    note for EccUtilsDesignForm "handleTusFileUpload now returns upload data or null"

Loading

File-Level Changes

Change	Details	Files
Modified file upload handler to return upload metadata	Changed return type from void to Record<string, string>	null Added return of upload metadata including URL, file object, and name Return null for failed uploads or when no file is selected
Updated form data management for file uploads	Store upload data in form state after successful upload Trigger field change notification with upload data Improved handling of required fields validation logic	packages/ecc-utils-design/src/components/form/form.ts
Enhanced required fields validation	Added check to prevent duplicate entries in requiredButEmpty array Added logic to remove field from requiredButEmpty when value is set Removed redundant requiredButEmpty reset in render method	packages/ecc-utils-design/src/components/form/form.ts

Assessment against linked issues

Issue	Objective	Addressed	Explanation
#387	Fix tus file upload to properly set data on the form object in ecc-utils-design-form component	✅

Possibly linked issues

• bug: tus file upload does not set data on form object on ecc-utils-design-form component #387: The PR fixes the issue by returning data from tus upload to the form object.

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it.
• Generate a pull request title: Write @sourcery-ai anywhere in the pull
  request title to generate a title at any time.
• Generate a pull request summary: Write @sourcery-ai summary anywhere in
  the pull request body to generate a PR summary at any time. You can also use
  this command to specify where the summary should be inserted.

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

[sourcery-ai]

Hey @SalihuDickson - I've reviewed your changes - here's some feedback:

Overall Comments:

• Consider using a proper TypeScript interface instead of 'any' for the upload data object to maintain better type safety

Here's what I looked at during the review

• 🟡 General issues: 1 issue found
• 🟢 Security: all looks good
• 🟢 Testing: all looks good
• 🟡 Complexity: 1 issue found
• 🟢 Documentation: all looks good

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

[SalihuDickson]

hey @anuragxxd, can you please take a look at this

[anuragxxd]

Looks good to me! Just a small comment!