[Bug]: Conflict between BatchAction and Filter(Popover) in TableToolbarContent of DataTable

[james-liubang]

Package

@carbon/react

Browser

Chrome

Package version

v10

React version

v21.6.2

Description

Problem:
There was a conflict between BatchAction and Filter(Popover) in TableToolbarContent of DataTable.

Filter(Popover) worked well before added TableBatchAction.

It couldn't show Filter(Popover) after added TableBatchAction.

<TableBatchAction
tabIndex={hasBatchActions ? 0 : -1}
renderIcon={Delete}
onClick={handleDeleteRows}
>
Delete

{BatchToolbar}

Solution:
The clipPath set none when no selection, it works. Thanks for Jose @jose-biescas , he gave the solution, very very smart solution..

    <TableToolbarContent
      style={{
        clipPath:
          BatchToolbar && selectedRowsCountInFiltered > 0
            ? "polygon(0 0, 100% 0, 100% 0, 0 0)"
            : "none",
      }}
      aria-hidden={hasBatchActions}
    >...
    </TableToolbarContent>
    
 However please resolve this in future release , thanks!!!

Reproduction/example

https://stackblitz.com/edit/github-cygrgo?file=src%2FApp.jsx

Steps to reproduce

1. Implement the DataTable with Filter
   it worked.
2. Add BatchAction
   it failed

Suggested Severity

None

Application/PAL

No response

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems