-
Notifications
You must be signed in to change notification settings - Fork 396
[ui-importer-modal] Bulk Edit column modal second iteration #4165
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
base: master
Are you sure you want to change the base?
Conversation
✅ Test files were modified. Ensure that the tests cover all relevant changes. ✅ |
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice work! See comments below
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
Can we get some screenshots for this PR? |
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...p/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.scss
Show resolved
Hide resolved
...p/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.scss
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Show resolved
Hide resolved
...re/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.test.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Show resolved
Hide resolved
...p/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.scss
Outdated
Show resolved
Hide resolved
...re/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.test.tsx
Outdated
Show resolved
Hide resolved
...op/core/src/desktop/js/apps/newimporter/ImporterFilePreview/EditColumns/EditColumnsModal.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR implements a bulk edit column modal for the UI importer, allowing users to edit column headers, types, and comments through a modal interface. The modal displays sample data to help users make informed decisions about column configurations.
- Adds a fully functional edit columns modal with input fields for name, type selection, sample data display, and comment editing
- Integrates the modal with the main file preview component, enabling column data to be updated and persisted
- Includes comprehensive test coverage for the new modal functionality
Reviewed Changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 5 comments.
Show a summary per file
File | Description |
---|---|
ImporterFilePreview.tsx | Integrates edit columns modal with state management for column data and destination configuration |
ImporterFilePreview.scss | Adds styling for the edit columns button |
EditColumnsModal.tsx | Implements the complete modal with table, input fields, type selection, and data handling |
EditColumnsModal.test.tsx | Adds comprehensive unit tests for the modal functionality |
EditColumnsModal.scss | Defines styling for modal components including input and select elements |
utils.ts | Adds SQL type mapping API URL constant |
What changes were proposed in this pull request?
Adding edit columns button on the right and on clicking it, getting the modal with 4 different columns, a cancel and a done button, where the user will be able to edit the column header from the modal and on clicking Done button, he/she will be able to see the updated column header (name) in the preview. Also, getting pre-filled data from the file (say csv) into the modal.
How was this patch tested?
Manual testing, will add unit tests soon.
Video of what is done in the PR:
Screen.Recording.2025-07-14.at.3.14.38.PM.mov
Please review Hue Contributing Guide before opening a pull request.