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

TD-3355 - Fixes Clear button on Variant select when deselecting #1033

Conversation

stevenmcsorleyipg
Copy link
Contributor

@stevenmcsorleyipg stevenmcsorleyipg commented Jan 29, 2025

Close TD-3355

Changes

Removes the X close button when the variant select is cleared, it was only happening on the variant select
Adding UX @Sowbhagya-ipg

Dependencies

n/a

UI/UX

before
image

After
image

Testing notes

Author checklist

Before I request a review:

  • I have reviewed my own code-diff.
    - [ ] I have tested the changes in Docker / a deploy-preview.
  • I have assigned the PR to myself or an appropriate delegate.
  • I have added the relevant labels to the PR.
    - [ ] I have included appropriate tests.
  • I have checked that the Lint and Test workflows pass on Github.
    - [ ] I have populated the deploy-preview with relevant test data.
  • I have tagged a UI/UX designer for review if this PR includes UI/UX changes.

@stevenmcsorleyipg stevenmcsorleyipg self-assigned this Jan 29, 2025
@stevenmcsorleyipg stevenmcsorleyipg added the bug Something isn't working label Jan 29, 2025
Copy link

github-actions bot commented Jan 29, 2025

Coverage Report

Status Category Percentage Covered / Total
🟢 Lines 70.33% (🎯 66%) 10244 / 14565
🟢 Statements 70.33% (🎯 66%) 10244 / 14565
🟢 Functions 73.01% (🎯 70%) 422 / 578
🟢 Branches 85.99% (🎯 80%) 1062 / 1235
File Coverage
File Stmts Branches Functions Lines Uncovered Lines
Changed Files
src/VehicleSelector/VehicleSelector.tsx 66.05% 90.38% 50% 66.05% 131-141, 169-212, 260-304
Unchanged Files
src/ActionDialog/ActionDialog.tsx 98.36% 66.66% 100% 98.36% 64
src/AlignHorizontal/AlignHorizontal.tsx 100% 100% 100% 100%
src/AlignVertical/AlignVertical.tsx 100% 100% 100% 100%
src/AppHeader/AppHeader.tsx 100% 71.42% 100% 100%
src/AppLauncher/AppLauncher.tsx 97.36% 76.92% 83.33% 97.36% 80-81, 91, 137
src/AppLayout/AppLayout.tsx 100% 100% 85.71% 100%
src/Autocomplete/Autocomplete.tsx 94.85% 82.5% 100% 94.85% 75-77, 79, 122, 178-183
src/Breadcrumbs/Breadcrumbs.tsx 98% 66.66% 100% 98% 31
src/BulletGauge/BulletGauge.tsx 0% 0% 0% 0% 1-85
src/BulletGauge/BulletGaugeClientOnly.tsx 0% 0% 0% 0% 1-19
src/Canvas/Canvas.jsx 93% 33.33% 0% 93% 49-51, 59-62
src/Canvas/Grid.jsx 100% 100% 100% 100%
src/Canvas/ResizeHandle.jsx 100% 100% 100% 100%
src/Canvas/SelectionRectangle.jsx 31.03% 100% 0% 31.03% 10-30
src/Canvas/useResize.jsx 37.14% 100% 25% 37.14% 18-26, 30-33, 37-45
src/Canvas/useSelectionRectangle.jsx 30.15% 50% 25% 30.15% 36-103
src/CanvasItem/CanvasItem.jsx 44.11% 100% 25% 44.11% 35-58, 71-104, 112-120
src/CanvasItem/Rect.jsx 38.12% 25% 40% 38.12% 37-102, 112-176, 184-232, 260-269
src/CanvasItem/ResizeHandle.jsx 10.97% 100% 0% 10.97% 10-89
src/CanvasItem/RotateHandle.jsx 12.76% 100% 0% 12.76% 9-51
src/CanvasItem/utils.jsx 21.03% 100% 9.09% 21.03% 16-20, 48-59, 69-80, 94-269, 318-322, 330-341
src/Card/DetailCard/DetailCard.tsx 0% 0% 0% 0% 1-179
src/Card/SummaryCard/SummaryCard.tsx 0% 0% 0% 0% 1-165
src/Card/TableCard/TableCard.tsx 0% 0% 0% 0% 1-75
src/CardContent/FileDetails/FileDetails.tsx 98.12% 100% 80% 98.12% 43-45
src/CardContent/Infographic/Infographic.tsx 0% 0% 0% 0% 1-116
src/Checkbox/Checkbox.jsx 100% 100% 50% 100%
src/ClientOnly/ClientOnly.tsx 0% 0% 0% 0% 1-17
src/Color/Color.jsx 97.67% 96.77% 90% 97.67% 68-69, 82-84
src/ConditionalDialog/ConditionalDialog.tsx 0% 0% 0% 0% 1-29
src/ConfirmProvider/ConfirmContext.tsx 100% 100% 100% 100%
src/ConfirmProvider/ConfirmProvider.tsx 97.16% 100% 100% 97.16% 93, 112-113
src/ConfirmProvider/ConfirmationDialog.tsx 98.86% 75% 100% 98.86% 78
src/ConfirmProvider/useConfirm.tsx 100% 100% 100% 100%
src/Copyright/Copyright.jsx 100% 100% 100% 100%
src/DateLabel/DateLabel.tsx 100% 100% 100% 100%
src/DeletableList/DeletableList.tsx 100% 100% 75% 100%
src/DialogTitle/DialogTitle.tsx 100% 100% 100% 100%
src/EditLabelDialog/EditLabelDialog.jsx 91.95% 100% 41.66% 91.95% 42-48, 127-138
src/FeedbackForm/FeedbackForm.jsx 98.63% 100% 91.66% 98.63% 67-71
src/Figure/Figure.tsx 0% 0% 0% 0% 1-46
src/Figure/FigureClientOnly.tsx 0% 0% 0% 0% 1-16
src/FileLabel/FileLabel.tsx 100% 100% 100% 100%
src/FileUploader/FileUploader.tsx 99.3% 92.3% 50% 99.3% 98
src/FileUploader/__data__/uploaderTestFiles.ts 100% 100% 100% 100%
src/Filter/sortFilterOptions.ts 82.75% 76.92% 100% 82.75% 13-14, 24-25, 45
src/Filter/sortLabelOptions.ts 82.75% 76.92% 100% 82.75% 15-16, 26-27, 47
src/Filter/CheckboxFilter/CheckboxFilter.tsx 95.77% 83.33% 100% 95.77% 75-77
src/Filter/ClearFilterButton/ClearFilterButton.tsx 100% 100% 100% 100%
src/Filter/LabelFilter/LabelFilter.tsx 94.31% 90% 80% 94.31% 84-89
src/Filter/RangeFilter/RangeFilter.jsx 100% 83.33% 100% 100%
src/Filter/SetFilterButton/SetFilterButton.tsx 100% 100% 100% 100%
src/Filter/SidebarFilter/SidebarFilter.tsx 100% 100% 75% 100%
src/FontPicker/FontPicker.jsx 93.62% 62.5% 66.66% 93.62% 160-166, 174, 206-210
src/FontStyle/FontStyle.jsx 100% 100% 50% 100%
src/FormatLabel/FormatLabel.tsx 100% 100% 100% 100%
src/FormatVersionLabel/FormatVersionLabel.tsx 100% 100% 100% 100%
src/IconWithLabel/IconWithLabel.tsx 100% 100% 100% 100%
src/ImageUploader/ImageUploader.tsx 99.18% 95.45% 100% 99.18% 85
src/ImageUploader/__data__/uploaderTestFiles.ts 100% 100% 100% 100%
src/LabelSelector/LabelSelector.jsx 98.09% 96.15% 77.77% 98.09% 135-139, 260-261
src/LabelSelector/DeleteLabelDialog/DeleteLabelDialog.jsx 89.36% 100% 40% 89.36% 23-29
src/LabelSelector/LabelChip/LabelChip.tsx 100% 100% 100% 100%
src/LabelSelector/LabelChipGroup/LabelChipGroup.tsx 30.87% 83.33% 20% 30.87% 52-79, 94-104, 121-173, 187-229
src/LabelSelector/LabelChipGroup/sortLabelChips.ts 100% 100% 100% 100%
src/LazyLoadImage/LazyLoadImage.tsx 0% 0% 0% 0% 1-97
src/LinePlot/LinePlot.tsx 0% 0% 0% 0% 1-188
src/LinePlot/LinePlotClientOnly.tsx 0% 0% 0% 0% 1-19
src/LinkWithPreview/LinkWithPreview.tsx 78.15% 100% 37.5% 78.15% 37-38, 43-46, 75-87, 91-102
src/LoadErrorMessage/LoadErrorMessage.tsx 0% 0% 0% 0% 1-167
src/Loading/Loading.jsx 96.55% 50% 100% 96.55% 29
src/LoginForm/LoginForm.jsx 100% 66.66% 50% 100%
src/ModelButton/ModelButton.tsx 96.78% 83.67% 75% 96.78% 119, 166, 168-169, 205, 218-219, 221-222, 246
src/ModelButtonImage/ModelButtonImage.tsx 100% 100% 100% 100%
src/ModelButtonImage/color2filter.ts 95.6% 100% 95.83% 95.6% 60-71
src/MultiColor/MultiColor.jsx 63.15% 80% 25% 63.15% 40, 52-59, 85-88, 92-93, 97-101, 105-109, 113-116, 150-183
src/MultiLabelPopover/MultiLabelPopover.jsx 97.56% 100% 66.66% 97.56% 22-23
src/MultiText/MultiText.jsx 95.55% 100% 71.42% 95.55% 74-77
src/NoWrapTypography/NoWrapTypography.tsx 100% 100% 100% 100%
src/NumberField/NumberField.tsx 96.46% 87.87% 100% 96.46% 112-115
src/PartSelector/PartSelector.tsx 0% 0% 0% 0% 1-103
src/PasswordChangeDialog/PasswordChangeDialog.jsx 95.29% 72.72% 100% 95.29% 100, 138-140, 143-145, 244
src/PasswordChangeForm/PasswordChangeForm.jsx 100% 84.61% 100% 100%
src/PasswordResetForm/PasswordResetForm.jsx 100% 66.66% 100% 100%
src/PrototypePreview/PrototypePreview.tsx 99.42% 71.42% 100% 99.42% 150
src/RadioButtons/RadioButtons.jsx 100% 100% 50% 100%
src/RegistrationForm/RegistrationForm.jsx 100% 76.47% 100% 100%
src/RoadLabel/RoadLabel.tsx 100% 100% 100% 100%
src/RoadMarking/RoadMarking.tsx 0% 0% 0% 0% 1-50
src/RoadMarking/RoadMarkingClientOnly.tsx 0% 0% 0% 0% 1-16
src/RoadPreview/RoadPreview.tsx 100% 83.33% 100% 100%
src/RoadSurface/RoadSurface.tsx 0% 0% 0% 0% 1-20
src/RoadSurface/RoadSurfaceClientOnly.tsx 0% 0% 0% 0% 1-16
src/ScenarioPreview/ScenarioPreview.tsx 95.75% 66.66% 100% 95.75% 33-36, 180-182
src/SearchBar/SearchBar.tsx 100% 100% 100% 100%
src/Select/Select.jsx 100% 100% 50% 100%
src/SelectorButton/SelectorButton.tsx 100% 100% 100% 100%
src/Sidebar/Sidebar.tsx 100% 87.5% 100% 100%
src/Sidebar/SidebarDivider/SidebarDivider.tsx 100% 100% 100% 100%
src/Sidebar/SidebarItem/SidebarItem.tsx 70.07% 80.95% 66.66% 70.07% 63, 101-136, 149-152
src/Slider/Slider.jsx 92.5% 36.84% 60% 92.5% 55-56, 65-69, 95, 99
src/Snackbar/Snackbar.tsx 100% 90% 85.71% 100%
src/SnackbarProvider/SnackbarContext.tsx 100% 100% 100% 100%
src/SnackbarProvider/SnackbarProvider.tsx 60.46% 100% 50% 60.46% 32-35, 42-55
src/SnackbarProvider/useSnackbar.ts 22.22% 100% 0% 22.22% 7-13
src/Status/statuses.ts 100% 100% 100% 100%
src/Status/StatusCard/StatusCard.tsx 100% 100% 100% 100%
src/Status/StatusCountBar/StatusCountBar.tsx 93.61% 80% 66.66% 93.61% 58-60
src/Status/StatusCountTable/StatusCountTable.tsx 100% 100% 100% 100%
src/Status/StatusIcon/StatusIcon.tsx 100% 100% 100% 100%
src/Status/StatusLabel/StatusLabel.tsx 100% 100% 100% 100%
src/SurfacePlot/SurfacePlot.tsx 0% 0% 0% 0% 1-156
src/SurfacePlot/SurfacePlotClientOnly.tsx 0% 0% 0% 0% 1-19
src/SvgIcons/AsamLogo/AsamLogo.tsx 100% 100% 100% 100%
src/SvgIcons/CarMakerLogo/CarMakerLogo.tsx 100% 100% 100% 100%
src/SvgIcons/IpgLogo/IpgLogo.tsx 100% 100% 100% 100%
src/SvgIcons/RoadOutlined/RoadOutlined.tsx 100% 100% 100% 100%
src/SvgIcons/TruckMakerLogo/TruckMakerLogo.tsx 100% 100% 100% 100%
src/SvgIcons/VirtoBuild/VirtoBuild.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoData/VirtoData.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoFleet/VirtoFleet.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoID/VirtoID.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoLogo/VirtoLogo.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoMascots/VirtoHeadScratching/VirtoHeadScratching.tsx 11.11% 100% 0% 11.11% 6-32
src/SvgIcons/VirtoMascots/VirtoShrugging/VirtoShrugging.tsx 11.11% 100% 0% 11.11% 6-32
src/SvgIcons/VirtoMascots/VirtoThinking/VirtoThinking.tsx 11.11% 100% 0% 11.11% 6-32
src/SvgIcons/VirtoMascots/VirtoThumbsUpLeft/VirtoThumbsUpLeft.tsx 11.11% 100% 0% 11.11% 6-32
src/SvgIcons/VirtoModel/VirtoModel.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoResult/VirtoResult.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoScene/VirtoScene.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoTest/VirtoTest.jsx 100% 100% 100% 100%
src/SvgIcons/VirtoVehicle/VirtoVehicle.jsx 100% 100% 100% 100%
src/SwitchField/SwitchField.jsx 93.84% 90.9% 100% 93.84% 112-115
src/TabPanel/TabPanel.tsx 0% 0% 0% 0% 1-121
src/TextField/TextField.tsx 89.47% 100% 66.66% 89.47% 8-13
src/ThemeProvider/ThemeContext.tsx 100% 100% 100% 100%
src/ThemeProvider/ThemeProvider.tsx 98.68% 93.75% 66.66% 98.68% 102, 189-190
src/ThemeProvider/useTheme.ts 77.77% 50% 100% 77.77% 10-11
src/ToggleColorMode/ToggleColorMode.jsx 100% 100% 100% 100%
src/TrafficLight/TrafficLight.tsx 0% 0% 0% 0% 1-107
src/TrafficLight/TrafficLightClientOnly.tsx 0% 0% 0% 0% 1-16
src/TrafficLight/TrafficLightSelector.tsx 0% 0% 0% 0% 1-780
src/TrafficLight/trafficLightUtils.ts 0% 100% 100% 0% 2-40
src/TrafficSign/TrafficSign.tsx 0% 0% 0% 0% 1-33
src/TrafficSign/TrafficSignClientOnly.tsx 0% 0% 0% 0% 1-16
src/TrafficSign/TrafficSignHelper.ts 0% 0% 0% 0% 1-333
src/TransferList/TransferList.tsx 100% 100% 100% 100%
src/TreeViewList/TreeViewList.tsx 0% 0% 0% 0% 1-513
src/TruncatedTooltip/TruncatedTooltip.tsx 91.76% 64.7% 75% 91.76% 61-62, 64-65, 83-84, 86
src/Uploader/UploaderHeader.tsx 87.69% 83.33% 100% 87.69% 30-33, 35-38
src/Uploader/useUploader.ts 89.74% 79.16% 100% 89.74% 39-41, 58, 63-67, 103, 181-182
src/UserAvatar/UserAvatar.tsx 100% 90.9% 100% 100%
src/UserAvatar/colorMap.tsx 100% 100% 100% 100%
src/UserLabel/UserLabel.tsx 100% 100% 100% 100%
src/UserMenu/UserMenu.tsx 100% 100% 100% 100%
src/VehiclePath/Marker.tsx 0% 0% 0% 0% 1-15
src/VehiclePath/Vehicle.tsx 0% 0% 0% 0% 1-59
src/VehiclePath/VehiclePath.tsx 0% 0% 0% 0% 1-55
src/VehiclePath/VehiclePathClientOnly.tsx 0% 0% 0% 0% 1-16
src/VehicleSelect/VehicleSelect.tsx 52.79% 88.46% 28.57% 52.79% 86-96, 108-118, 131-175, 188-218
src/VehicleSelectDialog/VehicleSelectDialog.tsx 87% 71.42% 40% 87% 40-47, 51-54, 93
src/VersionChip/VersionChip.tsx 88.7% 70% 100% 88.7% 12, 46, 50, 77-80
src/VersionLabel/VersionLabel.tsx 100% 100% 100% 100%
src/ViewToggleButton/ViewToggleButton.jsx 100% 100% 66.66% 100%
src/VirtoAppHeader/VirtoAppHeader.tsx 100% 85.71% 78.57% 100%
src/VirtoAppLayout/VirtoAppLayout.tsx 100% 100% 60% 100%
src/Wizard/Wizard.tsx 100% 100% 100% 100%
src/Wizard/WizardActions/WizardActions.tsx 100% 100% 100% 100%
src/Wizard/WizardActions/BackButton/BackButton.tsx 100% 100% 100% 100%
src/Wizard/WizardActions/CancelButton/CancelButton.tsx 100% 100% 100% 100%
src/Wizard/WizardActions/NextButton/NextButton.tsx 100% 100% 100% 100%
src/Wizard/WizardContent/WizardContent.tsx 100% 100% 100% 100%
src/Wizard/WizardSteps/WizardSteps.tsx 100% 75% 100% 100%
src/Wizard/WizardSteps/WizardStep/WizardStep.tsx 92.15% 71.42% 100% 92.15% 49-52
src/hover/useDelayedHover.ts 60% 100% 100% 60% 26-40, 50-54
src/utils/common.ts 100% 83.33% 100% 100%
src/utils/form.jsx 100% 100% 100% 100%
src/utils/plotlyConfig.ts 0% 100% 100% 0% 2-34
src/utils/readAsDataURL.ts 80% 100% 66.66% 80% 20-22
Generated in workflow #3307 for commit 34bd361 by the Vitest Coverage Report Action

@AronPetrauskas AronPetrauskas self-requested a review January 29, 2025 15:31
@@ -223,7 +223,10 @@ function VehicleSelector({
}
}}
size={size}
value={selectedVariants}
// if array is empty set to null to avoid rendereing the clear button
Copy link
Contributor

Choose a reason for hiding this comment

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

spelling and punctuation suggestion

Suggested change
// if array is empty set to null to avoid rendereing the clear button
// if array is empty, set value to null to avoid rendering the clear button

Copy link
Contributor

@AronPetrauskas AronPetrauskas left a comment

Choose a reason for hiding this comment

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

A nit picky comment suggestion to fix a comment. Other than that the functionality is good.

I think you'll need to write some more tests to increase the line coverage of Vehicle Selector. I have received this comment from Matt on a virto-utils PR of mine. I assume the same logic applies to RUI

Copy link
Contributor

@AronPetrauskas AronPetrauskas left a comment

Choose a reason for hiding this comment

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

LGTM!

@stevenmcsorleyipg stevenmcsorleyipg changed the base branch from main to release/10.4.1 January 30, 2025 14:16
@stevenmcsorleyipg stevenmcsorleyipg merged commit b81aa2d into release/10.4.1 Jan 30, 2025
3 checks passed
@stevenmcsorleyipg stevenmcsorleyipg deleted the TD-3355/Clear-Button-Remains-Visible-in-Variant-Autocomplete-After-Clearing-Selection-RUI branch January 30, 2025 14:16
@lukemojo lukemojo mentioned this pull request Jan 31, 2025
lukemojo added a commit that referenced this pull request Jan 31, 2025
* bug/TD-3284 nowrap typography truncation ellipsis color issue

* updated request changes by approaching computed style

* Upadted TruncatedTooltip.tsx

* Updated changes requested

* updated comment line for adjacent code

* Update stories to show how to correctly use Link with this component

* Undo change of sx order

* Deleted NoWrapTypography

* Replaced NoWrapTypography with TruncatedTooltip

* Update LabeSelector.jsx

* Replace NoWrapTypography with TruncatedTooltip

* updated changes requested

* Updated changes requested

* Restore NoWrapTypography

* Undo change to grid import

* TD-3355 - Fixes Clear button on Variant select when deselecting (#1033)

* Fixes Clear button on Variant select when deselecting

* Add test to test clear button

* Bumped the test coverage for this file up slightly

* TD-3284 Truncated Tooltip (#1034)

* Manually bring in all changes from #1032

* 10.4.1-1

* 10.4.1-2

---------

Co-authored-by: ShushN <sushmitha.a@ipg-automotive.com>
Co-authored-by: Matthew Corner <matt.corner@ipg-automotive.com>
Co-authored-by: stevenmcsorleyipg <steven.mcsorley@ipg-automotive.uk>
@stevenmcsorleyipg stevenmcsorleyipg restored the TD-3355/Clear-Button-Remains-Visible-in-Variant-Autocomplete-After-Clearing-Selection-RUI branch February 3, 2025 17:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants