[Synthetics] Copy updates follow-up (#160158)

This commit is contained in:
Justin Kambic 2023-06-26 04:32:26 -04:00 committed by GitHub
parent ae64c4f021
commit d5bf4be1da
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 48 additions and 25 deletions

View file

@ -201,5 +201,5 @@ export const INSPECT_MONITOR_LABEL = i18n.translate(
);
const HIDE_PARAMS = i18n.translate('xpack.synthetics.monitorInspect.hideParams', {
defaultMessage: 'Hide params values',
defaultMessage: 'Hide parameter values',
});

View file

@ -5,7 +5,7 @@
* 2.0.
*/
import React, { useState } from 'react';
import React, { useMemo, useState } from 'react';
import { EuiPopover, EuiButtonEmpty, EuiButton, EuiSpacer } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
@ -31,38 +31,45 @@ export const ViewLocationMonitors = ({
const history = useHistory();
const { formattedLocationName, href, viewMonitorsMessage } = useMemo(
() => ({
formattedLocationName: <strong>{locationName}</strong>,
href:
count > 0
? history.createHref({
pathname: '/monitors',
search: `?locations=${JSON.stringify([locationName])}`,
})
: history.createHref({
pathname: '/add-monitor',
}),
viewMonitorsMessage: count > 0 ? VIEW_LOCATION_MONITORS : CREATE_MONITOR,
}),
[count, history, locationName]
);
return (
<EuiPopover button={button} isOpen={isPopoverOpen} closePopover={closePopover}>
<FormattedMessage
id="xpack.synthetics.monitorManagement.viewMonitors"
defaultMessage="{name} is used in {count, number} {count, plural,one {monitor} other {monitors}}."
values={{ count, name: <strong>{locationName}</strong> }}
/>
<EuiSpacer size="s" />
{count > 0 ? (
<EuiButton
data-test-subj="syntheticsViewLocationMonitorsButton"
href={history.createHref({
pathname: '/monitors',
search: `?locations=${JSON.stringify([locationName])}`,
})}
>
{VIEW_LOCATION_MONITORS}
</EuiButton>
<GreaterThanZeroMessage count={count} name={formattedLocationName} />
) : (
<EuiButton
data-test-subj="syntheticsViewLocationMonitorsButton"
href={history.createHref({
pathname: '/add-monitor',
})}
>
{CREATE_MONITOR}
</EuiButton>
<ZeroMessage name={formattedLocationName} />
)}
<EuiSpacer size="s" />
<ViewLocationMonitorsButton href={href}>{viewMonitorsMessage}</ViewLocationMonitorsButton>
</EuiPopover>
);
};
const ViewLocationMonitorsButton: React.FC<{ href: string }> = ({ href, children }) => {
return (
<EuiButton data-test-subj="syntheticsViewLocationMonitorsButton" href={href}>
{children}
</EuiButton>
);
};
const VIEW_LOCATION_MONITORS = i18n.translate(
'xpack.synthetics.monitorManagement.viewLocationMonitors',
{
@ -73,3 +80,19 @@ const VIEW_LOCATION_MONITORS = i18n.translate(
const CREATE_MONITOR = i18n.translate('xpack.synthetics.monitorManagement.createLocationMonitors', {
defaultMessage: 'Create monitor',
});
const GreaterThanZeroMessage = ({ count, name }: { count: number; name: JSX.Element }) => (
<FormattedMessage
id="xpack.synthetics.monitorManagement.viewMonitors"
defaultMessage="{name} is used in {count, number} {count, plural,one {monitor} other {monitors}}."
values={{ count, name }}
/>
);
const ZeroMessage = ({ name }: { name: JSX.Element }) => (
<FormattedMessage
id="xpack.synthetics.monitorManagement.viewZeroMonitors"
defaultMessage="{name} isn't used in any monitors yet."
values={{ name }}
/>
);