public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix grafana-sql package translations

Browse Source
This commit is contained in:
Ashley Harrison
2025-06-17 14:50:21 +01:00
parent b8a3814d52
commit 3a85160deb
21 changed files with 233 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/grafana-sql/src/components/ConfirmModal.tsx
+8 -6
View File
@@ -29,7 +29,7 @@ export function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }: ConfirmMod
<div className={styles.modalHeaderTitle}>
<Icon name="exclamation-triangle" size="lg" />
<span className={styles.titleText}>
<Trans i18nKey="components.confirm-modal.warning">Warning</Trans>
<Trans i18nKey="grafana-sql.components.confirm-modal.warning">Warning</Trans>
</span>
</div>
}
@@ -37,23 +37,25 @@ export function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }: ConfirmMod
isOpen={isOpen}
>
<p>
<Trans i18nKey="components.confirm-modal.builder-mode">
<Trans i18nKey="grafana-sql.components.confirm-modal.builder-mode">
Builder mode does not display changes made in code. The query builder will display the last changes you made
in builder mode.
</Trans>
</p>
<p>
<Trans i18nKey="components.confirm-modal.clipboard">Do you want to copy your code to the clipboard?</Trans>
<Trans i18nKey="grafana-sql.components.confirm-modal.clipboard">
Do you want to copy your code to the clipboard?
</Trans>
</p>
<Modal.ButtonRow>
<Button type="button" variant="secondary" onClick={onCancel} fill="outline">
<Trans i18nKey="components.confirm-modal.cancel">Cancel</Trans>
<Trans i18nKey="grafana-sql.components.confirm-modal.cancel">Cancel</Trans>
</Button>
<Button variant="destructive" type="button" onClick={onDiscard} ref={buttonRef}>
<Trans i18nKey="components.confirm-modal.discard-code-and-switch">Discard code and switch</Trans>
<Trans i18nKey="grafana-sql.components.confirm-modal.discard-code-and-switch">Discard code and switch</Trans>
</Button>
<Button variant="primary" onClick={onCopy}>
<Trans i18nKey="components.confirm-modal.copy-code-and-switch">Copy code and switch</Trans>
<Trans i18nKey="grafana-sql.components.confirm-modal.copy-code-and-switch">Copy code and switch</Trans>
</Button>
</Modal.ButtonRow>
</Modal>
packages/grafana-sql/src/components/DatasetSelector.tsx
+1 -1
View File
@@ -76,7 +76,7 @@ export const DatasetSelector = ({
return (
<Select
aria-label={t('components.dataset-selector.aria-label-dataset-selector', 'Dataset selector')}
aria-label={t('grafana-sql.querybuilder.dataset-selector.aria-label-dataset-selector', 'Dataset selector')}
inputId={inputId}
value={dataset}
options={state.value}
packages/grafana-sql/src/components/ErrorBoundary.tsx
+1 -1
View File
@@ -20,7 +20,7 @@ export class ErrorBoundary extends React.Component<React.PropsWithChildren<Props
if (this.state.hasError) {
const FallBack = this.props.fallBackComponent || (
<div>
<Trans i18nKey="components.error-boundary.fall-back.error">Error</Trans>
<Trans i18nKey="grafana-sql.components.error-boundary.fall-back.error">Error</Trans>
</div>
);
return FallBack;
packages/grafana-sql/src/components/QueryEditorLazy.tsx
+1 -1
View File
@@ -15,7 +15,7 @@ export function SqlQueryEditorLazy(props: SqlQueryEditorProps) {
<Suspense
fallback={
<LoadingPlaceholder
text={t('components.sql-query-editor-lazy.text-loading-editor', 'Loading editor')}
text={t('grafana-sql.querybuilder.sql-query-editor-lazy.text-loading-editor', 'Loading editor')}
className={styles.container}
/>
}
packages/grafana-sql/src/components/QueryHeader.tsx
+11 -11
View File
@@ -127,9 +127,9 @@ export function QueryHeader({
<>
<EditorHeader>
<InlineSelect
label={t('components.query-header.label-format', 'Format')}
label={t('grafana-sql.querybuilder.query-header.label-format', 'Format')}
value={query.format}
placeholder={t('components.query-header.placeholder-select-format', 'Select format')}
placeholder={t('grafana-sql.querybuilder.query-header.placeholder-select-format', 'Select format')}
menuShouldPortal
onChange={onFormatChange}
options={QUERY_FORMAT_OPTIONS}
@@ -139,7 +139,7 @@ export function QueryHeader({
<>
<InlineSwitch
id={`sql-filter-${htmlId}`}
label={t('components.query-header.label-filter', 'Filter')}
label={t('grafana-sql.querybuilder.query-header.label-filter', 'Filter')}
data-testid={selectors.components.SQLQueryEditor.headerFilterSwitch}
transparent={true}
showLabel={true}
@@ -160,7 +160,7 @@ export function QueryHeader({
<InlineSwitch
id={`sql-group-${htmlId}`}
label={t('components.query-header.label-group', 'Group')}
label={t('grafana-sql.querybuilder.query-header.label-group', 'Group')}
data-testid={selectors.components.SQLQueryEditor.headerGroupSwitch}
transparent={true}
showLabel={true}
@@ -181,7 +181,7 @@ export function QueryHeader({
<InlineSwitch
id={`sql-order-${htmlId}`}
label={t('components.query-header.label-order', 'Order')}
label={t('grafana-sql.querybuilder.query-header.label-order', 'Order')}
data-testid={selectors.components.SQLQueryEditor.headerOrderSwitch}
transparent={true}
showLabel={true}
@@ -202,7 +202,7 @@ export function QueryHeader({
<InlineSwitch
id={`sql-preview-${htmlId}`}
label={t('components.query-header.label-preview', 'Preview')}
label={t('grafana-sql.querybuilder.query-header.label-preview', 'Preview')}
data-testid={selectors.components.SQLQueryEditor.headerPreviewSwitch}
transparent={true}
showLabel={true}
@@ -227,13 +227,13 @@ export function QueryHeader({
{isQueryRunnable ? (
<Button icon="play" variant="primary" size="sm" onClick={() => onRunQuery()}>
<Trans i18nKey="components.query-header.run-query">Run query</Trans>
<Trans i18nKey="grafana-sql.components.query-header.run-query">Run query</Trans>
</Button>
) : (
<Tooltip
theme="error"
content={
<Trans i18nKey="components.query-header.content-invalid-query">
<Trans i18nKey="grafana-sql.components.query-header.content-invalid-query">
Your query is invalid. Check below for details. <br />
However, you can still run this query.
</Trans>
@@ -241,7 +241,7 @@ export function QueryHeader({
placement="top"
>
<Button icon="exclamation-triangle" variant="secondary" size="sm" onClick={() => onRunQuery()}>
<Trans i18nKey="components.query-header.run-query">Run query</Trans>
<Trans i18nKey="grafana-sql.components.query-header.run-query">Run query</Trans>
</Button>
</Tooltip>
)}
@@ -296,7 +296,7 @@ export function QueryHeader({
<Space v={0.5} />
<EditorRow>
{datasetDropdownIsAvailable() && (
<EditorField label={t('components.query-header.label-dataset', 'Dataset')} width={25}>
<EditorField label={t('grafana-sql.querybuilder.query-header.label-dataset', 'Dataset')} width={25}>
<DatasetSelector
db={db}
inputId={`sql-dataset-${htmlId}`}
@@ -307,7 +307,7 @@ export function QueryHeader({
/>
</EditorField>
)}
<EditorField label={t('components.query-header.label-table', 'Table')} width={25}>
<EditorField label={t('grafana-sql.querybuilder.query-header.label-table', 'Table')} width={25}>
<TableSelector
db={db}
inputId={`sql-tableselect-${htmlId}`}
packages/grafana-sql/src/components/TableSelector.tsx
+3 -3
View File
@@ -30,7 +30,7 @@ export const TableSelector = ({ db, dataset, table, className, onChange, inputId
<Select
className={className}
disabled={state.loading}
aria-label={t('components.table-selector.aria-label-table-selector', 'Table selector')}
aria-label={t('grafana-sql.querybuilder.table-selector.aria-label-table-selector', 'Table selector')}
inputId={inputId}
data-testid={selectors.components.SQLQueryEditor.headerTableSelector}
value={table}
@@ -40,8 +40,8 @@ export const TableSelector = ({ db, dataset, table, className, onChange, inputId
menuShouldPortal={true}
placeholder={
state.loading
? t('components.table-selector.placeholder-loading', 'Loading tables')
: t('components.table-selector.placeholder-select-table', 'Select table')
? t('grafana-sql.querybuilder.table-selector.placeholder-loading', 'Loading tables')
: t('grafana-sql.querybuilder.table-selector.placeholder-select-table', 'Select table')
}
allowCustomValue={true}
/>
packages/grafana-sql/src/components/configuration/ConnectionLimits.tsx
+11 -9
View File
@@ -84,18 +84,20 @@ export const ConnectionLimits = <T extends SQLConnectionLimits>(props: Props<T>)
const labelWidth = 40;
return (
<ConfigSubSection title={t('components.connection-limits.title-connection-limits', 'Connection limits')}>
<ConfigSubSection
title={t('grafana-sql.querybuilder.connection-limits.title-connection-limits', 'Connection limits')}
>
<Field
label={
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.connection-limits.max-open">Max open</Trans>
<Trans i18nKey="grafana-sql.components.connection-limits.max-open">Max open</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.connection-limits.content-max-open">
<Trans i18nKey="grafana-sql.components.connection-limits.content-max-open">
The maximum number of open connections to the database. If <i>Max idle connections</i> is greater
than 0 and the <i>Max open connections</i> is less than <i>Max idle connections</i>, then
<i>Max idle connections</i> will be reduced to match the <i>Max open connections</i> limit. If set
@@ -125,13 +127,13 @@ export const ConnectionLimits = <T extends SQLConnectionLimits>(props: Props<T>)
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.connection-limits.auto-max-idle">Auto max idle</Trans>
<Trans i18nKey="grafana-sql.components.connection-limits.auto-max-idle">Auto max idle</Trans>
</span>
<Tooltip
content={
<span>
<Trans
i18nKey="components.connection-limits.content-auto-max-idle"
i18nKey="grafana-sql.components.connection-limits.content-auto-max-idle"
values={{ defaultMaxIdle: config.sqlConnectionLimits.maxIdleConns }}
>
If enabled, automatically set the number of <i>Maximum idle connections</i> to the same value as
@@ -155,12 +157,12 @@ export const ConnectionLimits = <T extends SQLConnectionLimits>(props: Props<T>)
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.connection-limits.max-idle">Max idle</Trans>
<Trans i18nKey="grafana-sql.components.connection-limits.max-idle">Max idle</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.connection-limits.content-max-idle">
<Trans i18nKey="grafana-sql.components.connection-limits.content-max-idle">
The maximum number of connections in the idle connection pool.If <i>Max open connections</i> is
greater than 0 but less than the <i>Max idle connections</i>, then the <i>Max idle connections</i>{' '}
will be reduced to match the <i>Max open connections</i> limit. If set to 0, no idle connections
@@ -194,12 +196,12 @@ export const ConnectionLimits = <T extends SQLConnectionLimits>(props: Props<T>)
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.connection-limits.max-lifetime">Max lifetime</Trans>
<Trans i18nKey="grafana-sql.components.connection-limits.max-lifetime">Max lifetime</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.connection-limits.content-max-lifetime">
<Trans i18nKey="grafana-sql.components.connection-limits.content-max-lifetime">
The maximum amount of time in seconds a connection may be reused. If set to 0, connections are
reused forever.
</Trans>
packages/grafana-sql/src/components/configuration/TLSSecretsConfig.tsx
+8 -6
View File
@@ -27,14 +27,14 @@ export const TLSSecretsConfig = <T extends DataSourceJsonData, S extends {} = {}
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.tlssecrets-config.tlsssl-client-certificate">
<Trans i18nKey="grafana-sql.components.tlssecrets-config.tlsssl-client-certificate">
TLS/SSL Client Certificate
</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.tlssecrets-config.content-tlsssl-client-certificate">
<Trans i18nKey="grafana-sql.components.tlssecrets-config.content-tlsssl-client-certificate">
To authenticate with an TLS/SSL client certificate, provide the client certificate here.
</Trans>
</span>
@@ -65,12 +65,14 @@ export const TLSSecretsConfig = <T extends DataSourceJsonData, S extends {} = {}
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.tlssecrets-config.tlsssl-root-certificate">TLS/SSL Root Certificate</Trans>
<Trans i18nKey="grafana-sql.components.tlssecrets-config.tlsssl-root-certificate">
TLS/SSL Root Certificate
</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.tlssecrets-config.content-tlsssl-root-certificate">
<Trans i18nKey="grafana-sql.components.tlssecrets-config.content-tlsssl-root-certificate">
If the selected TLS/SSL mode requires a server root certificate, provide it here
</Trans>
</span>
@@ -101,12 +103,12 @@ export const TLSSecretsConfig = <T extends DataSourceJsonData, S extends {} = {}
<Label>
<Stack gap={0.5}>
<span>
<Trans i18nKey="components.tlssecrets-config.tlsssl-client-key">TLS/SSL Client Key</Trans>
<Trans i18nKey="grafana-sql.components.tlssecrets-config.tlsssl-client-key">TLS/SSL Client Key</Trans>
</span>
<Tooltip
content={
<span>
<Trans i18nKey="components.tlssecrets-config.content-tlsssl-client-key">
<Trans i18nKey="grafana-sql.components.tlssecrets-config.content-tlsssl-client-key">
To authenticate with a client TLS/SSL certificate, provide the key here.
</Trans>
</span>
packages/grafana-sql/src/components/query-editor-raw/QueryToolbox.tsx
+4 -4
View File
@@ -81,7 +81,7 @@ export function QueryToolbox({ showTools, onFormatCode, onExpand, isExpanded, ..
}}
name="brackets-curly"
size="xs"
tooltip={t('components.query-toolbox.tooltip-format-query', 'Format query')}
tooltip={t('grafana-sql.querybuilder.query-toolbox.tooltip-format-query', 'Format query')}
/>
)}
{onExpand && (
@@ -98,14 +98,14 @@ export function QueryToolbox({ showTools, onFormatCode, onExpand, isExpanded, ..
size="xs"
tooltip={
isExpanded
? t('components.query-toolbox.tooltip-collapse', 'Collapse editor')
: t('components.query-toolbox.tooltip-expand', 'Expand editor')
? t('grafana-sql.querybuilder.query-toolbox.tooltip-collapse', 'Collapse editor')
: t('grafana-sql.querybuilder.query-toolbox.tooltip-expand', 'Expand editor')
}
/>
)}
<Tooltip
content={t(
'components.query-toolbox.content-hit-ctrlcmdreturn-to-run-query',
'grafana-sql.querybuilder.query-toolbox.content-hit-ctrlcmdreturn-to-run-query',
'Hit CTRL/CMD+Return to run query'
)}
>
packages/grafana-sql/src/components/query-editor-raw/QueryValidator.tsx
+2 -2
View File
@@ -80,7 +80,7 @@ export function QueryValidator({ db, query, onValidate, range }: QueryValidatorP
{state.loading && (
<div className={styles.info}>
<Spinner inline={true} size="xs" />{' '}
<Trans i18nKey="components.query-validator.validating-query">Validating query...</Trans>
<Trans i18nKey="grafana-sql.components.query-validator.validating-query">Validating query...</Trans>
</div>
)}
{!state.loading && state.value && (
@@ -89,7 +89,7 @@ export function QueryValidator({ db, query, onValidate, range }: QueryValidatorP
{state.value.isValid && state.value.statistics && (
<div className={styles.valid}>
<Trans
i18nKey="components.query-validator.query-will-process"
i18nKey="grafana-sql.components.query-validator.query-will-process"
values={{ bytes: formattedValueToString(valueFormatter(state.value.statistics.TotalBytesProcessed)) }}
>
<Icon name="check" /> This query will process <strong>{'{{bytes}}'}</strong> when run.
packages/grafana-sql/src/components/query-editor-raw/RawEditor.tsx
+4 -2
View File
@@ -82,7 +82,7 @@ export function RawEditor({ db, query, onChange, onRunQuery, onValidate, queryTo
justifyContent: 'center',
}}
>
<Trans i18nKey="components.raw-editor.render-placeholder.editing-in-expanded-code-editor">
<Trans i18nKey="grafana-sql.components.raw-editor.render-placeholder.editing-in-expanded-code-editor">
Editing in expanded code editor
</Trans>
</div>
@@ -94,7 +94,9 @@ export function RawEditor({ db, query, onChange, onRunQuery, onValidate, queryTo
{isExpanded ? renderPlaceholder() : renderEditor()}
{isExpanded && (
<Modal
title={t('components.raw-editor.title-query-num', 'Query {{queryNum}}', { queryNum: query.refId })}
title={t('grafana-sql.querybuilder.raw-editor.title-query-num', 'Query {{queryNum}}', {
queryNum: query.refId,
})}
closeOnBackdropClick={false}
closeOnEscape={false}
className={styles.modal}
packages/grafana-sql/src/components/visual-query-builder/AwesomeQueryBuilder.tsx
+6 -6
View File
@@ -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.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.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})`;
packages/grafana-sql/src/components/visual-query-builder/GroupByRow.tsx
+2 -2
View File
@@ -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.querybuilder.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.querybuilder.make-render-column.render-column.title-remove-group-by-column',
'Remove group by column'
)}
icon="times"
packages/grafana-sql/src/components/visual-query-builder/OrderByRow.tsx
+4 -4
View File
@@ -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.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.order-by-row.label-offset', 'Offset')} optional width={25}>
<Input type="number" id={uniqueId('offset-')} value={sql.offset || ''} onChange={onOffsetChange} />
</EditorField>
)}
packages/grafana-sql/src/components/visual-query-builder/Preview.tsx
+2 -2
View File
@@ -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.querybuilder.preview.label-element.tooltip-copy-to-clipboard', 'Copy to clipboard')}
onClick={() => copyPreview(rawSql)}
name="copy"
/>
packages/grafana-sql/src/components/visual-query-builder/SelectColumn.tsx
+1 -1
View File
@@ -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.querybuilder.select-column.label-column', 'Column')} width={25}>
<Select
value={value}
data-testid={selectors.components.SQLQueryEditor.selectColumn}
packages/grafana-sql/src/components/visual-query-builder/SelectCustomFunctionParameters.tsx
+3 -3
View File
@@ -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.querybuilder.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.querybuilder.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.querybuilder.select-custom-function-parameters.title-add-parameter', 'Add parameter')}
/>
<InlineLabel className={styles.label}>)</InlineLabel>
</>
packages/grafana-sql/src/components/visual-query-builder/SelectRow.tsx
+11 -8
View File
@@ -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.querybuilder.select-row.label.time', 'time'), value: 'time' });
timeSeriesAliasOpts.push({ label: t('grafana-sql.querybuilder.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.querybuilder.select-row.aggregate-options.options.label.aggregations', 'Aggregations'),
options: [],
},
{ label: t('grafana-sql.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.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.querybuilder.select-row.title-add-column', 'Add column')}
size="md"
icon="plus"
className={styles.addButton}
packages/grafana-sql/src/components/visual-query-builder/VisualEditor.tsx
+2 -2
View File
@@ -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.querybuilder.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.querybuilder.visual-editor.label-group-by-column', 'Group by column')}>
<SQLGroupByRow fields={state.value || []} query={query} onQueryChange={onChange} db={db} />
</EditorField>
</EditorRow>
packages/grafana-sql/src/locales/en-US/grafana-sql.json
+147 -133
View File
@@ -1,148 +1,162 @@
{
"components": {
"confirm-modal": {
"builder-mode": "Builder mode does not display changes made in code. The query builder will display the last changes you made in builder mode.",
"cancel": "Cancel",
"clipboard": "Do you want to copy your code to the clipboard?",
"copy-code-and-switch": "Copy code and switch",
"discard-code-and-switch": "Discard code and switch",
"warning": "Warning"
},
"connection-limits": {
"auto-max-idle": "Auto max idle",
"content-auto-max-idle": "If enabled, automatically set the number of <1>Maximum idle connections</1> to the same value as<3> Max open connections</3>. If the number of maximum open connections is not set it will be set to the default ({{defaultMaxIdle}}).",
"content-max-idle": "The maximum number of connections in the idle connection pool.If <1>Max open connections</1> is greater than 0 but less than the <3>Max idle connections</3>, then the <5>Max idle connections</5> will be reduced to match the <8>Max open connections</8> limit. If set to 0, no idle connections are retained.",
"content-max-lifetime": "The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.",
"content-max-open": "The maximum number of open connections to the database. If <1>Max idle connections</1> is greater than 0 and the <3>Max open connections</3> is less than <5>Max idle connections</5>, then<7>Max idle connections</7> will be reduced to match the <9>Max open connections</9> limit. If set to 0, there is no limit on the number of open connections.",
"max-idle": "Max idle",
"max-lifetime": "Max lifetime",
"max-open": "Max open",
"title-connection-limits": "Connection limits"
},
"dataset-selector": {
"aria-label-dataset-selector": "Dataset selector"
},
"error-boundary": {
"fall-back": {
"error": "Error"
}
},
"get-custom-operators": {
"custom-operators": {
"label": {
"macros": "Macros"
}
}
},
"make-render-column": {
"render-column": {
"aria-label-group-by": "Group by",
"title-remove-group-by-column": "Remove group by column"
}
},
"order-by-row": {
"aria-label-order-by": "Order by",
"label-limit": "Limit",
"label-offset": "Offset",
"label-order-by": "Order by"
},
"preview": {
"label-element": {
"preview": "Preview",
"tooltip-copy-to-clipboard": "Copy to clipboard"
}
},
"query-header": {
"content-invalid-query": "Your query is invalid. Check below for details. <1></1>However, you can still run this query.",
"label-dataset": "Dataset",
"label-filter": "Filter",
"label-format": "Format",
"label-group": "Group",
"label-order": "Order",
"label-preview": "Preview",
"label-table": "Table",
"placeholder-select-format": "Select format",
"run-query": "Run query"
},
"query-toolbox": {
"content-hit-ctrlcmdreturn-to-run-query": "Hit CTRL/CMD+Return to run query",
"tooltip-collapse": "Collapse editor",
"tooltip-expand": "Expand editor",
"tooltip-format-query": "Format query"
},
"query-validator": {
"query-will-process": "<0></0> This query will process <2>{{bytes}}</2> when run.",
"validating-query": "Validating query..."
},
"raw-editor": {
"render-placeholder": {
"editing-in-expanded-code-editor": "Editing in expanded code editor"
"grafana-sql": {
"components": {
"confirm-modal": {
"builder-mode": "Builder mode does not display changes made in code. The query builder will display the last changes you made in builder mode.",
"cancel": "Cancel",
"clipboard": "Do you want to copy your code to the clipboard?",
"copy-code-and-switch": "Copy code and switch",
"discard-code-and-switch": "Discard code and switch",
"warning": "Warning"
},
"title-query-num": "Query {{queryNum}}"
},
"select-column": {
"label-column": "Column"
},
"select-custom-function-parameters": {
"aria-label-parameter": "Parameter {{index}} for column {{columnIndex}}",
"render-parameters": {
"params": {
"title-remove-parameter": "Remove parameter"
"connection-limits": {
"auto-max-idle": "Auto max idle",
"content-auto-max-idle": "If enabled, automatically set the number of <1>Maximum idle connections</1> to the same value as<3> Max open connections</3>. If the number of maximum open connections is not set it will be set to the default ({{defaultMaxIdle}}).",
"content-max-idle": "The maximum number of connections in the idle connection pool.If <1>Max open connections</1> is greater than 0 but less than the <3>Max idle connections</3>, then the <5>Max idle connections</5> will be reduced to match the <8>Max open connections</8> limit. If set to 0, no idle connections are retained.",
"content-max-lifetime": "The maximum amount of time in seconds a connection may be reused. If set to 0, connections are reused forever.",
"content-max-open": "The maximum number of open connections to the database. If <1>Max idle connections</1> is greater than 0 and the <3>Max open connections</3> is less than <5>Max idle connections</5>, then<7>Max idle connections</7> will be reduced to match the <9>Max open connections</9> limit. If set to 0, there is no limit on the number of open connections.",
"max-idle": "Max idle",
"max-lifetime": "Max lifetime",
"max-open": "Max open"
},
"error-boundary": {
"fall-back": {
"error": "Error"
}
},
"title-add-parameter": "Add parameter"
"preview": {
"label-element": {
"preview": "Preview"
}
},
"query-header": {
"content-invalid-query": "Your query is invalid. Check below for details. <1></1>However, you can still run this query.",
"run-query": "Run query"
},
"query-validator": {
"query-will-process": "<0></0> This query will process <2>{{bytes}}</2> when run.",
"validating-query": "Validating query..."
},
"raw-editor": {
"render-placeholder": {
"editing-in-expanded-code-editor": "Editing in expanded code editor"
}
},
"tlssecrets-config": {
"content-tlsssl-client-certificate": "To authenticate with an TLS/SSL client certificate, provide the client certificate here.",
"content-tlsssl-client-key": "To authenticate with a client TLS/SSL certificate, provide the key here.",
"content-tlsssl-root-certificate": "If the selected TLS/SSL mode requires a server root certificate, provide it here",
"tlsssl-client-certificate": "TLS/SSL Client Certificate",
"tlsssl-client-key": "TLS/SSL Client Key",
"tlsssl-root-certificate": "TLS/SSL Root Certificate"
}
},
"select-row": {
"aggregate-options": {
"options": {
"querybuilder": {
"connection-limits": {
"title-connection-limits": "Connection limits"
},
"dataset-selector": {
"aria-label-dataset-selector": "Dataset selector"
},
"get-custom-operators": {
"custom-operators": {
"label": {
"aggregations": "Aggregations",
"macros": "Macros"
}
}
},
"label": {
"time": "time",
"value": "value"
"make-render-column": {
"render-column": {
"aria-label-group-by": "Group by",
"title-remove-group-by-column": "Remove group by column"
}
},
"label-alias": "Alias",
"label-data-operations": "Data operations",
"title-add-column": "Add column",
"title-remove-column": "Remove column"
"order-by-row": {
"aria-label-order-by": "Order by",
"label-limit": "Limit",
"label-offset": "Offset",
"label-order-by": "Order by"
},
"preview": {
"label-element": {
"tooltip-copy-to-clipboard": "Copy to clipboard"
}
},
"query-header": {
"label-dataset": "Dataset",
"label-filter": "Filter",
"label-format": "Format",
"label-group": "Group",
"label-order": "Order",
"label-preview": "Preview",
"label-table": "Table",
"placeholder-select-format": "Select format"
},
"query-toolbox": {
"content-hit-ctrlcmdreturn-to-run-query": "Hit CTRL/CMD+Return to run query",
"tooltip-collapse": "Collapse editor",
"tooltip-expand": "Expand editor",
"tooltip-format-query": "Format query"
},
"raw-editor": {
"title-query-num": "Query {{queryNum}}"
},
"select-column": {
"label-column": "Column"
},
"select-custom-function-parameters": {
"aria-label-parameter": "Parameter {{index}} for column {{columnIndex}}",
"render-parameters": {
"params": {
"title-remove-parameter": "Remove parameter"
}
},
"title-add-parameter": "Add parameter"
},
"select-row": {
"aggregate-options": {
"options": {
"label": {
"aggregations": "Aggregations",
"macros": "Macros"
}
}
},
"label": {
"time": "time",
"value": "value"
},
"label-alias": "Alias",
"label-data-operations": "Data operations",
"title-add-column": "Add column",
"title-remove-column": "Remove column"
},
"settings": {
"aria-label-conjunction": "Conjunction",
"aria-label-field": "Field",
"aria-label-operator": "Operator",
"title-button-filter": "{{ buttonLabel }} filter"
},
"sql-query-editor-lazy": {
"text-loading-editor": "Loading editor"
},
"table-selector": {
"aria-label-table-selector": "Table selector",
"placeholder-loading": "Loading tables",
"placeholder-select-table": "Select table"
},
"visual-editor": {
"label-filter-by-column-value": "Filter by column value",
"label-group-by-column": "Group by column"
},
"widgets": {
"aria-label-macros-value-selector": "Macros value selector"
}
},
"settings": {
"aria-label-conjunction": "Conjunction",
"aria-label-field": "Field",
"aria-label-operator": "Operator",
"title-button-filter": "{{ buttonLabel }} filter"
},
"sql-query-editor-lazy": {
"text-loading-editor": "Loading editor"
},
"table-selector": {
"aria-label-table-selector": "Table selector",
"placeholder-loading": "Loading tables",
"placeholder-select-table": "Select table"
},
"tlssecrets-config": {
"content-tlsssl-client-certificate": "To authenticate with an TLS/SSL client certificate, provide the client certificate here.",
"content-tlsssl-client-key": "To authenticate with a client TLS/SSL certificate, provide the key here.",
"content-tlsssl-root-certificate": "If the selected TLS/SSL mode requires a server root certificate, provide it here",
"tlsssl-client-certificate": "TLS/SSL Client Certificate",
"tlsssl-client-key": "TLS/SSL Client Key",
"tlsssl-root-certificate": "TLS/SSL Root Certificate"
},
"visual-editor": {
"label-filter-by-column-value": "Filter by column value",
"label-group-by-column": "Group by column"
},
"widgets": {
"aria-label-macros-value-selector": "Macros value selector"
}
},
"utils": {
"get-columns-width-indices": {
"label-selected-columns": "Selected columns"
"utils": {
"get-columns-width-indices": {
"label-selected-columns": "Selected columns"
}
}
}
}
packages/grafana-sql/src/utils/getColumnsWithIndices.ts
+1 -1
View File
@@ -21,7 +21,7 @@ export function getColumnsWithIndices(query: SQLQuery, fields: SelectableValue[]
return [
{
value: '',
label: t('utils.get-columns-width-indices.label-selected-columns', 'Selected columns'),
label: t('grafana-sql.utils.get-columns-width-indices.label-selected-columns', 'Selected columns'),
options,
expanded: true,
},