fix: popover

Author: astandrik

src/containers/Operations/columns.tsx

@@ -1,7 +1,7 @@
 import {duration} from '@gravity-ui/date-utils';
 import {Ban, CircleStop} from '@gravity-ui/icons';
 import type {Column as DataTableColumn} from '@gravity-ui/react-data-table';
-import {Icon, Text, Tooltip} from '@gravity-ui/uikit';
+import {Icon, Text} from '@gravity-ui/uikit';
 
 import {ButtonWithConfirmDialog} from '../../components/ButtonWithConfirmDialog/ButtonWithConfirmDialog';
 import {CellWithPopover} from '../../components/CellWithPopover/CellWithPopover';
@@ -163,40 +163,40 @@ function OperationsActions({operation, database, refreshTable}: OperationsAction
 
     return (
         <div className={b('buttons-container')}>
-            <Tooltip openDelay={0} content={i18n('header_forget')} placement={['left', 'auto']}>
-                <div>
-                    <ButtonWithConfirmDialog
-                        buttonView="outlined"
-                        dialogHeader={i18n('header_forget')}
-                        dialogText={i18n('text_forget')}
-                        onConfirmAction={() =>
-                            forgetOperation({id, database})
-                                .unwrap()
-                                .then(() => refreshTable())
-                        }
-                        buttonDisabled={isLoadingCancel}
-                    >
-                        <Icon data={Ban} />
-                    </ButtonWithConfirmDialog>
-                </div>
-            </Tooltip>
-            <Tooltip openDelay={0} content={i18n('header_cancel')} placement={['right', 'auto']}>
-                <div>
-                    <ButtonWithConfirmDialog
-                        buttonView="outlined"
-                        dialogHeader={i18n('header_cancel')}
-                        dialogText={i18n('text_cancel')}
-                        onConfirmAction={() =>
-                            cancelOperation({id, database})
-                                .unwrap()
-                                .then(() => refreshTable())
-                        }
-                        buttonDisabled={isForgetLoading}
-                    >
-                        <Icon data={CircleStop} />
-                    </ButtonWithConfirmDialog>
-                </div>
-            </Tooltip>
+            <ButtonWithConfirmDialog
+                buttonView="outlined"
+                dialogHeader={i18n('header_forget')}
+                dialogText={i18n('text_forget')}
+                onConfirmAction={() =>
+                    forgetOperation({id, database})
+                        .unwrap()
+                        .then(() => refreshTable())
+                }
+                buttonDisabled={isLoadingCancel}
+                withPopover
+                popoverContent={i18n('header_forget')}
+                popoverPlacement={['left', 'auto']}
+                popoverDisabled={false}
+            >
+                <Icon data={Ban} />
+            </ButtonWithConfirmDialog>
+            <ButtonWithConfirmDialog
+                buttonView="outlined"
+                dialogHeader={i18n('header_cancel')}
+                dialogText={i18n('text_cancel')}
+                onConfirmAction={() =>
+                    cancelOperation({id, database})
+                        .unwrap()
+                        .then(() => refreshTable())
+                }
+                buttonDisabled={isForgetLoading}
+                withPopover
+                popoverContent={i18n('header_cancel')}
+                popoverPlacement={['right', 'auto']}
+                popoverDisabled={false}
+            >
+                <Icon data={CircleStop} />
+            </ButtonWithConfirmDialog>
         </div>
     );
 }

src/containers/Tablets/TabletsTable.tsx

@@ -1,6 +1,6 @@
 import {ArrowRotateLeft} from '@gravity-ui/icons';
 import type {Column as DataTableColumn} from '@gravity-ui/react-data-table';
-import {Icon, Text, Tooltip} from '@gravity-ui/uikit';
+import {Icon, Text} from '@gravity-ui/uikit';
 
 import {ButtonWithConfirmDialog} from '../../components/ButtonWithConfirmDialog/ButtonWithConfirmDialog';
 import {EntityStatus} from '../../components/EntityStatus/EntityStatus';
@@ -126,25 +126,26 @@ function TabletActions(tablet: TTabletStateInfo) {
     }
 
     return (
-        <Tooltip openDelay={0} content={i18n('dialog.kill-header')} placement={['right', 'auto']}>
-            <div>
-                <ButtonWithConfirmDialog
-                    buttonView="outlined"
-                    buttonTitle={i18n('dialog.kill-header')}
-                    dialogHeader={i18n('dialog.kill-header')}
-                    dialogText={i18n('dialog.kill-text')}
-                    onConfirmAction={() => {
-                        return killTablet({id}).unwrap();
-                    }}
-                    buttonDisabled={isDisabledRestart || !isUserAllowedToMakeChanges}
-                    withPopover
-                    popoverContent={i18n('controls.kill-not-allowed')}
-                    popoverDisabled={isUserAllowedToMakeChanges}
-                >
-                    <Icon data={ArrowRotateLeft} />
-                </ButtonWithConfirmDialog>
-            </div>
-        </Tooltip>
+        <ButtonWithConfirmDialog
+            buttonView="outlined"
+            buttonTitle={i18n('dialog.kill-header')}
+            dialogHeader={i18n('dialog.kill-header')}
+            dialogText={i18n('dialog.kill-text')}
+            onConfirmAction={() => {
+                return killTablet({id}).unwrap();
+            }}
+            buttonDisabled={isDisabledRestart || !isUserAllowedToMakeChanges}
+            withPopover
+            popoverContent={
+                isUserAllowedToMakeChanges
+                    ? i18n('dialog.kill-header')
+                    : i18n('controls.kill-not-allowed')
+            }
+            popoverPlacement={['right', 'auto']}
+            popoverDisabled={false}
+        >
+            <Icon data={ArrowRotateLeft} />
+        </ButtonWithConfirmDialog>
     );
 }