-
Notifications
You must be signed in to change notification settings - Fork 78
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(table): add column for DnD in the filter/manage columns headers #3782
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
When drag and drop is enabled, rows get an extra leading column for the drag and drop handle. The base header gets and extra blank column to line up right. The Filter and Manage Columns headers were missing that extra column, so are one column less than the table body when dtag and drop was enabled, causing them to line up wrong. This just adds that DnD blank column to those header rows as well.
✅ Deploy Preview for carbon-addons-iot-react ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
gillibrand
changed the title
Table dnd headers
fix(table): add column for DnD in the filter/manage columns headers
May 17, 2023
sls-ca
approved these changes
May 17, 2023
sls-ca
added a commit
that referenced
this pull request
Oct 11, 2023
* fix(testappyml): fetch from next * v2.152.4-next.1 * fix(tablecard): update images * fix(datetimepickerv2): show no tooltip when closed inline * fix(header): handle server-side rendering #3742 * v2.152.6-next.0 * fix(walkme): Defining the required Walkme global variable and function in a useEffect hook because they were not being set inside the script tag for some reason. * fix(walkme): Running yarn format * test(walkme): Adding some tests to make sure the global walkme_get_language() function was set. * v2.152.6-next.1 * fix(proptypes): adding defaultDateFormatPattern to the PropType * v2.153.0-next.0 * revert: revert the defaultDateFormatPattern to old format * revert(barchartutils): reverting the tooltipDateFormatPattern format * docs(tablecard): updating the tablecard docs to have different defaultDateFormatPattern * fix(tablecardutils): formatting the file * fix(idlelogoutconfirmationmodal): Assembling the `originHref` with the current url excluding the query parameters to fix an issue where query parameters may be added to the page without a page reload, which would cause the `useEffect` to restart because it has the logout and inactivityLogout URLs as dependencies. * v2.153.0-next.1 * test(suiteheader): Fixing some unit tests. * v2.153.0-next.2 * fix(suiteheader): Adding a null check in `surveyData` to avoid runtime errors if `surveyData` becomes null after in subsequent component re-renders * fix(sidepanel): add tabindex and aria-hidden * fix(sidepanel): add tabindex and aria-hidden * feat(breadcrumb): add option to disable truncation * test(breadcrumb): add e2e tests * test(breadcrumb): update snapshots * chore(breadcrumb): add story with truncation #3700 * test(breadcrumb): update e2e test * feat(barchartcard): add maximum data points input field * test(barchartcard): add test for maximum data points field * chore(cardeditor): update storybook * chore(cardeditor): update snapshots * chore(table): refactor pin column mixin * chore(table): update snapshot * chore(mixin): run prettier * chore(table): remove additional classes for pin column in tbody * feat(table): initial table drag and drop #3751 Initial drag and drop support for the table. Allows rows to be dragged over other rows. Only supports dragging a single row currently (the selection set is ignored). * feat(table): add multi row dragging If the dragged row is in the selected rows, then drag all selected rows. Hide all drag handles if any selected rows are undraggable. * feat(table): add option to pin header and footer #3696 * docs(table): update docs for pinned header and footer * chore(table): add story with pinned header and footer * test(table): add e2e test for pinned header and footer * chore(publicapi): update snapshot * test(table): update snapshots * test(table): update flaky snapshots * feat(table): add table drag and drop tests * v2.153.0-next.3 * feat(table): align row overlay in rtl * feat(table): DnD can fail on macOS activeDropRowIdRef.current was null if accessed after a state change. * feat(table): correct hook return value docs * feat(table): fix position of avatar, row overlay in rtl * feat(table): safari misses drop sometimes Safari can fire mousemove events with buttons:e before it fires the mouse up event. Need to delay that last mousemove to given mouseup a chance to fire first, otherwise the drop would be canceled. Happens if moving the mouse fast will dropping, which is easy to do. Also found a test case that failed sometimes because a mouseup was missing in it, so it was in an invalid state for the next step. * feat(table): handle event order problems on macOS If the mouse goes outside the window and releases the button then the mouseup is missed and the drag is stuck. If we see a few moves without a mouse button down then that's probably the case. We don't do this on the first bad move since Safari and Firefox on macOS can fire a mousemove without buttons BEFORE a mouse up sometimes, which would cancel the drop too early. Waiting a few moves proves this really is stuck, not just an unexpected event order. * fix(headeraction): close panel on other action click #3755 * test(suiteheader): header action panel click * fix(sidepanel): add tabindex for content elements * fix(sidepanel): update snapshots * feat(table): drag and drop with expandable rows Drag and drop assumed all rows were in the top level `data` array. Now all child rows are consulted too. This required moving some logic into the row components. Some CSS changes were needed to overcome the styles on expandable rows. * feat(cardtoolbar): add max width to extra action overflow menu #3733 * test(card): add test for extra action overflow menu * chore(card): update storybook knobs * chore(breadcrumb): update storybook know for truncation * fix(datetimepickerv2): add onClear callback * feat(table): hide row expando when no children After a drag and drop, if a row has not children the expando icon would still show. The class to hide it was only applied to closed rows, but a row is open after dragging its last child. Add the class to hide it in that case so it disappears as soon as there are no children. * feat(table): review fixes 1 - In StatefulTable use `callbackParent` for consistency and to protect against calling a null callback (not really a concern here, but doesn't hurt). - Use the ${prefix} sass var instead of `bx`. - Remove `td` element name from selector where not needed. * feat(table): correct docs about dragging multiple rows * fix(headeraction): close panel on click outside * test(suiteheader): add test for click outside * feat(table): support z-index on table for DnD, Graphite Add a `zIndex` prop on the `Table`. This is needed if the caller places the `Table` in a modal dialog or similar with z-index > 0 and enables row drag and drop. The drag image needs to know the min z-index it can use to be drawn "over" the table. * feat(table): improve drag and drop performance When dragging, so make any React state updates, since that will rerender the whole table, which is slow once there are enough rows. Instead, just update the dom element styles (the avatar position and the "onDrop" row) directly. * fix(header): add tooltip to action menus #3763 * test(headeraction): update tests for tooltips * test(header): update snapshots * test(header): flaky snapshots * fix(header): decrease border width for menu button focus * chore(breadcrumb): add truncation login to css * test(breadcrumb): update snapshots * chore(header): remove onkeydown event for action menu * test(header): update unit test * test(header): update snapshots * Update codeowner * fix(filterheaderrow): display filter icon without input * test(filterheaderrow): test filter icon without input * fix(datetimepickerv2): new error message * fix(datetimepickerv2): update snashots * v2.153.0-next.4 * test(table): update snapshots * test(table): update snapshot * test(table): update snapshots * test(table): update snapshot * chore(table): run linters * chore(table): update snapshot * chore(table): update snapshots * chore(table): update snapshots * v2.153.0-next.5 * chore(tablebody): rename classnames import * v2.153.0-next.6 * chore(tablebody): add conditional props for className * test(table): update snapshots * chore(table): update snapshots * test(table): update snapshots * test(table): update snapshots * test(table): update snapshots * v2.153.0-next.7 * test(table): update snapshots * test(table): update snapshots * v2.153.0-next.8 * v2.153.0-next.9 * test(table): update snapshots * test(table): update snapshots * fix(headeraction): handle click outside safari * test(suiteheader): add tests for header menu * fix(breadcrumb): add min width to item * chore(repo): trigger github actions * v2.153.0-next.10 * v2.153.0-next.11 * v2.153.0-next.12 * docs(table): update pinColumn prop * chore(table): update snapshots * chore(suiteheader): removed unnecessary test * fix(datetimepickerv2): make sure locale is 2 letters * fix(table): scrollbar shows when drag and drop starts * fix(table): scrollbar shows when drag and drop starts * fix(datetimepickerv2): update tests * v2.153.0-next.13 * fix(datetimepickerv2): make sure changes only apply to single select * fix(datetimepickerv2): update tests * fix(datetimepickerv2): fix typos * v2.153.0-next.14 * v2.153.0-next.15 * v2.153.0-next.16 * fix(datetimepickerv2): update placeholder text (#3778) * v2.153.0-next.17 * Update SECURITY.md * chore(codeowners): add amritha as codeowners for this piece (#3779) * feat(table): update batch cancel button label (#3780) * feat(table): change batch cancel button label #3737 * test(pagetitlebar): update tests * test(table): update snapshots * test(pagetitlebar): revert test updates * test(table): update cypress snapshot * test(pagetitlebar): update e2e test * v2.153.0-next.18 * fix(table): add column for DnD in the filter/manage columns headers (#3782) * fix(table): add column for DnD in the filter/manage columns headers When drag and drop is enabled, rows get an extra leading column for the drag and drop handle. The base header gets and extra blank column to line up right. The Filter and Manage Columns headers were missing that extra column, so are one column less than the table body when dtag and drop was enabled, causing them to line up wrong. This just adds that DnD blank column to those header rows as well. * fix(table): update header tests for DnD * v2.153.0-next.19 * fix: allowing description outside tooltip when content is provided * feat: added desc tooltip to current breadcrumb item for condensed header * chore: page title bar tests * chore: snapshots updated * chore: page title bar e2e tests updated * fix(datetimepickerv2): auto position inf loop (#3786) * v2.153.0-next.20 * fix: removing record flag * fix: adding record false flag * chore: reverting changes in page title bar e2e tests * v2.153.0-next.21 * fix(suiteheader): app switcher icon title (#3788) * fix(suiteheader): disable browser native tooltip * chore(suiteheader): update app switcher tooltip label * test(suiteheader): update snapshots * test(publicapi): update snapshot * v2.153.0-next.22 * feat(repo): allow node 18 for consumers (#3792) * feat(repo): allow node 18 for consumers * chore(repo): setup node v16 for development * v2.153.0-next.23 * fix(table): remove unnecessary space (#3797) * v2.153.0-next.24 * fix(datetimeinput): accessibility violation in date time input (#3802) #3800 * v2.153.0-next.25 * fix(table): select all checkbox state on initial render (#3801) * fix(table): select all checkbox state on initial render * test(table): select all checkbox state on initial render * fix(tablecellrenderer): add min width for truncation (#3799) * fix(tablecellrenderer): add min width for truncation * chore(table): update cypress image snapshot * feat(SuiteHeader): add unique id to action items (#3796) * feat(suiteheader): add id to action items * test(suiteheader): add test fir unique id for action items * test(suiteheader): update snapshots * feat(SuiteHeader): add support for on click callback for application name (#3795) * feat(suiteheader): add onClick callback for application name * docs(suiteheader): update docs * test(suiteheader): add unit test for onClick callback * test(suiteheader): update snapshots * chore(suiteheader): add storybook example * test(suiteheader): update snapshots * v2.153.0-next.26 * feat(table) simple pagination (#3805) * feat(table): display simple pagination if items exceed maxPages * test(table): update pagination tests * docs(table): update pagination docs * chore(header): update snapshots * chore(table): change simple pagination render condition * v2.153.0-next.27 * 3804 suite header and header action fix accessibility scan violations (#3807) * fix(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suitheader and headeraction): fix accessibility scan violations #3804 * Update PageTitleBar.test.e2e.jsx * fix(SuiteHeader): header action panel proptypes (#3803) * fix(suiteheader): proptypes for header action panel * test(suiteheader): update snapshot * v2.153.0-next.28 * fix(table): connect pagination to totalItems prop * test(table): update pagination tests * v2.153.0-next.29 * fix(table): change filter tag close button title * fix(headeractionpanel): remove unnecessary aria-label * fix(headeractionpanel): update tests * fix(appswitcher): firefox disable focus * fix(appswitcher): update snapshots * fix(headeractionpanel): update e2e tests * v2.153.0-next.30 * feat(SuiteHeader): add option to hide menu (#3815) * feat(suiteheader): add prop to hide menu button * test(suiteheader): add test to hide menu button * docs(suiteheader): update props info * chore(suiteheader): update storybook * fix(table): add min width for pinned last column (#3816) * v2.153.0-next.31 * feat(ValueCard): disable preview in edit mode (#3818) * feat(valuecard): disable preview in edit mode * test(valuecard): update unit test * chore(valuecard): update isEditing story * chore(valuecard): update snapshots * v2.153.0-next.32 * fix: dashboard layout constant fix (#3821) * v2.153.0-next.33 * fix(IdleTimer): Preventing the IdleTimer logic to start its timer if timeout is 0. (#3825) * fix(IdleTimer): Preventing the IdleTimer logic to start its timer if timeout is 0. * test(IdleTimer): Adding a unit tests to make sure that IdleTimer does not start a timer when timeout is zero. --------- Co-authored-by: Marcelo Blechner <> * v2.153.0-next.34 * feat: close header side nav on navigation (#3826) * v2.153.0-next.35 --------- Co-authored-by: vaffonso <vaffonso@br.ibm.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: carbon-bot <carbon@us.ibm.com> Co-authored-by: XUE YAN <xyan@us.ibm.com> Co-authored-by: David Conner <rdconner@us.ibm.com> Co-authored-by: balint.lendvai <balint.lendvai@ibm.com> Co-authored-by: Amritha raj herle <herleraja@gmail.com> Co-authored-by: Marcelo Blechner <> Co-authored-by: Amritha raj herle <Amritha.Herle@ibm.com> Co-authored-by: Balint Lendvai <lendvai.balint@gmail.com> Co-authored-by: Erzhan-Temir Mamyrov <Erzhan-Temir.Mamyrov@ibm.com> Co-authored-by: Jay Gillibrand <jay.gillibrand@gmail.com> Co-authored-by: jessieyan <jessie.x.yan@gmail.com> Co-authored-by: Jessie Yan <jessieyan@jessies-mbp.lan> Co-authored-by: Taylor Jones <tay1orjones@users.noreply.github.com> Co-authored-by: Erzhan-Temir Mamyrov <112560065+erzhan-temir-mamyrov@users.noreply.github.com> Co-authored-by: Hector Davis <hectord@br.ibm.com> Co-authored-by: abpaul1993 <136786799+abpaul1993@users.noreply.github.com> Co-authored-by: Kalyani Raut <kalraut2@in.ibm.com> Co-authored-by: blechner <marceloblechner@gmail.com>
sls-ca
added a commit
that referenced
this pull request
Oct 11, 2023
* Mas8.11 release (#3828) * fix(testappyml): fetch from next * v2.152.4-next.1 * fix(tablecard): update images * fix(datetimepickerv2): show no tooltip when closed inline * fix(header): handle server-side rendering #3742 * v2.152.6-next.0 * fix(walkme): Defining the required Walkme global variable and function in a useEffect hook because they were not being set inside the script tag for some reason. * fix(walkme): Running yarn format * test(walkme): Adding some tests to make sure the global walkme_get_language() function was set. * v2.152.6-next.1 * fix(proptypes): adding defaultDateFormatPattern to the PropType * v2.153.0-next.0 * revert: revert the defaultDateFormatPattern to old format * revert(barchartutils): reverting the tooltipDateFormatPattern format * docs(tablecard): updating the tablecard docs to have different defaultDateFormatPattern * fix(tablecardutils): formatting the file * fix(idlelogoutconfirmationmodal): Assembling the `originHref` with the current url excluding the query parameters to fix an issue where query parameters may be added to the page without a page reload, which would cause the `useEffect` to restart because it has the logout and inactivityLogout URLs as dependencies. * v2.153.0-next.1 * test(suiteheader): Fixing some unit tests. * v2.153.0-next.2 * fix(suiteheader): Adding a null check in `surveyData` to avoid runtime errors if `surveyData` becomes null after in subsequent component re-renders * fix(sidepanel): add tabindex and aria-hidden * fix(sidepanel): add tabindex and aria-hidden * feat(breadcrumb): add option to disable truncation * test(breadcrumb): add e2e tests * test(breadcrumb): update snapshots * chore(breadcrumb): add story with truncation #3700 * test(breadcrumb): update e2e test * feat(barchartcard): add maximum data points input field * test(barchartcard): add test for maximum data points field * chore(cardeditor): update storybook * chore(cardeditor): update snapshots * chore(table): refactor pin column mixin * chore(table): update snapshot * chore(mixin): run prettier * chore(table): remove additional classes for pin column in tbody * feat(table): initial table drag and drop #3751 Initial drag and drop support for the table. Allows rows to be dragged over other rows. Only supports dragging a single row currently (the selection set is ignored). * feat(table): add multi row dragging If the dragged row is in the selected rows, then drag all selected rows. Hide all drag handles if any selected rows are undraggable. * feat(table): add option to pin header and footer #3696 * docs(table): update docs for pinned header and footer * chore(table): add story with pinned header and footer * test(table): add e2e test for pinned header and footer * chore(publicapi): update snapshot * test(table): update snapshots * test(table): update flaky snapshots * feat(table): add table drag and drop tests * v2.153.0-next.3 * feat(table): align row overlay in rtl * feat(table): DnD can fail on macOS activeDropRowIdRef.current was null if accessed after a state change. * feat(table): correct hook return value docs * feat(table): fix position of avatar, row overlay in rtl * feat(table): safari misses drop sometimes Safari can fire mousemove events with buttons:e before it fires the mouse up event. Need to delay that last mousemove to given mouseup a chance to fire first, otherwise the drop would be canceled. Happens if moving the mouse fast will dropping, which is easy to do. Also found a test case that failed sometimes because a mouseup was missing in it, so it was in an invalid state for the next step. * feat(table): handle event order problems on macOS If the mouse goes outside the window and releases the button then the mouseup is missed and the drag is stuck. If we see a few moves without a mouse button down then that's probably the case. We don't do this on the first bad move since Safari and Firefox on macOS can fire a mousemove without buttons BEFORE a mouse up sometimes, which would cancel the drop too early. Waiting a few moves proves this really is stuck, not just an unexpected event order. * fix(headeraction): close panel on other action click #3755 * test(suiteheader): header action panel click * fix(sidepanel): add tabindex for content elements * fix(sidepanel): update snapshots * feat(table): drag and drop with expandable rows Drag and drop assumed all rows were in the top level `data` array. Now all child rows are consulted too. This required moving some logic into the row components. Some CSS changes were needed to overcome the styles on expandable rows. * feat(cardtoolbar): add max width to extra action overflow menu #3733 * test(card): add test for extra action overflow menu * chore(card): update storybook knobs * chore(breadcrumb): update storybook know for truncation * fix(datetimepickerv2): add onClear callback * feat(table): hide row expando when no children After a drag and drop, if a row has not children the expando icon would still show. The class to hide it was only applied to closed rows, but a row is open after dragging its last child. Add the class to hide it in that case so it disappears as soon as there are no children. * feat(table): review fixes 1 - In StatefulTable use `callbackParent` for consistency and to protect against calling a null callback (not really a concern here, but doesn't hurt). - Use the ${prefix} sass var instead of `bx`. - Remove `td` element name from selector where not needed. * feat(table): correct docs about dragging multiple rows * fix(headeraction): close panel on click outside * test(suiteheader): add test for click outside * feat(table): support z-index on table for DnD, Graphite Add a `zIndex` prop on the `Table`. This is needed if the caller places the `Table` in a modal dialog or similar with z-index > 0 and enables row drag and drop. The drag image needs to know the min z-index it can use to be drawn "over" the table. * feat(table): improve drag and drop performance When dragging, so make any React state updates, since that will rerender the whole table, which is slow once there are enough rows. Instead, just update the dom element styles (the avatar position and the "onDrop" row) directly. * fix(header): add tooltip to action menus #3763 * test(headeraction): update tests for tooltips * test(header): update snapshots * test(header): flaky snapshots * fix(header): decrease border width for menu button focus * chore(breadcrumb): add truncation login to css * test(breadcrumb): update snapshots * chore(header): remove onkeydown event for action menu * test(header): update unit test * test(header): update snapshots * Update codeowner * fix(filterheaderrow): display filter icon without input * test(filterheaderrow): test filter icon without input * fix(datetimepickerv2): new error message * fix(datetimepickerv2): update snashots * v2.153.0-next.4 * test(table): update snapshots * test(table): update snapshot * test(table): update snapshots * test(table): update snapshot * chore(table): run linters * chore(table): update snapshot * chore(table): update snapshots * chore(table): update snapshots * v2.153.0-next.5 * chore(tablebody): rename classnames import * v2.153.0-next.6 * chore(tablebody): add conditional props for className * test(table): update snapshots * chore(table): update snapshots * test(table): update snapshots * test(table): update snapshots * test(table): update snapshots * v2.153.0-next.7 * test(table): update snapshots * test(table): update snapshots * v2.153.0-next.8 * v2.153.0-next.9 * test(table): update snapshots * test(table): update snapshots * fix(headeraction): handle click outside safari * test(suiteheader): add tests for header menu * fix(breadcrumb): add min width to item * chore(repo): trigger github actions * v2.153.0-next.10 * v2.153.0-next.11 * v2.153.0-next.12 * docs(table): update pinColumn prop * chore(table): update snapshots * chore(suiteheader): removed unnecessary test * fix(datetimepickerv2): make sure locale is 2 letters * fix(table): scrollbar shows when drag and drop starts * fix(table): scrollbar shows when drag and drop starts * fix(datetimepickerv2): update tests * v2.153.0-next.13 * fix(datetimepickerv2): make sure changes only apply to single select * fix(datetimepickerv2): update tests * fix(datetimepickerv2): fix typos * v2.153.0-next.14 * v2.153.0-next.15 * v2.153.0-next.16 * fix(datetimepickerv2): update placeholder text (#3778) * v2.153.0-next.17 * Update SECURITY.md * chore(codeowners): add amritha as codeowners for this piece (#3779) * feat(table): update batch cancel button label (#3780) * feat(table): change batch cancel button label #3737 * test(pagetitlebar): update tests * test(table): update snapshots * test(pagetitlebar): revert test updates * test(table): update cypress snapshot * test(pagetitlebar): update e2e test * v2.153.0-next.18 * fix(table): add column for DnD in the filter/manage columns headers (#3782) * fix(table): add column for DnD in the filter/manage columns headers When drag and drop is enabled, rows get an extra leading column for the drag and drop handle. The base header gets and extra blank column to line up right. The Filter and Manage Columns headers were missing that extra column, so are one column less than the table body when dtag and drop was enabled, causing them to line up wrong. This just adds that DnD blank column to those header rows as well. * fix(table): update header tests for DnD * v2.153.0-next.19 * fix: allowing description outside tooltip when content is provided * feat: added desc tooltip to current breadcrumb item for condensed header * chore: page title bar tests * chore: snapshots updated * chore: page title bar e2e tests updated * fix(datetimepickerv2): auto position inf loop (#3786) * v2.153.0-next.20 * fix: removing record flag * fix: adding record false flag * chore: reverting changes in page title bar e2e tests * v2.153.0-next.21 * fix(suiteheader): app switcher icon title (#3788) * fix(suiteheader): disable browser native tooltip * chore(suiteheader): update app switcher tooltip label * test(suiteheader): update snapshots * test(publicapi): update snapshot * v2.153.0-next.22 * feat(repo): allow node 18 for consumers (#3792) * feat(repo): allow node 18 for consumers * chore(repo): setup node v16 for development * v2.153.0-next.23 * fix(table): remove unnecessary space (#3797) * v2.153.0-next.24 * fix(datetimeinput): accessibility violation in date time input (#3802) #3800 * v2.153.0-next.25 * fix(table): select all checkbox state on initial render (#3801) * fix(table): select all checkbox state on initial render * test(table): select all checkbox state on initial render * fix(tablecellrenderer): add min width for truncation (#3799) * fix(tablecellrenderer): add min width for truncation * chore(table): update cypress image snapshot * feat(SuiteHeader): add unique id to action items (#3796) * feat(suiteheader): add id to action items * test(suiteheader): add test fir unique id for action items * test(suiteheader): update snapshots * feat(SuiteHeader): add support for on click callback for application name (#3795) * feat(suiteheader): add onClick callback for application name * docs(suiteheader): update docs * test(suiteheader): add unit test for onClick callback * test(suiteheader): update snapshots * chore(suiteheader): add storybook example * test(suiteheader): update snapshots * v2.153.0-next.26 * feat(table) simple pagination (#3805) * feat(table): display simple pagination if items exceed maxPages * test(table): update pagination tests * docs(table): update pagination docs * chore(header): update snapshots * chore(table): change simple pagination render condition * v2.153.0-next.27 * 3804 suite header and header action fix accessibility scan violations (#3807) * fix(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suiteheader and headeraction): fix accessibility scan violations #3804 * chore(suitheader and headeraction): fix accessibility scan violations #3804 * Update PageTitleBar.test.e2e.jsx * fix(SuiteHeader): header action panel proptypes (#3803) * fix(suiteheader): proptypes for header action panel * test(suiteheader): update snapshot * v2.153.0-next.28 * fix(table): connect pagination to totalItems prop * test(table): update pagination tests * v2.153.0-next.29 * fix(table): change filter tag close button title * fix(headeractionpanel): remove unnecessary aria-label * fix(headeractionpanel): update tests * fix(appswitcher): firefox disable focus * fix(appswitcher): update snapshots * fix(headeractionpanel): update e2e tests * v2.153.0-next.30 * feat(SuiteHeader): add option to hide menu (#3815) * feat(suiteheader): add prop to hide menu button * test(suiteheader): add test to hide menu button * docs(suiteheader): update props info * chore(suiteheader): update storybook * fix(table): add min width for pinned last column (#3816) * v2.153.0-next.31 * feat(ValueCard): disable preview in edit mode (#3818) * feat(valuecard): disable preview in edit mode * test(valuecard): update unit test * chore(valuecard): update isEditing story * chore(valuecard): update snapshots * v2.153.0-next.32 * fix: dashboard layout constant fix (#3821) * v2.153.0-next.33 * fix(IdleTimer): Preventing the IdleTimer logic to start its timer if timeout is 0. (#3825) * fix(IdleTimer): Preventing the IdleTimer logic to start its timer if timeout is 0. * test(IdleTimer): Adding a unit tests to make sure that IdleTimer does not start a timer when timeout is zero. --------- Co-authored-by: Marcelo Blechner <> * v2.153.0-next.34 * feat: close header side nav on navigation (#3826) * v2.153.0-next.35 --------- Co-authored-by: vaffonso <vaffonso@br.ibm.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: carbon-bot <carbon@us.ibm.com> Co-authored-by: XUE YAN <xyan@us.ibm.com> Co-authored-by: David Conner <rdconner@us.ibm.com> Co-authored-by: balint.lendvai <balint.lendvai@ibm.com> Co-authored-by: Amritha raj herle <herleraja@gmail.com> Co-authored-by: Marcelo Blechner <> Co-authored-by: Amritha raj herle <Amritha.Herle@ibm.com> Co-authored-by: Balint Lendvai <lendvai.balint@gmail.com> Co-authored-by: Erzhan-Temir Mamyrov <Erzhan-Temir.Mamyrov@ibm.com> Co-authored-by: Jay Gillibrand <jay.gillibrand@gmail.com> Co-authored-by: jessieyan <jessie.x.yan@gmail.com> Co-authored-by: Jessie Yan <jessieyan@jessies-mbp.lan> Co-authored-by: Taylor Jones <tay1orjones@users.noreply.github.com> Co-authored-by: Erzhan-Temir Mamyrov <112560065+erzhan-temir-mamyrov@users.noreply.github.com> Co-authored-by: Hector Davis <hectord@br.ibm.com> Co-authored-by: abpaul1993 <136786799+abpaul1993@users.noreply.github.com> Co-authored-by: Kalyani Raut <kalraut2@in.ibm.com> Co-authored-by: blechner <marceloblechner@gmail.com> * v2.153.0 * chore: fix package.json for linux --------- Co-authored-by: vaffonso <vaffonso@br.ibm.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: carbon-bot <carbon@us.ibm.com> Co-authored-by: XUE YAN <xyan@us.ibm.com> Co-authored-by: David Conner <rdconner@us.ibm.com> Co-authored-by: balint.lendvai <balint.lendvai@ibm.com> Co-authored-by: Amritha raj herle <herleraja@gmail.com> Co-authored-by: Amritha raj herle <Amritha.Herle@ibm.com> Co-authored-by: Balint Lendvai <lendvai.balint@gmail.com> Co-authored-by: Erzhan-Temir Mamyrov <Erzhan-Temir.Mamyrov@ibm.com> Co-authored-by: Jay Gillibrand <jay.gillibrand@gmail.com> Co-authored-by: jessieyan <jessie.x.yan@gmail.com> Co-authored-by: Jessie Yan <jessieyan@jessies-mbp.lan> Co-authored-by: Taylor Jones <tay1orjones@users.noreply.github.com> Co-authored-by: Erzhan-Temir Mamyrov <112560065+erzhan-temir-mamyrov@users.noreply.github.com> Co-authored-by: Hector Davis <hectord@br.ibm.com> Co-authored-by: abpaul1993 <136786799+abpaul1993@users.noreply.github.com> Co-authored-by: Kalyani Raut <kalraut2@in.ibm.com> Co-authored-by: blechner <marceloblechner@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Closes #3781
Summary
When drag and drop is enabled for the table and extra column is injected into the tbody to house the "drag handle". In the normal table header and extra, empty cell/column is added to line up and match the number of columns in the body. This is the same technique used for the "checkbox" select columns.
The issues was that not all headers were updated. There is are "filter" and "select columns" headers that can be added to the table. They were not updated with the extra column, so were not aligned right.
The fix is just to pass the "hasDragAndDrop" prop into those components and add the extra cell there when enabled.
Change List (commits, features, bugs, etc)
ColumnHeaderRow.jsx and FilterHeaderRow.jsx were updated with that change.
Other changes are just to the test snapshots that needed updating to account for the new header cell when enabled.
Acceptance Test (how to verify the PR)
View a table with DnD enabled and
hasFilter
prop on. Open the filter header row. If all the columns line up right, it's good. It's most obvious in Firefox, where a big white space was left on the right if the table was wide. The storybookTable > With drag and drop rows
was updated to enable the filter row and test this.Regression Test (how to make sure this PR doesn't break old functionality)
Existing unit tests pass.
Things to look for during review
iot
orbx
class prefix is using the prefix variabledata-testid
attribute. New test ids should have test written to ensure they are not changed or removed.