-
Notifications
You must be signed in to change notification settings - Fork 8.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Fleet] Refactor of install package button code (#131015)
* move install integration button to separate component * move install path generation to util function * small refactor * add unit tests * rorder deps to make diff less noisy
- Loading branch information
Showing
6 changed files
with
243 additions
and
102 deletions.
There are no files selected for viewing
60 changes: 60 additions & 0 deletions
60
...plications/integrations/sections/epm/screens/detail/components/add_integration_button.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import { FormattedMessage } from '@kbn/i18n-react'; | ||
|
|
||
| import { EuiButtonWithTooltip } from '../../../../../components'; | ||
|
|
||
| interface AddIntegrationButtonProps { | ||
| userCanInstallPackages?: boolean; | ||
| missingSecurityConfiguration: boolean; | ||
| packageName: string; | ||
| href: string; | ||
| onClick: Function; | ||
| } | ||
|
|
||
| export function AddIntegrationButton(props: AddIntegrationButtonProps) { | ||
| const { userCanInstallPackages, missingSecurityConfiguration, packageName, href, onClick } = | ||
| props; | ||
|
|
||
| const tooltip = !userCanInstallPackages | ||
| ? { | ||
| content: missingSecurityConfiguration ? ( | ||
| <FormattedMessage | ||
| id="xpack.fleet.epm.addPackagePolicyButtonSecurityRequiredTooltip" | ||
| defaultMessage="To add Elastic Agent Integrations, you must have security enabled and have the All privilege for Fleet. Contact your administrator." | ||
| /> | ||
| ) : ( | ||
| <FormattedMessage | ||
| id="xpack.fleet.epm.addPackagePolicyButtonPrivilegesRequiredTooltip" | ||
| defaultMessage="Elastic Agent Integrations require the All privilege for Fleet and All privilege for Integrations. Contact your administrator." | ||
| /> | ||
| ), | ||
| } | ||
| : undefined; | ||
|
|
||
| return ( | ||
| <EuiButtonWithTooltip | ||
| fill | ||
| isDisabled={!userCanInstallPackages} | ||
| iconType="plusInCircle" | ||
| href={href} | ||
| onClick={(e) => onClick(e)} | ||
| data-test-subj="addIntegrationPolicyButton" | ||
| tooltip={tooltip} | ||
| > | ||
| <FormattedMessage | ||
| id="xpack.fleet.epm.addPackagePolicyButtonText" | ||
| defaultMessage="Add {packageName}" | ||
| values={{ | ||
| packageName, | ||
| }} | ||
| /> | ||
| </EuiButtonWithTooltip> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
69 changes: 69 additions & 0 deletions
69
...ications/integrations/sections/epm/screens/detail/utils/get_install_route_options.test.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,69 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
|
|
||
| import { getInstallPkgRouteOptions } from '.'; | ||
|
|
||
| // this is always the same | ||
| const expectedOnCancelNavigateTo = [ | ||
| 'integrations', | ||
| { | ||
| path: '/detail/myintegration-1.0.0/overview?integration=myintegration', | ||
| }, | ||
| ]; | ||
|
|
||
| describe('getInstallPkgRouteOptions', () => { | ||
| it('should redirect to integrations app on save if no agentPolicyId present', () => { | ||
| const opts = { | ||
| currentPath: 'currentPath', | ||
| integration: 'myintegration', | ||
| pkgkey: 'myintegration-1.0.0', | ||
| }; | ||
|
|
||
| const expectedRedirectURl = '/detail/myintegration-1.0.0/policies?integration=myintegration'; | ||
|
|
||
| const expectedOptions = { | ||
| path: '/integrations/myintegration-1.0.0/add-integration/myintegration', | ||
| state: { | ||
| onCancelUrl: 'currentPath', | ||
| onCancelNavigateTo: expectedOnCancelNavigateTo, | ||
| onSaveNavigateTo: ['integrations', { path: expectedRedirectURl }], | ||
| onSaveQueryParams: { | ||
| showAddAgentHelp: { renameKey: 'showAddAgentHelpForPolicyId', policyIdAsValue: true }, | ||
| openEnrollmentFlyout: { renameKey: 'addAgentToPolicyId', policyIdAsValue: true }, | ||
| }, | ||
| }, | ||
| }; | ||
|
|
||
| expect(getInstallPkgRouteOptions(opts)).toEqual(['fleet', expectedOptions]); | ||
| }); | ||
|
|
||
| it('should redirect to fleet app on save if agentPolicyId present', () => { | ||
| const opts = { | ||
| currentPath: 'currentPath', | ||
| integration: 'myintegration', | ||
| pkgkey: 'myintegration-1.0.0', | ||
| agentPolicyId: '12345', | ||
| }; | ||
|
|
||
| const expectedRedirectURl = '/policies/12345'; | ||
|
|
||
| const expectedOptions = { | ||
| path: '/integrations/myintegration-1.0.0/add-integration/myintegration?policyId=12345', | ||
| state: { | ||
| onCancelUrl: 'currentPath', | ||
| onCancelNavigateTo: expectedOnCancelNavigateTo, | ||
| onSaveNavigateTo: ['fleet', { path: expectedRedirectURl }], | ||
| onSaveQueryParams: { | ||
| showAddAgentHelp: true, | ||
| openEnrollmentFlyout: true, | ||
| }, | ||
| }, | ||
| }; | ||
|
|
||
| expect(getInstallPkgRouteOptions(opts)).toEqual(['fleet', expectedOptions]); | ||
| }); | ||
| }); |
82 changes: 82 additions & 0 deletions
82
.../applications/integrations/sections/epm/screens/detail/utils/get_install_route_options.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,82 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
| import type { CreatePackagePolicyRouteState } from '../../../../../types'; | ||
| import { PLUGIN_ID, INTEGRATIONS_PLUGIN_ID, pagePathGetters } from '../../../../../constants'; | ||
|
|
||
| /* | ||
| * When the install package button is pressed, this fn decides which page to navigate to | ||
| * by generating the options to be passed to `services.application.navigateToApp`. | ||
| */ | ||
| export const getInstallPkgRouteOptions = ({ | ||
| currentPath, | ||
| integration, | ||
| agentPolicyId, | ||
| pkgkey, | ||
| }: { | ||
| currentPath: string; | ||
| integration: string | null; | ||
| agentPolicyId?: string; | ||
| pkgkey: string; | ||
| }): [string, { path: string; state: unknown }] => { | ||
| const integrationOpts: { integration?: string } = integration ? { integration } : {}; | ||
| const path = pagePathGetters.add_integration_to_policy({ | ||
| pkgkey, | ||
| ...integrationOpts, | ||
| ...(agentPolicyId ? { agentPolicyId } : {}), | ||
| })[1]; | ||
|
|
||
| let redirectToPath: CreatePackagePolicyRouteState['onSaveNavigateTo'] & | ||
| CreatePackagePolicyRouteState['onCancelNavigateTo']; | ||
| let onSaveQueryParams: CreatePackagePolicyRouteState['onSaveQueryParams']; | ||
| if (agentPolicyId) { | ||
| redirectToPath = [ | ||
| PLUGIN_ID, | ||
| { | ||
| path: pagePathGetters.policy_details({ | ||
| policyId: agentPolicyId, | ||
| })[1], | ||
| }, | ||
| ]; | ||
|
|
||
| onSaveQueryParams = { | ||
| showAddAgentHelp: true, | ||
| openEnrollmentFlyout: true, | ||
| }; | ||
| } else { | ||
| redirectToPath = [ | ||
| INTEGRATIONS_PLUGIN_ID, | ||
| { | ||
| path: pagePathGetters.integration_details_policies({ | ||
| pkgkey, | ||
| ...integrationOpts, | ||
| })[1], | ||
| }, | ||
| ]; | ||
|
|
||
| onSaveQueryParams = { | ||
| showAddAgentHelp: { renameKey: 'showAddAgentHelpForPolicyId', policyIdAsValue: true }, | ||
| openEnrollmentFlyout: { renameKey: 'addAgentToPolicyId', policyIdAsValue: true }, | ||
| }; | ||
| } | ||
|
|
||
| const state: CreatePackagePolicyRouteState = { | ||
| onSaveNavigateTo: redirectToPath, | ||
| onSaveQueryParams, | ||
| onCancelNavigateTo: [ | ||
| INTEGRATIONS_PLUGIN_ID, | ||
| { | ||
| path: pagePathGetters.integration_details_overview({ | ||
| pkgkey, | ||
| ...integrationOpts, | ||
| })[1], | ||
| }, | ||
| ], | ||
| onCancelUrl: currentPath, | ||
| }; | ||
|
|
||
| return [PLUGIN_ID, { path, state }]; | ||
| }; |
Oops, something went wrong.