diff --git a/x-pack/plugins/fleet/cypress/e2e/fleet_settings_outputs.cy.ts b/x-pack/plugins/fleet/cypress/e2e/fleet_settings_outputs.cy.ts index 4fc4fa33ea5b0..6119a8b13e8b8 100644 --- a/x-pack/plugins/fleet/cypress/e2e/fleet_settings_outputs.cy.ts +++ b/x-pack/plugins/fleet/cypress/e2e/fleet_settings_outputs.cy.ts @@ -182,7 +182,7 @@ queue: cy.contains('Name is required'); cy.contains('URL is required'); - cy.contains('Service Token is required'); + cy.contains('Service token is required'); shouldDisplayError(SETTINGS_OUTPUTS.NAME_INPUT); shouldDisplayError('serviceTokenSecretInput'); }); diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/index.test.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/index.test.tsx index c57d26603c889..e742005a37913 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/index.test.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/index.test.tsx @@ -83,7 +83,7 @@ const kafkaSectionsLabels = [ 'Broker settings', ]; -const remoteEsOutputLabels = ['Hosts', 'Service Token']; +const remoteEsOutputLabels = ['Hosts', 'Service token']; describe('EditOutputFlyout', () => { const mockStartServices = (isServerlessEnabled?: boolean) => { diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_remote_es.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_remote_es.tsx index 354c6ce7d3821..658a42115381b 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_remote_es.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_remote_es.tsx @@ -82,7 +82,7 @@ export const OutputFormRemoteEsSection: React.FunctionComponent = (props) label={ } {...inputs.serviceTokenInput.formRowProps} @@ -105,7 +105,7 @@ export const OutputFormRemoteEsSection: React.FunctionComponent = (props) { @@ -42,8 +43,8 @@ describe('SecretFormRow', () => { expect(queryByText(initialValue)).not.toBeInTheDocument(); }); - it('should not enable the replace button if the row is disabled', () => { - const { getByText } = renderReactTestingLibraryWithI18n( + it('should not enable action links if the row is disabled', () => { + const { getByText, queryByText } = renderReactTestingLibraryWithI18n( { ); - expect(getByText('Replace Test Secret').closest('button')).toBeDisabled(); + expect(getByText('The saved Test Secret is hidden.')).toBeInTheDocument(); + expect(queryByText('Replace Test Secret')).not.toBeInTheDocument(); + expect(queryByText('Click to use secret storage instead')).not.toBeInTheDocument(); + expect(queryByText('Click to use plain text storage instead')).not.toBeInTheDocument(); }); it('should call the cancelEdit function when the cancel button is clicked', () => { diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx index 34383ae62f287..3614499905b2e 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/components/edit_output_flyout/output_form_secret_form_row.tsx @@ -55,32 +55,45 @@ export const SecretFormRow: React.FC<{ const [editMode, setEditMode] = useState(isConvertedToSecret || !initialValue); const valueHiddenPanel = ( - - - - - setEditMode(true)} - color="primary" - iconType="refresh" - iconSide="left" - size="xs" - > - - + {disabled ? ( + + + + ) : ( + <> + + + + + setEditMode(true)} + color="primary" + iconType="refresh" + iconSide="left" + size="xs" + > + + + + )} ); @@ -134,6 +147,7 @@ export const SecretFormRow: React.FC<{ ); const helpText = useMemo(() => { + if (disabled) return null; if (isConvertedToSecret) return ( @@ -172,9 +186,9 @@ export const SecretFormRow: React.FC<{ /> ); return undefined; - }, [initialValue, isConvertedToSecret, onToggleSecretStorage]); + }, [disabled, initialValue, isConvertedToSecret, onToggleSecretStorage]); - const plainTextHelp = ( + const plainTextHelp = disabled ? null : (