From 43280a6dabc24cb8d9c68911afa34a9db9a7770f Mon Sep 17 00:00:00 2001 From: Ashley Harrison Date: Fri, 18 Jul 2025 09:40:57 +0100 Subject: [PATCH] Internationalisation: More markup following manual review (#108232) * mark up NestedFolderPiker root item * mark up fieldsbyframerefid * mark up time picker options * mark up field types --- .../RelativeTimeRangePicker.tsx | 5 +- .../DateTimePickers/TimeRangeInput.tsx | 4 +- .../DateTimePickers/TimeRangePicker.tsx | 4 +- .../TimeRangePicker/TimePickerFooter.tsx | 4 +- .../src/components/DateTimePickers/options.ts | 177 +++++++++++++----- .../MatchersUI/FieldTypeMatcherEditor.tsx | 48 ++++- .../MatchersUI/FieldsByFrameRefIdMatcher.tsx | 20 +- packages/grafana-ui/src/internal/index.ts | 2 +- .../NestedFolderPicker/NestedFolderPicker.tsx | 6 +- .../useFoldersQuery.test.tsx | 4 +- .../useFoldersQueryAppPlatform.ts | 4 +- .../useFoldersQueryLegacy.ts | 4 +- .../components/NestedFolderPicker/utils.ts | 8 +- .../ConvertFieldTypeTransformerEditor.tsx | 4 +- public/locales/en-US/grafana.json | 69 +++++++ 15 files changed, 273 insertions(+), 90 deletions(-) diff --git a/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx b/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx index 7e49593d860..f75c4f1f2c8 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx +++ b/packages/grafana-ui/src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx @@ -16,7 +16,7 @@ import { getInputStyles, Input } from '../../Input/Input'; import { ScrollContainer } from '../../ScrollContainer/ScrollContainer'; import { TimePickerTitle } from '../TimeRangePicker/TimePickerTitle'; import { TimeRangeList } from '../TimeRangePicker/TimeRangeList'; -import { quickOptions } from '../options'; +import { getQuickOptions } from '../options'; import { isRangeValid, @@ -39,8 +39,6 @@ type InputState = { validation: RangeValidation; }; -const validOptions = quickOptions.filter((o) => isRelativeFormat(o.from)); - /** * @internal */ @@ -57,6 +55,7 @@ export function RelativeTimeRangePicker(props: RelativeTimeRangePickerProps) { ref ); const { dialogProps } = useDialog({}, ref); + const validOptions = getQuickOptions().filter((o) => isRelativeFormat(o.from)); // the order of middleware is important! // see https://floating-ui.com/docs/arrow#order diff --git a/packages/grafana-ui/src/components/DateTimePickers/TimeRangeInput.tsx b/packages/grafana-ui/src/components/DateTimePickers/TimeRangeInput.tsx index 7ef005c42c6..67d3af9496a 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/TimeRangeInput.tsx +++ b/packages/grafana-ui/src/components/DateTimePickers/TimeRangeInput.tsx @@ -13,7 +13,7 @@ import { getInputStyles } from '../Input/Input'; import { TimePickerContent } from './TimeRangePicker/TimePickerContent'; import { TimeRangeLabel } from './TimeRangePicker/TimeRangeLabel'; import { WeekStart } from './WeekStartPicker'; -import { quickOptions } from './options'; +import { getQuickOptions } from './options'; import { isValidTimeRange } from './utils'; export interface TimeRangeInputProps { @@ -123,7 +123,7 @@ export const TimeRangeInput = ({ timeZone={timeZone} value={isValidTimeRange(value) ? value : getDefaultTimeRange()} onChange={onRangeChange} - quickOptions={quickOptions} + quickOptions={getQuickOptions()} onChangeTimeZone={onChangeTimeZone} className={styles.content} hideTimeZone={hideTimeZone} diff --git a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker.tsx b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker.tsx index 3888b76f6c4..926fcce5615 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker.tsx +++ b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker.tsx @@ -28,7 +28,7 @@ import { Tooltip } from '../Tooltip/Tooltip'; import { TimePickerContent } from './TimeRangePicker/TimePickerContent'; import { TimeZoneDescription } from './TimeZonePicker/TimeZoneDescription'; import { WeekStart } from './WeekStartPicker'; -import { quickOptions } from './options'; +import { getQuickOptions } from './options'; import { useTimeSync } from './utils/useTimeSync'; /** @public */ @@ -189,7 +189,7 @@ export function TimeRangePicker(props: TimeRangePickerProps) { fiscalYearStartMonth={fiscalYearStartMonth} value={value} onChange={onChange} - quickOptions={quickRanges || quickOptions} + quickOptions={quickRanges || getQuickOptions()} history={history} showHistory widthOverride={widthOverride} diff --git a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx index 69fe98c09d5..c59806cea13 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx +++ b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx @@ -18,7 +18,7 @@ import { TimeZonePicker } from '../TimeZonePicker'; import { TimeZoneDescription } from '../TimeZonePicker/TimeZoneDescription'; import { TimeZoneOffset } from '../TimeZonePicker/TimeZoneOffset'; import { TimeZoneTitle } from '../TimeZonePicker/TimeZoneTitle'; -import { monthOptions } from '../options'; +import { getMonthOptions } from '../options'; interface Props { timeZone?: TimeZone; @@ -146,7 +146,7 @@ export const TimePickerFooter = (props: Props) => { > { if (onChangeFiscalYearStartMonth) { onChangeFiscalYearStartMonth(value?.value ?? 0); diff --git a/packages/grafana-ui/src/components/DateTimePickers/options.ts b/packages/grafana-ui/src/components/DateTimePickers/options.ts index 8f64046cf41..5ef8ef5ab5a 100644 --- a/packages/grafana-ui/src/components/DateTimePickers/options.ts +++ b/packages/grafana-ui/src/components/DateTimePickers/options.ts @@ -1,57 +1,134 @@ import { TimeOption } from '@grafana/data'; +import { t } from '@grafana/i18n'; import { ComboboxOption } from '../Combobox/types'; -export const quickOptions: TimeOption[] = [ - { from: 'now-5m', to: 'now', display: 'Last 5 minutes' }, - { from: 'now-15m', to: 'now', display: 'Last 15 minutes' }, - { from: 'now-30m', to: 'now', display: 'Last 30 minutes' }, - { from: 'now-1h', to: 'now', display: 'Last 1 hour' }, - { from: 'now-3h', to: 'now', display: 'Last 3 hours' }, - { from: 'now-6h', to: 'now', display: 'Last 6 hours' }, - { from: 'now-12h', to: 'now', display: 'Last 12 hours' }, - { from: 'now-24h', to: 'now', display: 'Last 24 hours' }, - { from: 'now-2d', to: 'now', display: 'Last 2 days' }, - { from: 'now-7d', to: 'now', display: 'Last 7 days' }, - { from: 'now-30d', to: 'now', display: 'Last 30 days' }, - { from: 'now-90d', to: 'now', display: 'Last 90 days' }, - { from: 'now-6M', to: 'now', display: 'Last 6 months' }, - { from: 'now-1y', to: 'now', display: 'Last 1 year' }, - { from: 'now-2y', to: 'now', display: 'Last 2 years' }, - { from: 'now-5y', to: 'now', display: 'Last 5 years' }, - { from: 'now-1d/d', to: 'now-1d/d', display: 'Yesterday' }, - { from: 'now-2d/d', to: 'now-2d/d', display: 'Day before yesterday' }, - { from: 'now-7d/d', to: 'now-7d/d', display: 'This day last week' }, - { from: 'now-1w/w', to: 'now-1w/w', display: 'Previous week' }, - { from: 'now-1M/M', to: 'now-1M/M', display: 'Previous month' }, - { from: 'now-1Q/fQ', to: 'now-1Q/fQ', display: 'Previous fiscal quarter' }, - { from: 'now-1y/y', to: 'now-1y/y', display: 'Previous year' }, - { from: 'now-1y/fy', to: 'now-1y/fy', display: 'Previous fiscal year' }, - { from: 'now/d', to: 'now/d', display: 'Today' }, - { from: 'now/d', to: 'now', display: 'Today so far' }, - { from: 'now/w', to: 'now/w', display: 'This week' }, - { from: 'now/w', to: 'now', display: 'This week so far' }, - { from: 'now/M', to: 'now/M', display: 'This month' }, - { from: 'now/M', to: 'now', display: 'This month so far' }, - { from: 'now/y', to: 'now/y', display: 'This year' }, - { from: 'now/y', to: 'now', display: 'This year so far' }, - { from: 'now/fQ', to: 'now', display: 'This fiscal quarter so far' }, - { from: 'now/fQ', to: 'now/fQ', display: 'This fiscal quarter' }, - { from: 'now/fy', to: 'now', display: 'This fiscal year so far' }, - { from: 'now/fy', to: 'now/fy', display: 'This fiscal year' }, +export const getQuickOptions: () => TimeOption[] = () => [ + { from: 'now-5m', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-5-mins', 'Last 5 minutes') }, + { + from: 'now-15m', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.last-15-mins', 'Last 15 minutes'), + }, + { + from: 'now-30m', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.last-30-mins', 'Last 30 minutes'), + }, + { from: 'now-1h', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-1-hour', 'Last 1 hour') }, + { from: 'now-3h', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-3-hours', 'Last 3 hours') }, + { from: 'now-6h', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-6-hours', 'Last 6 hours') }, + { + from: 'now-12h', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.last-12-hours', 'Last 12 hours'), + }, + { + from: 'now-24h', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.last-24-hours', 'Last 24 hours'), + }, + { from: 'now-2d', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-2-days', 'Last 2 days') }, + { from: 'now-7d', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-7-days', 'Last 7 days') }, + { from: 'now-30d', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-30-days', 'Last 30 days') }, + { from: 'now-90d', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-90-days', 'Last 90 days') }, + { + from: 'now-6M', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.last-6-months', 'Last 6 months'), + }, + { from: 'now-1y', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-1-year', 'Last 1 year') }, + { from: 'now-2y', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-2-years', 'Last 2 years') }, + { from: 'now-5y', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.last-5-years', 'Last 5 years') }, + { from: 'now-1d/d', to: 'now-1d/d', display: t('grafana-ui.date-time-pickers.quick-options.yesterday', 'Yesterday') }, + { + from: 'now-2d/d', + to: 'now-2d/d', + display: t('grafana-ui.date-time-pickers.quick-options.day-before-yesterday', 'Day before yesterday'), + }, + { + from: 'now-7d/d', + to: 'now-7d/d', + display: t('grafana-ui.date-time-pickers.quick-options.this-day-last-week', 'This day last week'), + }, + { + from: 'now-1w/w', + to: 'now-1w/w', + display: t('grafana-ui.date-time-pickers.quick-options.previous-week', 'Previous week'), + }, + { + from: 'now-1M/M', + to: 'now-1M/M', + display: t('grafana-ui.date-time-pickers.quick-options.previous-month', 'Previous month'), + }, + { + from: 'now-1Q/fQ', + to: 'now-1Q/fQ', + display: t('grafana-ui.date-time-pickers.quick-options.previous-fiscal-quarter', 'Previous fiscal quarter'), + }, + { + from: 'now-1y/y', + to: 'now-1y/y', + display: t('grafana-ui.date-time-pickers.quick-options.previous-year', 'Previous year'), + }, + { + from: 'now-1y/fy', + to: 'now-1y/fy', + display: t('grafana-ui.date-time-pickers.quick-options.previous-fiscal-year', 'Previous fiscal year'), + }, + { from: 'now/d', to: 'now/d', display: t('grafana-ui.date-time-pickers.quick-options.today', 'Today') }, + { from: 'now/d', to: 'now', display: t('grafana-ui.date-time-pickers.quick-options.today-so-far', 'Today so far') }, + { from: 'now/w', to: 'now/w', display: t('grafana-ui.date-time-pickers.quick-options.this-week', 'This week') }, + { + from: 'now/w', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.this-week-so-far', 'This week so far'), + }, + { from: 'now/M', to: 'now/M', display: t('grafana-ui.date-time-pickers.quick-options.this-month', 'This month') }, + { + from: 'now/M', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.this-month-so-far', 'This month so far'), + }, + { from: 'now/y', to: 'now/y', display: t('grafana-ui.date-time-pickers.quick-options.this-year', 'This year') }, + { + from: 'now/y', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.this-year-so-far', 'This year so far'), + }, + { + from: 'now/fQ', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.this-fiscal-quarter-so-far', 'This fiscal quarter so far'), + }, + { + from: 'now/fQ', + to: 'now/fQ', + display: t('grafana-ui.date-time-pickers.quick-options.this-fiscal-quarter', 'This fiscal quarter'), + }, + { + from: 'now/fy', + to: 'now', + display: t('grafana-ui.date-time-pickers.quick-options.this-fiscal-year-so-far', 'This fiscal year so far'), + }, + { + from: 'now/fy', + to: 'now/fy', + display: t('grafana-ui.date-time-pickers.quick-options.this-fiscal-year', 'This fiscal year'), + }, ]; -export const monthOptions: Array> = [ - { label: 'January', value: 0 }, - { label: 'February', value: 1 }, - { label: 'March', value: 2 }, - { label: 'April', value: 3 }, - { label: 'May', value: 4 }, - { label: 'June', value: 5 }, - { label: 'July', value: 6 }, - { label: 'August', value: 7 }, - { label: 'September', value: 8 }, - { label: 'October', value: 9 }, - { label: 'November', value: 10 }, - { label: 'December', value: 11 }, +export const getMonthOptions: () => Array> = () => [ + { label: t('grafana-ui.date-time-pickers.month-options.label-january', 'January'), value: 0 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-february', 'February'), value: 1 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-march', 'March'), value: 2 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-april', 'April'), value: 3 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-may', 'May'), value: 4 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-june', 'June'), value: 5 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-july', 'July'), value: 6 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-august', 'August'), value: 7 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-september', 'September'), value: 8 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-october', 'October'), value: 9 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-november', 'November'), value: 10 }, + { label: t('grafana-ui.date-time-pickers.month-options.label-december', 'December'), value: 11 }, ]; diff --git a/packages/grafana-ui/src/components/MatchersUI/FieldTypeMatcherEditor.tsx b/packages/grafana-ui/src/components/MatchersUI/FieldTypeMatcherEditor.tsx index 129765470af..69736d2368d 100644 --- a/packages/grafana-ui/src/components/MatchersUI/FieldTypeMatcherEditor.tsx +++ b/packages/grafana-ui/src/components/MatchersUI/FieldTypeMatcherEditor.tsx @@ -27,20 +27,48 @@ FieldTypeMatcherEditor.displayName = 'FieldTypeMatcherEditor'; // Select options for all field types. // This is not eported to the published package, but used internally -export const allFieldTypeIconOptions: Array> = [ - { value: FieldType.number, label: 'Number', icon: getFieldTypeIconName(FieldType.number) }, - { value: FieldType.string, label: 'String', icon: getFieldTypeIconName(FieldType.string) }, - { value: FieldType.time, label: 'Time', icon: getFieldTypeIconName(FieldType.time) }, - { value: FieldType.boolean, label: 'Boolean', icon: getFieldTypeIconName(FieldType.boolean) }, - { value: FieldType.trace, label: 'Traces', icon: getFieldTypeIconName(FieldType.trace) }, - { value: FieldType.enum, label: 'Enum', icon: getFieldTypeIconName(FieldType.enum) }, - { value: FieldType.other, label: 'Other', icon: getFieldTypeIconName(FieldType.other) }, +export const getAllFieldTypeIconOptions: () => Array> = () => [ + { + value: FieldType.number, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-number', 'Number'), + icon: getFieldTypeIconName(FieldType.number), + }, + { + value: FieldType.string, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-string', 'String'), + icon: getFieldTypeIconName(FieldType.string), + }, + { + value: FieldType.time, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-time', 'Time'), + icon: getFieldTypeIconName(FieldType.time), + }, + { + value: FieldType.boolean, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-boolean', 'Boolean'), + icon: getFieldTypeIconName(FieldType.boolean), + }, + { + value: FieldType.trace, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-traces', 'Traces'), + icon: getFieldTypeIconName(FieldType.trace), + }, + { + value: FieldType.enum, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-enum', 'Enum'), + icon: getFieldTypeIconName(FieldType.enum), + }, + { + value: FieldType.other, + label: t('grafana-ui.matchers-ui.get-all-field-type-icon-options.label-other', 'Other'), + icon: getFieldTypeIconName(FieldType.other), + }, ]; const useFieldCounts = (data: DataFrame[]): Map => { return useMemo(() => { const counts: Map = new Map(); - for (const t of allFieldTypeIconOptions) { + for (const t of getAllFieldTypeIconOptions()) { counts.set(t.value!, 0); } for (const frame of data) { @@ -61,7 +89,7 @@ const useSelectOptions = (counts: Map, opt?: string): Array { let found = false; const options: Array> = []; - for (const t of allFieldTypeIconOptions) { + for (const t of getAllFieldTypeIconOptions()) { const count = counts.get(t.value!); const match = opt === t.value; if (count || match) { diff --git a/packages/grafana-ui/src/components/MatchersUI/FieldsByFrameRefIdMatcher.tsx b/packages/grafana-ui/src/components/MatchersUI/FieldsByFrameRefIdMatcher.tsx index 3a7b7146c43..87175cbb057 100644 --- a/packages/grafana-ui/src/components/MatchersUI/FieldsByFrameRefIdMatcher.tsx +++ b/packages/grafana-ui/src/components/MatchersUI/FieldsByFrameRefIdMatcher.tsx @@ -199,7 +199,9 @@ function getListOfQueryRefIds(data: DataFrame[]): Array> for (const [refId, frames] of queries.entries()) { values.push({ value: refId, - label: `Query: ${refId ?? '(missing refId)'}`, + label: refId + ? t('grafana-ui.matchers-ui.get-list-of-query-ref-ids.label', 'Query: {{refId}}', { refId }) + : t('grafana-ui.matchers-ui.get-list-of-query-ref-ids.label-missing-ref-id', 'Query: (missing refId)'), description: getFramesDescription(frames), }); } @@ -208,11 +210,17 @@ function getListOfQueryRefIds(data: DataFrame[]): Array> } function getFramesDescription(frames: DataFrame[]): string { - return `Frames (${frames.length}): - ${frames - .slice(0, Math.min(3, frames.length)) - .map((x) => getFrameDisplayName(x)) - .join(', ')} ${frames.length > 3 ? '...' : ''}`; + return t( + 'grafana-ui.matchers-ui.get-list-of-query-ref-ids.description', + 'Frames ({{framesCount}}): {{framesNames}}', + { + framesCount: frames.length, + framesNames: `${frames + .slice(0, Math.min(3, frames.length)) + .map((x) => getFrameDisplayName(x)) + .join(', ')} ${frames.length > 3 ? '...' : ''}`, + } + ); } /** diff --git a/packages/grafana-ui/src/internal/index.ts b/packages/grafana-ui/src/internal/index.ts index 3cffdd2cf92..54bf72d16b0 100644 --- a/packages/grafana-ui/src/internal/index.ts +++ b/packages/grafana-ui/src/internal/index.ts @@ -45,7 +45,7 @@ export { } from '../components/MatchersUI/utils'; export type { FieldMatcherUIRegistryItem } from '../components/MatchersUI/types'; export { RefIDMultiPicker, RefIDPicker, stringsToRegexp } from '../components/MatchersUI/FieldsByFrameRefIdMatcher'; -export { allFieldTypeIconOptions } from '../components/MatchersUI/FieldTypeMatcherEditor'; +export { getAllFieldTypeIconOptions } from '../components/MatchersUI/FieldTypeMatcherEditor'; export { getStyles as getSliderStyles } from '../components/Slider/styles'; export { getSelectStyles } from '../components/Select/getSelectStyles'; diff --git a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx index 38d241c61e2..b1ceef4d2e7 100644 --- a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx +++ b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx @@ -22,7 +22,7 @@ import { getDOMId, NestedFolderList } from './NestedFolderList'; import Trigger from './Trigger'; import { useFoldersQuery } from './useFoldersQuery'; import { useTreeInteractions } from './useTreeInteractions'; -import { ROOT_FOLDER_ITEM } from './utils'; +import { getRootFolderItem } from './utils'; export interface NestedFolderPickerProps { /* Folder UID to show as selected */ @@ -222,7 +222,7 @@ export function NestedFolderPicker({ // these options are used infrequently that its not a big deal if (!showRootFolder || excludeUIDs?.length) { flatTree = flatTree.filter((item) => { - if (!showRootFolder && item === ROOT_FOLDER_ITEM) { + if (!showRootFolder && item.item.uid === getRootFolderItem().item.uid) { return false; } @@ -266,7 +266,7 @@ export function NestedFolderPicker({ let label = selectedFolder.data?.title; if (value === '') { - label = 'Dashboards'; + label = t('browse-dashboards.folder-picker.root-title', 'Dashboards'); } // Display the folder name and provisioning status when the picker is closed diff --git a/public/app/core/components/NestedFolderPicker/useFoldersQuery.test.tsx b/public/app/core/components/NestedFolderPicker/useFoldersQuery.test.tsx index d715d57c81d..18d83068b5e 100644 --- a/public/app/core/components/NestedFolderPicker/useFoldersQuery.test.tsx +++ b/public/app/core/components/NestedFolderPicker/useFoldersQuery.test.tsx @@ -7,7 +7,7 @@ import { DashboardsTreeItem } from 'app/features/browse-dashboards/types'; import { DashboardViewItem } from '../../../features/search/types'; import { useFoldersQuery } from './useFoldersQuery'; -import { ROOT_FOLDER_ITEM } from './utils'; +import { getRootFolderItem } from './utils'; const PAGE_SIZE = 10; @@ -105,7 +105,7 @@ describe('useFoldersQuery', () => { function testFn() { const { result } = renderHook(() => useFoldersQuery(true, {})); - expect(result.current.items).toEqual([ROOT_FOLDER_ITEM]); + expect(result.current.items).toEqual([getRootFolderItem()]); expect(result.current.isLoading).toBe(false); act(() => { result.current.requestNextPage(undefined); diff --git a/public/app/core/components/NestedFolderPicker/useFoldersQueryAppPlatform.ts b/public/app/core/components/NestedFolderPicker/useFoldersQueryAppPlatform.ts index 93817d6a9c8..4828417c10c 100644 --- a/public/app/core/components/NestedFolderPicker/useFoldersQueryAppPlatform.ts +++ b/public/app/core/components/NestedFolderPicker/useFoldersQueryAppPlatform.ts @@ -10,7 +10,7 @@ import { AnnoKeyManagerKind, ManagerKind } from '../../../features/apiserver/typ import { PAGE_SIZE } from '../../../features/browse-dashboards/api/services'; import { getPaginationPlaceholders } from '../../../features/browse-dashboards/state/utils'; -import { ROOT_FOLDER_ITEM } from './utils'; +import { getRootFolderItem } from './utils'; type GetFolderChildrenQuery = ReturnType>; type GetFolderChildrenRequest = { @@ -151,7 +151,7 @@ export function useFoldersQueryAppPlatform(isBrowsing: boolean, openFolders: Rec } const rootFlatTree = createFlatList(rootFolderToken, state.responseByParent[rootFolderToken], 1); - rootFlatTree.unshift(ROOT_FOLDER_ITEM); + rootFlatTree.unshift(getRootFolderItem()); return rootFlatTree; }, [state, isBrowsing, openFolders]); diff --git a/public/app/core/components/NestedFolderPicker/useFoldersQueryLegacy.ts b/public/app/core/components/NestedFolderPicker/useFoldersQueryLegacy.ts index 8381c61d1f2..84c540f7f71 100644 --- a/public/app/core/components/NestedFolderPicker/useFoldersQueryLegacy.ts +++ b/public/app/core/components/NestedFolderPicker/useFoldersQueryLegacy.ts @@ -11,7 +11,7 @@ import { PermissionLevelString } from 'app/types/acl'; import { FolderListItemDTO } from 'app/types/folders'; import { useDispatch, useSelector } from 'app/types/store'; -import { ROOT_FOLDER_ITEM } from './utils'; +import { getRootFolderItem } from './utils'; type ListFoldersQuery = ReturnType>; type ListFoldersRequest = QueryActionCreatorResult< @@ -179,7 +179,7 @@ export function useFoldersQueryLegacy( } const rootFlatTree = createFlatList(undefined, state.rootPages, 1); - rootFlatTree.unshift(ROOT_FOLDER_ITEM); + rootFlatTree.unshift(getRootFolderItem()); return rootFlatTree; }, [state, isBrowsing, openFolders]); diff --git a/public/app/core/components/NestedFolderPicker/utils.ts b/public/app/core/components/NestedFolderPicker/utils.ts index 9438485ce1d..1d92fc57f00 100644 --- a/public/app/core/components/NestedFolderPicker/utils.ts +++ b/public/app/core/components/NestedFolderPicker/utils.ts @@ -1,9 +1,11 @@ -export const ROOT_FOLDER_ITEM = { +import { t } from '@grafana/i18n'; + +export const getRootFolderItem = () => ({ isOpen: true, level: 0, item: { kind: 'folder' as const, - title: 'Dashboards', + title: t('browse-dashboards.folder-picker.root-title', 'Dashboards'), uid: '', }, -}; +}); diff --git a/public/app/features/transformers/editors/ConvertFieldTypeTransformerEditor.tsx b/public/app/features/transformers/editors/ConvertFieldTypeTransformerEditor.tsx index d437144b415..7f0c722188a 100644 --- a/public/app/features/transformers/editors/ConvertFieldTypeTransformerEditor.tsx +++ b/public/app/features/transformers/editors/ConvertFieldTypeTransformerEditor.tsx @@ -15,7 +15,7 @@ import { import { ConvertFieldTypeOptions, ConvertFieldTypeTransformerOptions } from '@grafana/data/internal'; import { t, Trans } from '@grafana/i18n'; import { Button, InlineField, InlineFieldRow, Input, Select } from '@grafana/ui'; -import { allFieldTypeIconOptions, FieldNamePicker } from '@grafana/ui/internal'; +import { getAllFieldTypeIconOptions, FieldNamePicker } from '@grafana/ui/internal'; import { findField } from 'app/features/dimensions/utils'; import { getTransformationContent } from '../docs/getTransformationContent'; @@ -34,7 +34,7 @@ export const ConvertFieldTypeTransformerEditor = ({ options, onChange, }: TransformerUIProps) => { - const allTypes = allFieldTypeIconOptions.filter((v) => v.value !== FieldType.trace); + const allTypes = getAllFieldTypeIconOptions().filter((v) => v.value !== FieldType.trace); const timeZoneOptions: Array> = getTimezoneOptions(true); // Format timezone options diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index bd097338400..88774ba133c 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -3559,6 +3559,7 @@ "empty-message": "No folders found", "error-title": "Error loading folders", "non-folder-item": "Non-folder {{itemKind}} {{itemUID}}", + "root-title": "Dashboards", "search-placeholder": "Search folders", "unknown-error": "Unknown error" }, @@ -7954,6 +7955,60 @@ "previous-label": "Previous month", "select-placeholder": "Select date/time" }, + "date-time-pickers": { + "month-options": { + "label-april": "April", + "label-august": "August", + "label-december": "December", + "label-february": "February", + "label-january": "January", + "label-july": "July", + "label-june": "June", + "label-march": "March", + "label-may": "May", + "label-november": "November", + "label-october": "October", + "label-september": "September" + }, + "quick-options": { + "day-before-yesterday": "Day before yesterday", + "last-1-hour": "Last 1 hour", + "last-1-year": "Last 1 year", + "last-12-hours": "Last 12 hours", + "last-15-mins": "Last 15 minutes", + "last-2-days": "Last 2 days", + "last-2-years": "Last 2 years", + "last-24-hours": "Last 24 hours", + "last-3-hours": "Last 3 hours", + "last-30-days": "Last 30 days", + "last-30-mins": "Last 30 minutes", + "last-5-mins": "Last 5 minutes", + "last-5-years": "Last 5 years", + "last-6-hours": "Last 6 hours", + "last-6-months": "Last 6 months", + "last-7-days": "Last 7 days", + "last-90-days": "Last 90 days", + "previous-fiscal-quarter": "Previous fiscal quarter", + "previous-fiscal-year": "Previous fiscal year", + "previous-month": "Previous month", + "previous-week": "Previous week", + "previous-year": "Previous year", + "this-day-last-week": "This day last week", + "this-fiscal-quarter": "This fiscal quarter", + "this-fiscal-quarter-so-far": "This fiscal quarter so far", + "this-fiscal-year": "This fiscal year", + "this-fiscal-year-so-far": "This fiscal year so far", + "this-month": "This month", + "this-month-so-far": "This month so far", + "this-week": "This week", + "this-week-so-far": "This week so far", + "this-year": "This year", + "this-year-so-far": "This year so far", + "today": "Today", + "today-so-far": "Today so far", + "yesterday": "Yesterday" + } + }, "drawer": { "close": "Close" }, @@ -8001,6 +8056,20 @@ "field-name-picker": { "placeholder": "Select field" }, + "get-all-field-type-icon-options": { + "label-boolean": "Boolean", + "label-enum": "Enum", + "label-number": "Number", + "label-other": "Other", + "label-string": "String", + "label-time": "Time", + "label-traces": "Traces" + }, + "get-list-of-query-ref-ids": { + "description": "Frames ({{framesCount}}): {{framesNames}}", + "label": "Query: {{refId}}", + "label-missing-ref-id": "Query: (missing refId)" + }, "name-field-name-by-regex-matcher": "Fields with name matching regex", "name-fields-by-query": "Fields returned by query", "name-fields-with-name": "Fields with name",