Skip to content
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.

Sign up for GitHub

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

[Fleet] Hide many actions for hosted agent policies #96160

Merged
merged 10 commits into from
Apr 6, 2021
Merged

[Fleet] Hide many actions for hosted agent policies #96160

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
5711a80
Can't select managed agent. Bulk upgrade agent UI changes
Apr 1, 2021
376a7d4
Fix(?) i18n issues
Apr 2, 2021
606f3e6
Switch message from 'upgrades' to 'will upgrade'
Apr 2, 2021
6925b0f
Merge branch 'master' into 90437-bulk-upgrade-ui-changes
kibanamachine Apr 2, 2021
d3280ea
Fix two i18n template issues
Apr 2, 2021
a93dd8c
For hosted policies, hide many context menu items
Apr 2, 2021
cd05cd0
No "revoke token" icon for hosted agent policy
Apr 2, 2021
f0c267f
Items 5c2 and 4a from the spec ticket
Apr 2, 2021
52d9c7c
Fix compile time & runtime error
Apr 2, 2021
bd1149b
Merge branch 'master' into managed-policy-hide-restricted-actions
kibanamachine Apr 5, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
79 changes: 43 additions & 36 deletions ...plugins/fleet/public/applications/fleet/sections/agent_policy/components/actions_menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,48 @@ export const AgentPolicyActionMenu = memo<{
return (
<AgentPolicyCopyProvider>
{(copyAgentPolicyPrompt) => {
const viewPolicyItem = (
<EuiContextMenuItem
icon="inspect"
onClick={() => setIsYamlFlyoutOpen(!isYamlFlyoutOpen)}
key="viewPolicy"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.viewPolicyText"
defaultMessage="View policy"
/>
</EuiContextMenuItem>
);

const menuItems = agentPolicy?.is_managed
? [viewPolicyItem]
: [
<EuiContextMenuItem
disabled={!hasWriteCapabilities}
icon="plusInCircle"
onClick={() => setIsEnrollmentFlyoutOpen(true)}
key="enrollAgents"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.enrollAgentActionText"
defaultMessage="Add agent"
/>
</EuiContextMenuItem>,
viewPolicyItem,
<EuiContextMenuItem
disabled={!hasWriteCapabilities}
icon="copy"
onClick={() => {
copyAgentPolicyPrompt(agentPolicy, onCopySuccess);
}}
key="copyPolicy"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.copyPolicyActionText"
defaultMessage="Copy policy"
/>
</EuiContextMenuItem>,
];
return (
<>
{isYamlFlyoutOpen ? (
Expand Down Expand Up @@ -80,42 +122,7 @@ export const AgentPolicyActionMenu = memo<{
}
: undefined
}
items={[
<EuiContextMenuItem
disabled={!hasWriteCapabilities}
icon="plusInCircle"
onClick={() => setIsEnrollmentFlyoutOpen(true)}
key="enrollAgents"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.enrollAgentActionText"
defaultMessage="Add agent"
/>
</EuiContextMenuItem>,
<EuiContextMenuItem
icon="inspect"
onClick={() => setIsYamlFlyoutOpen(!isYamlFlyoutOpen)}
key="viewPolicy"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.viewPolicyText"
defaultMessage="View policy"
/>
</EuiContextMenuItem>,
<EuiContextMenuItem
disabled={!hasWriteCapabilities}
icon="copy"
onClick={() => {
copyAgentPolicyPrompt(agentPolicy, onCopySuccess);
}}
key="copyPolicy"
>
<FormattedMessage
id="xpack.fleet.agentPolicyActionMenu.copyPolicyActionText"
defaultMessage="Copy policy"
/>
</EuiContextMenuItem>,
]}
items={menuItems}
/>
</>
);
Expand Down
34 changes: 17 additions & 17 deletions ...eet/public/applications/fleet/sections/agents/agent_list_page/components/bulk_actions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -148,12 +148,21 @@ export const AgentBulkActions: React.FunctionComponent<{
},
];

const showSelectEverything =
selectionMode === 'manual' &&
selectedAgents.length === selectableAgents &&
selectableAgents < totalAgents;

const totalActiveAgents = totalAgents - totalInactiveAgents;
const agentCount = selectionMode === 'manual' ? selectedAgents.length : totalActiveAgents;
const agents = selectionMode === 'manual' ? selectedAgents : currentQuery;

return (
<>
{isReassignFlyoutOpen && (
<EuiPortal>
<AgentReassignAgentPolicyFlyout
agents={selectionMode === 'manual' ? selectedAgents : currentQuery}
agents={agents}
onClose={() => {
setIsReassignFlyoutOpen(false);
refreshAgents();
Expand All @@ -164,10 +173,8 @@ export const AgentBulkActions: React.FunctionComponent<{
{isUnenrollModalOpen && (
<EuiPortal>
<AgentUnenrollAgentModal
agents={selectionMode === 'manual' ? selectedAgents : currentQuery}
agentCount={
selectionMode === 'manual' ? selectedAgents.length : totalAgents - totalInactiveAgents
}
agents={agents}
agentCount={agentCount}
onClose={() => {
setIsUnenrollModalOpen(false);
refreshAgents();
Expand All @@ -179,10 +186,8 @@ export const AgentBulkActions: React.FunctionComponent<{
<EuiPortal>
<AgentUpgradeAgentModal
version={kibanaVersion}
agents={selectionMode === 'manual' ? selectedAgents : currentQuery}
agentCount={
selectionMode === 'manual' ? selectedAgents.length : totalAgents - totalInactiveAgents
}
agents={agents}
agentCount={agentCount}
onClose={() => {
setIsUpgradeModalOpen(false);
refreshAgents();
Expand Down Expand Up @@ -230,12 +235,9 @@ export const AgentBulkActions: React.FunctionComponent<{
>
<FormattedMessage
id="xpack.fleet.agentBulkActions.agentsSelected"
defaultMessage="{count, plural, one {# agent} other {# agents}} selected"
defaultMessage="{count, plural, one {# agent} other {# agents} =all {All agents}} selected"
values={{
count:
selectionMode === 'manual'
? selectedAgents.length
: Math.min(totalAgents - totalInactiveAgents, SO_SEARCH_LIMIT),
count: selectionMode === 'manual' ? selectedAgents.length : 'all',
}}
/>
</Button>
Expand All @@ -248,9 +250,7 @@ export const AgentBulkActions: React.FunctionComponent<{
<EuiContextMenu initialPanelId={0} panels={panels} />
</EuiPopover>
</EuiFlexItem>
{selectionMode === 'manual' &&
selectedAgents.length === selectableAgents &&
selectableAgents < totalAgents ? (
{showSelectEverything ? (
<EuiFlexItem grow={false}>
<Button
size="xs"
Expand Down
144 changes: 87 additions & 57 deletions x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,74 +55,81 @@ const REFRESH_INTERVAL_MS = 30000;

const RowActions = React.memo<{
agent: Agent;
agentPolicy?: AgentPolicy;
refresh: () => void;
onReassignClick: () => void;
onUnenrollClick: () => void;
onUpgradeClick: () => void;
}>(({ agent, refresh, onReassignClick, onUnenrollClick, onUpgradeClick }) => {
}>(({ agent, agentPolicy, refresh, onReassignClick, onUnenrollClick, onUpgradeClick }) => {
const { getHref } = useLink();
const hasWriteCapabilites = useCapabilities().write;

const isUnenrolling = agent.status === 'unenrolling';
const kibanaVersion = useKibanaVersion();
const [isMenuOpen, setIsMenuOpen] = useState(false);
return (
<ContextMenuActions
isOpen={isMenuOpen}
onChange={(isOpen) => setIsMenuOpen(isOpen)}
items={[
<EuiContextMenuItem
icon="inspect"
href={getHref('fleet_agent_details', { agentId: agent.id })}
key="viewAgent"
>
<FormattedMessage id="xpack.fleet.agentList.viewActionText" defaultMessage="View agent" />
</EuiContextMenuItem>,
<EuiContextMenuItem
icon="pencil"
onClick={() => {
onReassignClick();
}}
disabled={!agent.active}
key="reassignPolicy"
>
const menuItems = [
<EuiContextMenuItem
icon="inspect"
href={getHref('fleet_agent_details', { agentId: agent.id })}
key="viewAgent"
>
<FormattedMessage id="xpack.fleet.agentList.viewActionText" defaultMessage="View agent" />
</EuiContextMenuItem>,
];

if (agentPolicy?.is_managed === false) {
menuItems.push(
<EuiContextMenuItem
icon="pencil"
onClick={() => {
onReassignClick();
}}
disabled={!agent.active}
key="reassignPolicy"
>
<FormattedMessage
id="xpack.fleet.agentList.reassignActionText"
defaultMessage="Assign to new policy"
/>
</EuiContextMenuItem>,
<EuiContextMenuItem
disabled={!hasWriteCapabilites || !agent.active}
icon="trash"
onClick={() => {
onUnenrollClick();
}}
>
{isUnenrolling ? (
<FormattedMessage
id="xpack.fleet.agentList.reassignActionText"
defaultMessage="Assign to new policy"
id="xpack.fleet.agentList.forceUnenrollOneButton"
defaultMessage="Force unenroll"
/>
</EuiContextMenuItem>,
<EuiContextMenuItem
disabled={!hasWriteCapabilites || !agent.active}
icon="trash"
onClick={() => {
onUnenrollClick();
}}
>
{isUnenrolling ? (
<FormattedMessage
id="xpack.fleet.agentList.forceUnenrollOneButton"
defaultMessage="Force unenroll"
/>
) : (
<FormattedMessage
id="xpack.fleet.agentList.unenrollOneButton"
defaultMessage="Unenroll agent"
/>
)}
</EuiContextMenuItem>,
<EuiContextMenuItem
icon="refresh"
disabled={!isAgentUpgradeable(agent, kibanaVersion)}
onClick={() => {
onUpgradeClick();
}}
>
) : (
<FormattedMessage
id="xpack.fleet.agentList.upgradeOneButton"
defaultMessage="Upgrade agent"
id="xpack.fleet.agentList.unenrollOneButton"
defaultMessage="Unenroll agent"
/>
</EuiContextMenuItem>,
]}
)}
</EuiContextMenuItem>,
<EuiContextMenuItem
icon="refresh"
disabled={!isAgentUpgradeable(agent, kibanaVersion)}
onClick={() => {
onUpgradeClick();
}}
>
<FormattedMessage
id="xpack.fleet.agentList.upgradeOneButton"
defaultMessage="Upgrade agent"
/>
</EuiContextMenuItem>
);
}
return (
<ContextMenuActions
isOpen={isMenuOpen}
onChange={(isOpen) => setIsMenuOpen(isOpen)}
items={menuItems}
/>
);
});
Expand Down Expand Up @@ -332,6 +339,14 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
}, {} as { [k: string]: AgentPolicy });
}, [agentPolicies]);

const isAgentSelectable = (agent: Agent) => {
if (!agent.active) return false;

const agentPolicy = agentPolicies.find((p) => p.id === agent.policy_id);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am wondering if we should index policy per id at some point we are going to loop a lot of time over this policy list

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

actually looks like we do agentPoliciesIndexedById

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good eyes. Thanks! This replaced a few instances of .find with byId but looks likes it missed one (some?). I'll review and fix as a part of the next PR in this series.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixed in 18fca79

const isManaged = agent.policy_id && agentPolicy?.is_managed === true;
return !isManaged;
};

const columns = [
{
field: 'local_metadata.host.hostname',
Expand All @@ -358,7 +373,7 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
defaultMessage: 'Agent policy',
}),
render: (policyId: string, agent: Agent) => {
const policyName = agentPolicies.find((p) => p.id === policyId)?.name;
const policyName = agentPoliciesIndexedById[policyId]?.name;
return (
<EuiFlexGroup gutterSize="s" alignItems="center" style={{ minWidth: 0 }}>
<EuiFlexItem grow={false} className="eui-textTruncate">
Expand Down Expand Up @@ -445,9 +460,14 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
actions: [
{
render: (agent: Agent) => {
const agentPolicy =
typeof agent.policy_id === 'string'
? agentPoliciesIndexedById[agent.policy_id]
: undefined;
return (
<RowActions
agent={agent}
agentPolicy={agentPolicy}
refresh={() => fetchData()}
onReassignClick={() => setAgentToReassign(agent)}
onUnenrollClick={() => setAgentToUnenroll(agent)}
Expand Down Expand Up @@ -549,7 +569,7 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
totalAgents={totalAgents}
totalInactiveAgents={totalInactiveAgents}
agentStatus={agentsStatus}
selectableAgents={agents?.filter((agent) => agent.active).length || 0}
selectableAgents={agents?.filter(isAgentSelectable).length || 0}
selectionMode={selectionMode}
setSelectionMode={setSelectionMode}
currentQuery={kuery}
Expand Down Expand Up @@ -613,7 +633,17 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
setSelectedAgents(newAgents);
setSelectionMode('manual');
},
selectable: (agent: Agent) => agent.active,
selectable: isAgentSelectable,
selectableMessage: (selectable, agent) => {
if (selectable) return '';
if (!agent.active) {
return 'This agent is not active';
}
if (agent.policy_id && agentPoliciesIndexedById[agent.policy_id].is_managed) {
return 'This action is not available for agents enrolled in an externally managed agent policy';
}
return '';
},
}
: undefined
}
Expand Down
Loading