Internationalisation: Scope package translation keys (#106844)

* fix grafana-prometheus markup

* fix grafana-sql package translations

* Revert "fix grafana-sql package translations"

This reverts commit 3a85160deb.

* fix grafana-sql translations
This commit is contained in:
Ashley Harrison
2025-06-17 15:43:32 +01:00
committed by GitHub
parent b48337a7c8
commit 6fcfa5f9e4
62 changed files with 963 additions and 772 deletions
@@ -69,7 +69,7 @@ export const widgets: Widgets = {
return (
<Select
id={props.id}
aria-label={t('components.widgets.aria-label-macros-value-selector', 'Macros value selector')}
aria-label={t('grafana-sql.components.widgets.aria-label-macros-value-selector', 'Macros value selector')}
menuShouldPortal
options={macros.map(toOption)}
value={props?.value}
@@ -125,7 +125,7 @@ export const settings: Settings = {
return (
<Select
id={conjProps?.id}
aria-label={t('components.settings.aria-label-conjunction', 'Conjunction')}
aria-label={t('grafana-sql.components.settings.aria-label-conjunction', 'Conjunction')}
data-testid={selectors.components.SQLQueryEditor.filterConjunction}
menuShouldPortal
options={conjProps?.conjunctionOptions ? Object.keys(conjProps?.conjunctionOptions).map(toOption) : undefined}
@@ -141,7 +141,7 @@ export const settings: Settings = {
<Select
id={fieldProps?.id}
width={25}
aria-label={t('components.settings.aria-label-field', 'Field')}
aria-label={t('grafana-sql.components.settings.aria-label-field', 'Field')}
data-testid={selectors.components.SQLQueryEditor.filterField}
menuShouldPortal
options={fieldProps?.items.map((f) => {
@@ -165,7 +165,7 @@ export const settings: Settings = {
return (
<Button
type="button"
title={t('components.settings.title-button-filter', '{{ buttonLabel }} filter', {
title={t('grafana-sql.components.settings.title-button-filter', '{{ buttonLabel }} filter', {
buttonLabel: buttonProps?.label,
})}
onClick={buttonProps?.onClick}
@@ -180,7 +180,7 @@ export const settings: Settings = {
return (
<Select
options={operatorProps?.items.map((op) => ({ label: op.label, value: op.key }))}
aria-label={t('components.settings.aria-label-operator', 'Operator')}
aria-label={t('grafana-sql.components.settings.aria-label-operator', 'Operator')}
data-testid={selectors.components.SQLQueryEditor.filterOperator}
menuShouldPortal
value={operatorProps?.selectedKey}
@@ -304,7 +304,7 @@ function getCustomOperators(config: BasicConfig) {
sqlFormatOp: customSqlNotInFormatter,
},
[Op.MACROS]: {
label: t('components.get-custom-operators.custom-operators.label.macros', 'Macros'),
label: t('grafana-sql.components.get-custom-operators.custom-operators.label.macros', 'Macros'),
sqlFormatOp: (field: string, _operator: string, value: string | string[] | ImmutableList<string>) => {
if (value === TIME_FILTER) {
return `$__timeFilter(${field})`;
@@ -47,14 +47,14 @@ function makeRenderColumn({ options }: { options?: Array<SelectableValue<string>
<InputGroup>
<Select
value={item.property?.name ? toOption(item.property.name) : null}
aria-label={t('components.make-render-column.render-column.aria-label-group-by', 'Group by')}
aria-label={t('grafana-sql.components.make-render-column.render-column.aria-label-group-by', 'Group by')}
options={options}
menuShouldPortal
onChange={({ value }) => value && onChangeItem(setGroupByField(value))}
/>
<AccessoryButton
title={t(
'components.make-render-column.render-column.title-remove-group-by-column',
'grafana-sql.components.make-render-column.render-column.title-remove-group-by-column',
'Remove group by column'
)}
icon="times"
@@ -60,10 +60,10 @@ export function OrderByRow({ sql, onSqlChange, columns, showOffset }: OrderByRow
return (
<>
<EditorField label={t('components.order-by-row.label-order-by', 'Order by')} width={25}>
<EditorField label={t('grafana-sql.components.order-by-row.label-order-by', 'Order by')} width={25}>
<InputGroup>
<Select
aria-label={t('components.order-by-row.aria-label-order-by', 'Order by')}
aria-label={t('grafana-sql.components.order-by-row.aria-label-order-by', 'Order by')}
options={columns}
value={sql.orderBy?.property.name ? toOption(sql.orderBy.property.name) : null}
isClearable
@@ -81,11 +81,11 @@ export function OrderByRow({ sql, onSqlChange, columns, showOffset }: OrderByRow
/>
</InputGroup>
</EditorField>
<EditorField label={t('components.order-by-row.label-limit', 'Limit')} optional width={25}>
<EditorField label={t('grafana-sql.components.order-by-row.label-limit', 'Limit')} optional width={25}>
<Input type="number" min={0} id={uniqueId('limit-')} value={sql.limit || ''} onChange={onLimitChange} />
</EditorField>
{showOffset && (
<EditorField label={t('components.order-by-row.label-offset', 'Offset')} optional width={25}>
<EditorField label={t('grafana-sql.components.order-by-row.label-offset', 'Offset')} optional width={25}>
<Input type="number" id={uniqueId('offset-')} value={sql.offset || ''} onChange={onOffsetChange} />
</EditorField>
)}
@@ -28,10 +28,10 @@ export function Preview({ rawSql, datasourceType }: PreviewProps) {
const labelElement = (
<div className={styles.labelWrapper}>
<span className={styles.label}>
<Trans i18nKey="components.preview.label-element.preview">Preview</Trans>
<Trans i18nKey="grafana-sql.components.preview.label-element.preview">Preview</Trans>
</span>
<IconButton
tooltip={t('components.preview.label-element.tooltip-copy-to-clipboard', 'Copy to clipboard')}
tooltip={t('grafana-sql.components.preview.label-element.tooltip-copy-to-clipboard', 'Copy to clipboard')}
onClick={() => copyPreview(rawSql)}
name="copy"
/>
@@ -16,7 +16,7 @@ export function SelectColumn({ columns, onParameterChange, value }: Props) {
const selectInputId = useId();
return (
<EditorField label={t('components.select-column.label-column', 'Column')} width={25}>
<EditorField label={t('grafana-sql.components.select-column.label-column', 'Column')} width={25}>
<Select
value={value}
data-testid={selectors.components.SQLQueryEditor.selectColumn}
@@ -87,7 +87,7 @@ export function SelectCustomFunctionParameters({
onChange={(e) => onParameterChange(index)(e.currentTarget.value)}
value={param.name}
aria-label={t(
'components.select-custom-function-parameters.aria-label-parameter',
'grafana-sql.components.select-custom-function-parameters.aria-label-parameter',
'Parameter {{index}} for column {{columnIndex}}',
{ index, columnIndex }
)}
@@ -95,7 +95,7 @@ export function SelectCustomFunctionParameters({
addonAfter={
<Button
title={t(
'components.select-custom-function-parameters.render-parameters.params.title-remove-parameter',
'grafana-sql.components.select-custom-function-parameters.render-parameters.params.title-remove-parameter',
'Remove parameter'
)}
type="button"
@@ -127,7 +127,7 @@ export function SelectCustomFunctionParameters({
variant="secondary"
size="md"
icon="plus"
title={t('components.select-custom-function-parameters.title-add-parameter', 'Add parameter')}
title={t('grafana-sql.components.select-custom-function-parameters.title-add-parameter', 'Add parameter')}
/>
<InlineLabel className={styles.label}>)</InlineLabel>
</>
@@ -30,8 +30,8 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
// Add necessary alias options for time series format
// when that format has been selected
if (query.format === QueryFormat.Timeseries) {
timeSeriesAliasOpts.push({ label: t('components.select-row.label.time', 'time'), value: 'time' });
timeSeriesAliasOpts.push({ label: t('components.select-row.label.value', 'value'), value: 'value' });
timeSeriesAliasOpts.push({ label: t('grafana-sql.components.select-row.label.time', 'time'), value: 'time' });
timeSeriesAliasOpts.push({ label: t('grafana-sql.components.select-row.label.value', 'value'), value: 'value' });
}
const onAggregationChange = useCallback(
@@ -93,8 +93,11 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
const aggregateOptions = () => {
const options: Array<SelectableValue<string>> = [
{ label: t('components.select-row.aggregate-options.options.label.aggregations', 'Aggregations'), options: [] },
{ label: t('components.select-row.aggregate-options.options.label.macros', 'Macros'), options: [] },
{
label: t('grafana-sql.components.select-row.aggregate-options.options.label.aggregations', 'Aggregations'),
options: [],
},
{ label: t('grafana-sql.components.select-row.aggregate-options.options.label.macros', 'Macros'), options: [] },
];
for (const func of db.functions()) {
// Create groups for macros
@@ -113,7 +116,7 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
<div key={index}>
<Stack gap={2} alignItems="end">
<EditorField
label={t('components.select-row.label-data-operations', 'Data operations')}
label={t('grafana-sql.components.select-row.label-data-operations', 'Data operations')}
optional
width={25}
>
@@ -137,7 +140,7 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
db={db}
/>
<EditorField label={t('components.select-row.label-alias', 'Alias')} optional width={15}>
<EditorField label={t('grafana-sql.components.select-row.label-alias', 'Alias')} optional width={15}>
<Select
value={item.alias ? toOption(item.alias) : null}
inputId={`select-alias-${index}-${uniqueId()}`}
@@ -150,7 +153,7 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
/>
</EditorField>
<Button
title={t('components.select-row.title-remove-column', 'Remove column')}
title={t('grafana-sql.components.select-row.title-remove-column', 'Remove column')}
type="button"
icon="trash-alt"
variant="secondary"
@@ -164,7 +167,7 @@ export function SelectRow({ query, onQueryChange, db, columns }: SelectRowProps)
type="button"
onClick={addColumn}
variant="secondary"
title={t('components.select-row.title-add-column', 'Add column')}
title={t('grafana-sql.components.select-row.title-add-column', 'Add column')}
size="md"
icon="plus"
className={styles.addButton}
@@ -33,7 +33,7 @@ export const VisualEditor = ({ query, db, queryRowFilter, onChange, onValidate,
{queryRowFilter.filter && (
<EditorRow>
<EditorField
label={t('components.visual-editor.label-filter-by-column-value', 'Filter by column value')}
label={t('grafana-sql.components.visual-editor.label-filter-by-column-value', 'Filter by column value')}
optional
>
<SQLWhereRow fields={state.value || []} query={query} onQueryChange={onChange} db={db} />
@@ -42,7 +42,7 @@ export const VisualEditor = ({ query, db, queryRowFilter, onChange, onValidate,
)}
{queryRowFilter.group && (
<EditorRow>
<EditorField label={t('components.visual-editor.label-group-by-column', 'Group by column')}>
<EditorField label={t('grafana-sql.components.visual-editor.label-group-by-column', 'Group by column')}>
<SQLGroupByRow fields={state.value || []} query={query} onQueryChange={onChange} db={db} />
</EditorField>
</EditorRow>