Make topic bulk actions buttons always visible (#2835)

kafka-ui-react-app/src/components/Topics/List/BatchActionsBar.tsx

@@ -63,6 +63,12 @@ const BatchActionsbar: React.FC<BatchActionsbarProps> = ({
   type Tuple = [string, string];
 
   const getCopyTopicPath = () => {
+    if (!rows.length) {
+      return {
+        pathname: '',
+        search: '',
+      };
+    }
     const topic = rows[0].original;
 
     const search = Object.keys(topic).reduce((acc: Tuple[], key) => {
@@ -86,13 +92,14 @@ const BatchActionsbar: React.FC<BatchActionsbarProps> = ({
         buttonSize="M"
         buttonType="secondary"
         onClick={deleteTopicsHandler}
+        disabled={!selectedTopics.length}
       >
         Delete selected topics
       </Button>
       <Button
         buttonSize="M"
         buttonType="secondary"
-        disabled={selectedTopics.length > 1}
+        disabled={selectedTopics.length !== 1}
         to={getCopyTopicPath()}
       >
         Copy selected topic
@@ -101,6 +108,7 @@ const BatchActionsbar: React.FC<BatchActionsbarProps> = ({
         buttonSize="M"
         buttonType="secondary"
         onClick={purgeTopicsHandler}
+        disabled={!selectedTopics.length}
       >
         Purge messages of selected topics
       </Button>

kafka-ui-react-app/src/components/common/NewTable/Table.tsx

@@ -101,7 +101,7 @@ const getSortingFromSearchParams = (searchParams: URLSearchParams) => {
  *    - use `enableRowSelection` prop to enable row selection. This prop can be a boolean or
  *      a function that returns true if the particular row can be selected.
  *    - use `batchActionsBar` prop to provide a component that will be rendered at the top of the table
- *      when row selection is enabled and there are selected rows.
+ *      when row selection is enabled.
  *
  * 5. Server side processing:
  *    - set `serverSideProcessing` to true
@@ -190,7 +190,7 @@ const Table: React.FC<TableProps<any>> = ({
 
   return (
     <>
-      {table.getSelectedRowModel().flatRows.length > 0 && BatchActionsBar && (
+      {BatchActionsBar && (
         <S.TableActionsBar>
           <BatchActionsBar
             rows={table.getSelectedRowModel().flatRows}

kafka-ui-react-app/src/components/common/NewTable/__test__/Table.spec.tsx

@@ -318,7 +318,7 @@ describe('Table', () => {
 
     it('renders action bar', async () => {
       expect(screen.getAllByRole('row').length).toEqual(data.length + 1);
-      expect(screen.queryByText('I am Action Bar')).not.toBeInTheDocument();
+      expect(screen.queryByText('I am Action Bar')).toBeInTheDocument();
       const checkboxes = screen.getAllByRole('checkbox');
       expect(checkboxes.length).toEqual(data.length + 1);
       await userEvent.click(checkboxes[2]);