diff --git a/src/components/ButtonWithConfirmDialog/ButtonWithConfirmDialog.tsx b/src/components/ButtonWithConfirmDialog/ButtonWithConfirmDialog.tsx index e27540aabe..70d724a46a 100644 --- a/src/components/ButtonWithConfirmDialog/ButtonWithConfirmDialog.tsx +++ b/src/components/ButtonWithConfirmDialog/ButtonWithConfirmDialog.tsx @@ -15,7 +15,6 @@ interface ButtonWithConfirmDialogProps { retryButtonText?: string; buttonDisabled?: ButtonProps['disabled']; buttonView?: ButtonProps['view']; - buttonTitle?: ButtonProps['title']; buttonClassName?: ButtonProps['className']; withPopover?: boolean; popoverContent?: PopoverProps['content']; @@ -32,7 +31,6 @@ export function ButtonWithConfirmDialog({ retryButtonText, buttonDisabled = false, buttonView = 'action', - buttonTitle, buttonClassName, withPopover = false, popoverContent, @@ -71,13 +69,13 @@ export function ButtonWithConfirmDialog({ disabled={buttonDisabled} loading={!buttonDisabled && buttonLoading} className={buttonClassName} - title={buttonTitle} > {children} ); }; + // keep : if button is disabled, popover won't open without this wrapper const renderContent = () => { if (withPopover) { return ( @@ -86,7 +84,7 @@ export function ButtonWithConfirmDialog({ placement={popoverPlacement} disabled={popoverDisabled} > - {renderButton()} + {renderButton()} ); } diff --git a/src/containers/Tablets/TabletsTable.tsx b/src/containers/Tablets/TabletsTable.tsx index 4b15d14e2e..843acd2768 100644 --- a/src/containers/Tablets/TabletsTable.tsx +++ b/src/containers/Tablets/TabletsTable.tsx @@ -25,6 +25,10 @@ import {useIsUserAllowedToMakeChanges} from '../../utils/hooks/useIsUserAllowedT import i18n from './i18n'; +function isFollowerTablet(state: TTabletStateInfo) { + return state.Leader === false; +} + function getColumns({nodeId}: {nodeId?: string | number}) { const columns: DataTableColumn[] = [ { @@ -34,7 +38,7 @@ function getColumns({nodeId}: {nodeId?: string | number}) { return i18n('Type'); }, render: ({row}) => { - const isFollower = row.Leader === false; + const isFollower = isFollowerTablet(row); return ( {row.Type} {isFollower ? follower : ''} @@ -138,7 +142,8 @@ function getColumns({nodeId}: {nodeId?: string | number}) { } function TabletActions(tablet: TTabletStateInfo) { - const isDisabledRestart = tablet.State === ETabletState.Stopped; + const isFollower = isFollowerTablet(tablet); + const isDisabledRestart = tablet.State === ETabletState.Stopped || isFollower; const isUserAllowedToMakeChanges = useIsUserAllowedToMakeChanges(); const [killTablet] = tabletApi.useKillTabletMutation(); @@ -147,10 +152,19 @@ function TabletActions(tablet: TTabletStateInfo) { return null; } + let popoverContent: React.ReactNode; + + if (isFollower) { + popoverContent = i18n('controls.kill-impossible-follower'); + } else if (!isUserAllowedToMakeChanges) { + popoverContent = i18n('controls.kill-not-allowed'); + } else { + popoverContent = i18n('dialog.kill-header'); + } + return ( { @@ -158,11 +172,7 @@ function TabletActions(tablet: TTabletStateInfo) { }} buttonDisabled={isDisabledRestart || !isUserAllowedToMakeChanges} withPopover - popoverContent={ - isUserAllowedToMakeChanges - ? i18n('dialog.kill-header') - : i18n('controls.kill-not-allowed') - } + popoverContent={popoverContent} popoverPlacement={['right', 'bottom']} popoverDisabled={false} > diff --git a/src/containers/Tablets/i18n/en.json b/src/containers/Tablets/i18n/en.json index f8966f3dad..2994ef95b8 100644 --- a/src/containers/Tablets/i18n/en.json +++ b/src/containers/Tablets/i18n/en.json @@ -10,6 +10,7 @@ "dialog.kill-header": "Restart tablet", "dialog.kill-text": "The tablet will be restarted. Do you want to proceed?", "controls.kill-not-allowed": "You don't have enough rights to restart tablet", + "controls.kill-impossible-follower": "It's impossible to restart a follower", "controls.search-placeholder": "Tablet ID", "controls.entities-count-label": "Tablets" }