diff --git a/.betterer.results b/.betterer.results index 827fff64212c..dc17bc5297cb 100644 --- a/.betterer.results +++ b/.betterer.results @@ -556,119 +556,25 @@ exports[`better eslint`] = { "packages/grafana-sql/src/components/visual-query-builder/AwesomeQueryBuilder.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"] ], - "packages/grafana-ui/src/components/AutoSaveField/AutoSaveField.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/AutoSaveField/EllipsisAnimated.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"] - ], "packages/grafana-ui/src/components/ColorPicker/ColorPicker.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"] ], - "packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], "packages/grafana-ui/src/components/Combobox/Combobox.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "1"] ], - "packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], - "packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinkEditorModalContent.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksInlineEditor.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksListItem.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/DataLinks/FieldLinkList.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], - [0, 0, 0, "Unexpected any. Specify a different type.", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"] - ], - "packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "4"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "5"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "6"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "7"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "8"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "9"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "10"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "11"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "12"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "13"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "14"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "15"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "16"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "17"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "18"] - ], - "packages/grafana-ui/src/components/DataSourceSettings/SecureSocksProxySettings.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/DataSourceSettings/TLSAuthSettings.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] + [0, 0, 0, "Unexpected any. Specify a different type.", "1"] ], "packages/grafana-ui/src/components/DataSourceSettings/types.ts:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"] ], - "packages/grafana-ui/src/components/DateTimePickers/DateTimePicker/DateTimePicker.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "4"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "5"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "6"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "7"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "8"] - ], - "packages/grafana-ui/src/components/FileDropzone/FileDropzone.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/FileDropzone/FileListItem.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], - "packages/grafana-ui/src/components/FilterInput/FilterInput.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/Forms/FieldArray.story.tsx:5381": [ [0, 0, 0, "\'HorizontalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"] ], @@ -715,10 +621,6 @@ exports[`better eslint`] = { [0, 0, 0, "Unexpected any. Specify a different type.", "2"], [0, 0, 0, "Unexpected any. Specify a different type.", "3"] ], - "packages/grafana-ui/src/components/PageLayout/PageToolbar.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], "packages/grafana-ui/src/components/PanelChrome/PanelContext.ts:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"] @@ -726,9 +628,6 @@ exports[`better eslint`] = { "packages/grafana-ui/src/components/PanelChrome/index.ts:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], - "packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/Segment/SegmentSelect.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], @@ -738,10 +637,7 @@ exports[`better eslint`] = { [0, 0, 0, "Unexpected any. Specify a different type.", "2"], [0, 0, 0, "Unexpected any. Specify a different type.", "3"], [0, 0, 0, "Do not use any type assertions.", "4"], - [0, 0, 0, "Unexpected any. Specify a different type.", "5"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "6"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "7"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "8"] + [0, 0, 0, "Unexpected any. Specify a different type.", "5"] ], "packages/grafana-ui/src/components/Select/ValueContainer.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"] @@ -790,15 +686,8 @@ exports[`better eslint`] = { "packages/grafana-ui/src/components/Table/Filter.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"] ], - "packages/grafana-ui/src/components/Table/FilterList.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/Table/FilterPopup.tsx:5381": [ - [0, 0, 0, "Unexpected any. Specify a different type.", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "4"] + [0, 0, 0, "Unexpected any. Specify a different type.", "0"] ], "packages/grafana-ui/src/components/Table/FooterRow.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"], @@ -810,10 +699,7 @@ exports[`better eslint`] = { "packages/grafana-ui/src/components/Table/Table.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"], - [0, 0, 0, "Do not use any type assertions.", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "4"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "5"] + [0, 0, 0, "Do not use any type assertions.", "2"] ], "packages/grafana-ui/src/components/Table/TableCell.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"], @@ -840,64 +726,12 @@ exports[`better eslint`] = { [0, 0, 0, "Unexpected any. Specify a different type.", "4"], [0, 0, 0, "Unexpected any. Specify a different type.", "5"] ], - "packages/grafana-ui/src/components/TableInputCSV/TableInputCSV.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"] - ], "packages/grafana-ui/src/components/Tags/Tag.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], - "packages/grafana-ui/src/components/Tags/TagList.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/TagsInput/TagsInput.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/ThemeDemos/EmotionPerfTest.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], - "packages/grafana-ui/src/components/ThemeDemos/ThemeDemo.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "1"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "2"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "3"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "4"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "5"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "6"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "7"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "8"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "9"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "10"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "11"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "12"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "13"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "14"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "15"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "16"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "17"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "18"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "19"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "20"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "21"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "22"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "23"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "24"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "25"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "26"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "27"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "28"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "29"], - [0, 0, 0, "No untranslated strings. Wrap text with ", "30"] - ], - "packages/grafana-ui/src/components/UsersIndicator/UserIcon.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/ValuePicker/ValuePicker.tsx:5381": [ [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"] ], - "packages/grafana-ui/src/components/VizLegend/VizLegendTableItem.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/VizLegend/types.ts:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"] @@ -910,9 +744,6 @@ exports[`better eslint`] = { [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"] ], - "packages/grafana-ui/src/components/VizTooltip/VizTooltipFooter.tsx:5381": [ - [0, 0, 0, "No untranslated strings. Wrap text with ", "0"] - ], "packages/grafana-ui/src/components/index.ts:5381": [ [0, 0, 0, "\'HorizontalGroup\' import from \'./Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"], [0, 0, 0, "\'VerticalGroup\' import from \'./Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "1"] diff --git a/packages/grafana-ui/src/components/AutoSaveField/AutoSaveField.tsx b/packages/grafana-ui/src/components/AutoSaveField/AutoSaveField.tsx index 0a4bee15e571..fdd34d18d9bc 100644 --- a/packages/grafana-ui/src/components/AutoSaveField/AutoSaveField.tsx +++ b/packages/grafana-ui/src/components/AutoSaveField/AutoSaveField.tsx @@ -4,6 +4,7 @@ import { useCallback, useMemo, useRef } from 'react'; import * as React from 'react'; import { useStyles2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Field, FieldProps } from '../Forms/Field'; import { InlineToast } from '../InlineToast/InlineToast'; @@ -106,12 +107,14 @@ export function AutoSaveField(props: Props) { {fieldState.isLoading && ( - Saving + + Saving + )} {fieldState.showSuccess && ( - Saved! + Saved! )} diff --git a/packages/grafana-ui/src/components/AutoSaveField/EllipsisAnimated.tsx b/packages/grafana-ui/src/components/AutoSaveField/EllipsisAnimated.tsx index 0d1dce934eca..e36aefb9139f 100644 --- a/packages/grafana-ui/src/components/AutoSaveField/EllipsisAnimated.tsx +++ b/packages/grafana-ui/src/components/AutoSaveField/EllipsisAnimated.tsx @@ -9,9 +9,9 @@ export const EllipsisAnimated = memo(() => { const styles = useStyles2(getStyles); return (
- . - . - . + {'.'} + {'.'} + {'.'}
); }); diff --git a/packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx b/packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx index a21122c5a086..056b7b18d584 100644 --- a/packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx +++ b/packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx @@ -7,6 +7,7 @@ import { GrafanaTheme2, colorManipulator } from '@grafana/data'; import { stylesFactory, withTheme2 } from '../../themes'; import { Themeable2 } from '../../types/theme'; +import { Trans } from '../../utils/i18n'; import { PopoverContentProps } from '../Tooltip'; import { NamedColorsPalette } from './NamedColorsPalette'; @@ -122,10 +123,10 @@ class UnThemedColorPickerPopover extends Comp
{this.renderCustomPickerTabs()}
diff --git a/packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx b/packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx index d045576bf1f5..4239b2f1820d 100644 --- a/packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx +++ b/packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx @@ -6,6 +6,7 @@ import { GrafanaTheme2 } from '@grafana/data'; import { useStyles2 } from '../../themes'; import { ComponentSize } from '../../types/size'; +import { Trans } from '../../utils/i18n'; import { Button, ButtonVariant } from '../Button'; export interface Props { @@ -115,7 +116,7 @@ export const ConfirmButton = ({ {confirmText}
diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx index f671f98d21fe..98f5d67227fc 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx @@ -5,6 +5,7 @@ import { VariableSuggestion, GrafanaTheme2, DataLink } from '@grafana/data'; import { useStyles2 } from '../../themes/index'; import { isCompactUrl } from '../../utils/dataLinks'; +import { Trans } from '../../utils/i18n'; import { Field } from '../Forms/Field'; import { Input } from '../Input/Input'; import { Switch } from '../Switch/Switch'; @@ -64,8 +65,10 @@ export const DataLinkEditor = memo(({ index, value, onChange, suggestions, isLas {isLast && (
- With data links you can reference data variables like series name, labels and values. Type CMD+Space, - CTRL+Space, or $ to open variable suggestions. + + With data links you can reference data variables like series name, labels and values. Type CMD+Space, + CTRL+Space, or $ to open variable suggestions. +
)} diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinkEditorModalContent.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinkEditorModalContent.tsx index 0a9e94e5f635..5348251f1f22 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinkEditorModalContent.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinkEditorModalContent.tsx @@ -2,6 +2,7 @@ import { useState } from 'react'; import { DataFrame, DataLink, VariableSuggestion } from '@grafana/data'; +import { Trans } from '../../../utils/i18n'; import { Button } from '../../Button'; import { Modal } from '../../Modal/Modal'; import { DataLinkEditor } from '../DataLinkEditor'; @@ -36,14 +37,14 @@ export const DataLinkEditorModalContent = ({ /> diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksInlineEditor.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksInlineEditor.tsx index c800ccea7c60..d7adcd961338 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksInlineEditor.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksInlineEditor.tsx @@ -6,6 +6,7 @@ import { ReactNode, useEffect, useState } from 'react'; import { DataFrame, DataLink, GrafanaTheme2, VariableSuggestion } from '@grafana/data'; import { useStyles2 } from '../../../themes'; +import { Trans } from '../../../utils/i18n'; import { Button } from '../../Button'; import { Modal } from '../../Modal/Modal'; @@ -94,7 +95,9 @@ export const DataLinksInlineEditor = ({ if (showOneClick) { return (
- One-click link + + One-click link + {linkJSX}
); @@ -159,7 +162,7 @@ export const DataLinksInlineEditor = ({ )} ); diff --git a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksListItem.tsx b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksListItem.tsx index 6b172810c22f..b245c7500a97 100644 --- a/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksListItem.tsx +++ b/packages/grafana-ui/src/components/DataLinks/DataLinksInlineEditor/DataLinksListItem.tsx @@ -5,6 +5,7 @@ import { DataFrame, DataLink, GrafanaTheme2 } from '@grafana/data'; import { useStyles2 } from '../../../themes'; import { isCompactUrl } from '../../../utils'; +import { Trans } from '../../../utils/i18n'; import { FieldValidationMessage } from '../../Forms/FieldValidationMessage'; import { Icon } from '../../Icon/Icon'; import { IconButton } from '../../IconButton/IconButton'; @@ -51,7 +52,9 @@ export const DataLinksListItem = ({ link, onEdit, onRemove, index, itemKey }: Da {isCompactExploreUrl && ( - Explore data link may not work in the future. Please edit. + + Explore data link may not work in the future. Please edit. + )} diff --git a/packages/grafana-ui/src/components/DataLinks/FieldLinkList.tsx b/packages/grafana-ui/src/components/DataLinks/FieldLinkList.tsx index 2712c5b7af13..b9ca2e89b076 100644 --- a/packages/grafana-ui/src/components/DataLinks/FieldLinkList.tsx +++ b/packages/grafana-ui/src/components/DataLinks/FieldLinkList.tsx @@ -3,6 +3,7 @@ import { css } from '@emotion/css'; import { Field, GrafanaTheme2, LinkModel } from '@grafana/data'; import { useStyles2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Icon } from '../Icon/Icon'; import { DataLinkButton } from './DataLinkButton'; @@ -30,7 +31,9 @@ export function FieldLinkList({ links }: Props) { return ; })}
-

External links

+

+ External links +

{externalLinks.map((link, i) => ( diff --git a/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx index 0cab20711c7d..328ebd7c7fde 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/AlertingSettings.tsx @@ -1,6 +1,7 @@ import { DataSourceJsonData, DataSourcePluginOptionsEditorProps } from '@grafana/data'; import { InlineSwitch } from '../../components/Switch/Switch'; +import { Trans } from '../../utils/i18n'; import { InlineField } from '../Forms/InlineField'; export interface Props @@ -13,7 +14,9 @@ export interface AlertingConfig extends DataSourceJsonData { export function AlertingSettings({ options, onOptionsChange }: Props): JSX.Element { return ( <> -

Alerting

+

+ Alerting +

diff --git a/packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx b/packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx index 8b574aeb4fd2..8f460924798a 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx @@ -1,5 +1,6 @@ import { ChangeEvent, MouseEvent } from 'react'; +import { Trans } from '../../utils/i18n'; import { Button } from '../Button'; import { InlineField } from '../Forms/InlineField'; import { InlineFieldRow } from '../Forms/InlineFieldRow'; @@ -27,7 +28,7 @@ export const CertificationKey = ({ hasCert, label, onChange, onClick, placeholde {hasCert && ( )} diff --git a/packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx index fe7f9d9d1b70..953e14c88e73 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx @@ -5,6 +5,7 @@ import { PureComponent } from 'react'; import { DataSourceSettings } from '@grafana/data'; import { useStyles2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Button } from '../Button'; import { FormField } from '../FormField/FormField'; import { Icon } from '../Icon/Icon'; @@ -199,7 +200,9 @@ export class CustomHeadersSettings extends PureComponent { return (
-
Custom HTTP Headers
+
+ Custom HTTP Headers +
{headers.map((header, i) => ( @@ -225,7 +228,7 @@ export class CustomHeadersSettings extends PureComponent { this.onHeaderAdd(); }} > - Add header + Add header
)} diff --git a/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx index 9d092fd0abdc..fbdd7b2bd011 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx @@ -5,6 +5,7 @@ import { SelectableValue } from '@grafana/data'; import { selectors } from '@grafana/e2e-selectors'; import { useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Alert } from '../Alert/Alert'; import { FormField } from '../FormField/FormField'; import { InlineFormLabel } from '../FormLabel/FormLabel'; @@ -43,23 +44,33 @@ const HttpAccessHelp = () => { return (

- Access mode controls how requests to the data source will be handled. - -  Server - {' '} - should be the preferred way if nothing else is stated. + + Access mode controls how requests to the data source will be handled. + +  Server + {' '} + should be the preferred way if nothing else is stated. +

- Server access mode (Default): + + Server access mode (Default): +

- All requests will be made from the browser to Grafana backend/server which in turn will forward the requests to - the data source and by that circumvent possible Cross-Origin Resource Sharing (CORS) requirements. The URL needs - to be accessible from the grafana backend/server if you select this access mode. + + All requests will be made from the browser to Grafana backend/server which in turn will forward the requests + to the data source and by that circumvent possible Cross-Origin Resource Sharing (CORS) requirements. The URL + needs to be accessible from the grafana backend/server if you select this access mode. +

- Browser access mode: + + Browser access mode: +

- All requests will be made from the browser directly to the data source and may be subject to Cross-Origin - Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser if you select this access - mode. + + All requests will be made from the browser directly to the data source and may be subject to Cross-Origin + Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser if you select this + access mode. +

); @@ -119,7 +130,9 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => { case 'direct': urlTooltip = ( <> - Your access method is Browser, this means the URL needs to be accessible from the browser. + + Your access method is Browser, this means the URL needs to be accessible from the browser. + {urlDocs} ); @@ -127,14 +140,23 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => { case 'proxy': urlTooltip = ( <> - Your access method is Server, this means the URL needs to be accessible from the grafana - backend/server. + + Your access method is Server, this means the URL needs to be accessible from the grafana + backend/server. + {urlDocs} ); break; default: - urlTooltip = <>Specify a complete HTTP URL (for example http://your_server:8080) {urlDocs}; + urlTooltip = ( + <> + + Specify a complete HTTP URL (for example http://your_server:8080) + + {urlDocs} + + ); } const accessSelect = ( @@ -175,7 +197,9 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => { return (
<> -

HTTP

+

+ HTTP +

{ className="gf-form-label query-keyword pointer" onClick={() => setIsAccessHelpVisible((isVisible) => !isVisible)} > - Help  - + + Help  + +
@@ -214,7 +240,7 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => { width={13} tooltip="Grafana proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source." > - Allowed cookies + Allowed cookies { <> -

Auth

+

+ Auth +

@@ -325,7 +353,9 @@ export const DataSourceHttpSettings = (props: HttpSettingsProps) => {
{dataSourceConfig.basicAuth && ( <> -
Basic Auth Details
+
+ Basic Auth Details +
diff --git a/packages/grafana-ui/src/components/DataSourceSettings/SecureSocksProxySettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/SecureSocksProxySettings.tsx index df2d0fe20787..eac841309cc6 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/SecureSocksProxySettings.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/SecureSocksProxySettings.tsx @@ -1,6 +1,7 @@ import { DataSourceJsonData, DataSourcePluginOptionsEditorProps } from '@grafana/data'; import { InlineSwitch } from '../../components/Switch/Switch'; +import { Trans } from '../../utils/i18n'; import { InlineField } from '../Forms/InlineField'; export interface Props @@ -16,7 +17,9 @@ export function SecureSocksProxySettings({ }: Props): JSX.Element { return ( <> -

Secure Socks Proxy

+

+ Secure Socks Proxy +

diff --git a/packages/grafana-ui/src/components/DataSourceSettings/TLSAuthSettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/TLSAuthSettings.tsx index acaa314e0e45..f26cb4bdee25 100644 --- a/packages/grafana-ui/src/components/DataSourceSettings/TLSAuthSettings.tsx +++ b/packages/grafana-ui/src/components/DataSourceSettings/TLSAuthSettings.tsx @@ -3,6 +3,7 @@ import * as React from 'react'; import { KeyValue } from '@grafana/data'; +import { Trans } from '../../utils/i18n'; import { FormField } from '../FormField/FormField'; import { Icon } from '../Icon/Icon'; import { Tooltip } from '../Tooltip/Tooltip'; @@ -58,7 +59,9 @@ export const TLSAuthSettings = ({ dataSourceConfig, onChange }: HttpSettingsBase }) )} > -
TLS/SSL Auth Details
+
+ TLS/SSL Auth Details +
diff --git a/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx b/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx index 25abe7efe25b..5e4c0d57ba46 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx +++ b/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx @@ -127,6 +127,8 @@ export function RelativeTimeRangePicker(props: RelativeTimeRangePickerProps) { setIsOpen(false); }; + const { from: timeOptionFrom, to: timeOptionTo } = timeOption; + return (
@@ -208,16 +212,26 @@ const TooltipContent = () => { return ( <>
- Supported formats: now-[digit]s/m/h/d/w + + Supported formats: now-[digit]s/m/h/d/w +
-
Example: to select a time range from 10 minutes ago to now
- From: now-10m To: now +
+ + Example: to select a time range from 10 minutes ago to now + +
+ + From: now-10m To: now +
- For more information see{' '} - - docs - - . + + For more information see{' '} + + docs + + . +
); diff --git a/packages/grafana-ui/src/components/FileDropzone/FileDropzone.tsx b/packages/grafana-ui/src/components/FileDropzone/FileDropzone.tsx index fe9ae54045a8..7b06f4780456 100644 --- a/packages/grafana-ui/src/components/FileDropzone/FileDropzone.tsx +++ b/packages/grafana-ui/src/components/FileDropzone/FileDropzone.tsx @@ -6,6 +6,7 @@ import { Accept, DropEvent, DropzoneOptions, FileError, FileRejection, useDropzo import { formattedValueToString, getValueFormat, GrafanaTheme2 } from '@grafana/data'; import { useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Alert } from '../Alert/Alert'; import { Icon } from '../Icon/Icon'; @@ -185,6 +186,7 @@ export function FileDropzone({ options, children, readAs, onLoad, fileListRender }; const renderErrorMessages = (errors: FileError[]) => { + const size = formattedValueToString(formattedSize); return (
@@ -193,7 +195,7 @@ export function FileDropzone({ options, children, readAs, onLoad, fileListRender case ErrorCode.FileTooLarge: return (
- File is larger than {formattedValueToString(formattedSize)} + File is larger than {{ size }}
); default: @@ -218,7 +220,7 @@ export function FileDropzone({ options, children, readAs, onLoad, fileListRender {fileErrors.length > 0 && renderErrorMessages(fileErrors)} {options?.maxSize && `Max file size: ${formattedValueToString(formattedSize)}`} - {options?.maxSize && options?.accept && |} + {options?.maxSize && options?.accept && {'|'}} {options?.accept && getAcceptedFileTypeText(options.accept)} {fileList} diff --git a/packages/grafana-ui/src/components/FileDropzone/FileListItem.tsx b/packages/grafana-ui/src/components/FileDropzone/FileListItem.tsx index 977debdfb46a..4b69dc72219e 100644 --- a/packages/grafana-ui/src/components/FileDropzone/FileListItem.tsx +++ b/packages/grafana-ui/src/components/FileDropzone/FileListItem.tsx @@ -4,6 +4,7 @@ import { formattedValueToString, getValueFormat, GrafanaTheme2 } from '@grafana/ import { useStyles2 } from '../../themes'; import { trimFileName } from '../../utils/file'; +import { Trans } from '../../utils/i18n'; import { Button } from '../Button'; import { Icon } from '../Icon/Icon'; import { IconButton } from '../IconButton/IconButton'; @@ -42,10 +43,13 @@ export function FileListItem({ file: customFile, removeFile }: FileListItemProps return ( <> - {Math.round((progress / file.size) * 100)}% + + {Math.round((progress / file.size) * 100)} + {'%'} + {abortUpload && ( )} diff --git a/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx b/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx index d026b88b466f..142299911440 100644 --- a/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx +++ b/packages/grafana-ui/src/components/FilterInput/FilterInput.tsx @@ -2,6 +2,7 @@ import { forwardRef, useRef, HTMLProps } from 'react'; import { escapeStringForRegex, unEscapeStringFromRegex } from '@grafana/data'; +import { Trans } from '../../utils/i18n'; import { useCombinedRefs } from '../../utils/useCombinedRefs'; import { Button } from '../Button'; import { Icon } from '../Icon/Icon'; @@ -31,7 +32,7 @@ export const FilterInput = forwardRef( e.stopPropagation(); }} > - Clear + Clear ) : null; diff --git a/packages/grafana-ui/src/components/PageLayout/PageToolbar.tsx b/packages/grafana-ui/src/components/PageLayout/PageToolbar.tsx index b76f75f50630..fa9a77c9d125 100644 --- a/packages/grafana-ui/src/components/PageLayout/PageToolbar.tsx +++ b/packages/grafana-ui/src/components/PageLayout/PageToolbar.tsx @@ -73,7 +73,12 @@ export const PageToolbar = memo( const titleEl = ( <> {title} - {section && / {section}} + {section && ( + + {' / '} + {section} + + )} ); @@ -109,7 +114,7 @@ export const PageToolbar = memo( {titleHref && ( - / + {'/'} )} diff --git a/packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx b/packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx index 297df8b49f32..77343c52fd47 100644 --- a/packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx +++ b/packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx @@ -3,6 +3,7 @@ import { omit } from 'lodash'; import { InputHTMLAttributes } from 'react'; import * as React from 'react'; +import { Trans } from '../../utils/i18n'; import { Button } from '../Button/Button'; import { FormField } from '../FormField/FormField'; import { Field } from '../Forms/Field'; @@ -74,7 +75,7 @@ export const SecretFormField = ({ {...omit(inputProps, 'value')} /> ) : ( diff --git a/packages/grafana-ui/src/components/Select/SelectBase.tsx b/packages/grafana-ui/src/components/Select/SelectBase.tsx index 0fe0dea431eb..6a1735543603 100644 --- a/packages/grafana-ui/src/components/Select/SelectBase.tsx +++ b/packages/grafana-ui/src/components/Select/SelectBase.tsx @@ -15,6 +15,7 @@ import Creatable from 'react-select/creatable'; import { SelectableValue, toOption } from '@grafana/data'; import { useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { Icon } from '../Icon/Icon'; import { Spinner } from '../Spinner/Spinner'; @@ -407,7 +408,7 @@ function defaultFormatCreateLabel(input: string) {
{input}
- Hit enter to add + Hit enter to add
); @@ -432,7 +433,7 @@ function CustomIndicatorsContainer(props: CustomIndicatorsContainerProps) { -1, 0, - (+{selectedValuesCount - maxVisibleValues}) + {`(+${selectedValuesCount - maxVisibleValues})`} ); diff --git a/packages/grafana-ui/src/components/Table/FilterList.tsx b/packages/grafana-ui/src/components/Table/FilterList.tsx index 0867631fe934..cce379ce575d 100644 --- a/packages/grafana-ui/src/components/Table/FilterList.tsx +++ b/packages/grafana-ui/src/components/Table/FilterList.tsx @@ -7,6 +7,7 @@ import { GrafanaTheme2, formattedValueToString, getValueFormat, SelectableValue import { ButtonSelect, Checkbox, FilterInput, Label, Stack } from '..'; import { useStyles2, useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; interface Props { values: SelectableValue[]; @@ -210,7 +211,9 @@ export const FilterList = ({ ) : ( - + )} ); diff --git a/packages/grafana-ui/src/components/Table/FilterPopup.tsx b/packages/grafana-ui/src/components/Table/FilterPopup.tsx index 9b3071d549a1..30a3cf0d0216 100644 --- a/packages/grafana-ui/src/components/Table/FilterPopup.tsx +++ b/packages/grafana-ui/src/components/Table/FilterPopup.tsx @@ -6,6 +6,7 @@ import { Field, GrafanaTheme2, SelectableValue } from '@grafana/data'; import { Button, ClickOutsideWrapper, IconButton, Label, Stack } from '..'; import { useStyles2, useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { FilterList } from './FilterList'; import { TableStyles } from './styles'; @@ -69,7 +70,9 @@ export const FilterPopup = ({ - + {clearFilterVisible && ( )} diff --git a/packages/grafana-ui/src/components/Table/Table.tsx b/packages/grafana-ui/src/components/Table/Table.tsx index 3002400db669..13b1385ace95 100644 --- a/packages/grafana-ui/src/components/Table/Table.tsx +++ b/packages/grafana-ui/src/components/Table/Table.tsx @@ -15,6 +15,7 @@ import { selectors } from '@grafana/e2e-selectors'; import { TableCellHeight } from '@grafana/schema'; import { useTheme2 } from '../../themes'; +import { Trans } from '../../utils/i18n'; import { CustomScrollbar } from '../CustomScrollbar/CustomScrollbar'; import { Pagination } from '../Pagination/Pagination'; @@ -280,6 +281,8 @@ export const Table = memo((props: Props) => { if (itemsRangeEnd > data.length) { itemsRangeEnd = data.length; } + const numRows = rows.length; + const displayedEnd = itemsRangeEnd < rows.length ? itemsRangeEnd : rows.length; paginationEl = (
{ /> {isSmall ? null : (
- {itemsRangeStart} - {itemsRangeEnd < rows.length ? itemsRangeEnd : rows.length} of {rows.length} rows + + {{ itemsRangeStart }} - {{ displayedEnd }} of {{ numRows }} rows +
)}
diff --git a/packages/grafana-ui/src/components/TableInputCSV/TableInputCSV.tsx b/packages/grafana-ui/src/components/TableInputCSV/TableInputCSV.tsx index 8070fd613b4b..c9559c8d07bb 100644 --- a/packages/grafana-ui/src/components/TableInputCSV/TableInputCSV.tsx +++ b/packages/grafana-ui/src/components/TableInputCSV/TableInputCSV.tsx @@ -7,6 +7,7 @@ import { DataFrame, CSVConfig, readCSV, GrafanaTheme2 } from '@grafana/data'; import { stylesFactory, withTheme2 } from '../../themes'; import { Themeable2 } from '../../types/theme'; +import { Trans } from '../../utils/i18n'; import { Icon } from '../Icon/Icon'; import { TextArea } from '../TextArea/TextArea'; @@ -81,10 +82,14 @@ export class UnThemedTableInputCSV extends PureComponent { {data && (