From a7bb87d15dde794381578c13ebfc25b1bdb8a355 Mon Sep 17 00:00:00 2001 From: Christy O'Reilly Date: Tue, 21 Mar 2023 09:46:18 +0000 Subject: [PATCH] Chore: Refactor to introduce VARIABLE_PREFIX constant (#62980) Co-authored-by: Ivan Ortega Alba --- public/app/features/variables/constants.ts | 1 + .../features/variables/getAllVariableValuesForUrl.ts | 5 +++-- .../pickers/OptionsPicker/OptionsPicker.tsx | 5 +++-- .../features/variables/pickers/PickerRenderer.tsx | 3 ++- public/app/features/variables/state/actions.ts | 12 ++++++------ .../variables/textbox/TextBoxVariablePicker.tsx | 3 ++- public/app/features/variables/utils.ts | 6 +++--- 7 files changed, 20 insertions(+), 15 deletions(-) diff --git a/public/app/features/variables/constants.ts b/public/app/features/variables/constants.ts index 999f419d7c3..9bdd66116e0 100644 --- a/public/app/features/variables/constants.ts +++ b/public/app/features/variables/constants.ts @@ -3,3 +3,4 @@ export const ALL_VARIABLE_TEXT = 'All'; export const ALL_VARIABLE_VALUE = '$__all'; export const NONE_VARIABLE_TEXT = 'None'; export const NONE_VARIABLE_VALUE = ''; +export const VARIABLE_PREFIX = 'var-'; diff --git a/public/app/features/variables/getAllVariableValuesForUrl.ts b/public/app/features/variables/getAllVariableValuesForUrl.ts index 629904673ad..915541024c0 100644 --- a/public/app/features/variables/getAllVariableValuesForUrl.ts +++ b/public/app/features/variables/getAllVariableValuesForUrl.ts @@ -2,6 +2,7 @@ import { ScopedVars, UrlQueryMap } from '@grafana/data'; import { getTemplateSrv } from '@grafana/runtime'; import { variableAdapters } from './adapters'; +import { VARIABLE_PREFIX } from './constants'; export function getVariablesUrlParams(scopedVars?: ScopedVars): UrlQueryMap { const params: UrlQueryMap = {}; @@ -13,13 +14,13 @@ export function getVariablesUrlParams(scopedVars?: ScopedVars): UrlQueryMap { if (scopedVars[variable.name].skipUrlSync) { continue; } - params['var-' + variable.name] = scopedVars[variable.name].value; + params[VARIABLE_PREFIX + variable.name] = scopedVars[variable.name].value; } else { // @ts-ignore if (variable.skipUrlSync) { continue; } - params['var-' + variable.name] = variableAdapters.get(variable.type).getValueForUrl(variable as any); + params[VARIABLE_PREFIX + variable.name] = variableAdapters.get(variable.type).getValueForUrl(variable as any); } } diff --git a/public/app/features/variables/pickers/OptionsPicker/OptionsPicker.tsx b/public/app/features/variables/pickers/OptionsPicker/OptionsPicker.tsx index 942cdedd0e6..2429aa97dd1 100644 --- a/public/app/features/variables/pickers/OptionsPicker/OptionsPicker.tsx +++ b/public/app/features/variables/pickers/OptionsPicker/OptionsPicker.tsx @@ -6,6 +6,7 @@ import { LoadingState } from '@grafana/data'; import { ClickOutsideWrapper } from '@grafana/ui'; import { StoreState, ThunkDispatch } from 'app/types'; +import { VARIABLE_PREFIX } from '../../constants'; import { isMulti } from '../../guard'; import { getVariableQueryRunner } from '../../query/VariableQueryRunner'; import { formatVariableLabel } from '../../shared/formatVariable'; @@ -125,7 +126,7 @@ export const optionPickerFactory = ): ReactElement | nul return null; } - const elementId = `var-${variable.id}`; + const elementId = VARIABLE_PREFIX + variable.id; if (variable.description) { return ( diff --git a/public/app/features/variables/state/actions.ts b/public/app/features/variables/state/actions.ts index 41bcfce76c3..b2ce9dafc1c 100644 --- a/public/app/features/variables/state/actions.ts +++ b/public/app/features/variables/state/actions.ts @@ -24,7 +24,7 @@ import { AppNotification, StoreState, ThunkResult } from '../../../types'; import { getDatasourceSrv } from '../../plugins/datasource_srv'; import { getTemplateSrv, TemplateSrv } from '../../templating/template_srv'; import { variableAdapters } from '../adapters'; -import { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE } from '../constants'; +import { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE, VARIABLE_PREFIX } from '../constants'; import { cleanEditorState } from '../editor/reducer'; import { hasCurrent, @@ -359,7 +359,7 @@ export const processVariable = ( const variable = getVariable(identifier, getState()); await processVariableDependencies(variable, getState()); - const urlValue = queryParams['var-' + variable.name]; + const urlValue = queryParams[VARIABLE_PREFIX + variable.name]; if (urlValue !== void 0) { const stringUrlValue = ensureStringValues(urlValue); await variableAdapters.get(variable.type).setValueFromUrl(variable, stringUrlValue); @@ -705,7 +705,7 @@ export const templateVarsChangedInUrl = const variables = getVariablesByKey(key, getState()); for (const variable of variables) { - const key = `var-${variable.name}`; + const key = VARIABLE_PREFIX + variable.name; if (!vars.hasOwnProperty(key)) { // key not found quick exit continue; @@ -735,7 +735,7 @@ export const templateVarsChangedInUrl = } const filteredVars = variables.filter((v) => { - const key = `var-${v.name}`; + const key = VARIABLE_PREFIX + v.name; return vars.hasOwnProperty(key) && isVariableUrlValueDifferentFromCurrent(v, vars[key].value) && !isAdHoc(v); }); const varGraph = createGraph(variables); @@ -772,7 +772,7 @@ const getQueryWithVariables = (key: string, getState: () => StoreState): UrlQuer const queryParams = locationService.getSearchObject(); const queryParamsNew = Object.keys(queryParams) - .filter((key) => key.indexOf('var-') === -1) + .filter((key) => key.indexOf(VARIABLE_PREFIX) === -1) .reduce((obj, key) => { obj[key] = queryParams[key]; return obj; @@ -784,7 +784,7 @@ const getQueryWithVariables = (key: string, getState: () => StoreState): UrlQuer } const adapter = variableAdapters.get(variable.type); - queryParamsNew['var-' + variable.name] = adapter.getValueForUrl(variable); + queryParamsNew[VARIABLE_PREFIX + variable.name] = adapter.getValueForUrl(variable); } return queryParamsNew; diff --git a/public/app/features/variables/textbox/TextBoxVariablePicker.tsx b/public/app/features/variables/textbox/TextBoxVariablePicker.tsx index f6597b2a683..a9de57bba48 100644 --- a/public/app/features/variables/textbox/TextBoxVariablePicker.tsx +++ b/public/app/features/variables/textbox/TextBoxVariablePicker.tsx @@ -5,6 +5,7 @@ import { t } from 'app/core/internationalization'; import { useDispatch } from 'app/types'; import { variableAdapters } from '../adapters'; +import { VARIABLE_PREFIX } from '../constants'; import { VariablePickerProps } from '../pickers/types'; import { toKeyedAction } from '../state/keyedVariablesReducer'; import { changeVariableProp } from '../state/sharedReducer'; @@ -72,7 +73,7 @@ export function TextBoxVariablePicker({ variable, onVariableChange, readOnly }: disabled={readOnly} onKeyDown={onKeyDown} placeholder={t('variable.textbox.placeholder', 'Enter variable value')} - id={`var-${variable.id}`} + id={VARIABLE_PREFIX + variable.id} /> ); } diff --git a/public/app/features/variables/utils.ts b/public/app/features/variables/utils.ts index 735a83307f0..c0f2d3a865b 100644 --- a/public/app/features/variables/utils.ts +++ b/public/app/features/variables/utils.ts @@ -9,7 +9,7 @@ import { StoreState } from '../../types'; import { getTimeSrv } from '../dashboard/services/TimeSrv'; import { variableAdapters } from './adapters'; -import { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE } from './constants'; +import { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE, VARIABLE_PREFIX } from './constants'; import { getVariablesState } from './state/selectors'; import { KeyedVariableIdentifier, VariableIdentifier, VariablePayload } from './state/types'; import { QueryVariableModel, TransactionStatus, VariableModel, VariableRefresh, VariableWithOptions } from './types'; @@ -224,7 +224,7 @@ export function findTemplateVarChanges(query: UrlQueryMap, old: UrlQueryMap): Ex const changes: ExtendedUrlQueryMap = {}; for (const key in query) { - if (!key.startsWith('var-')) { + if (!key.startsWith(VARIABLE_PREFIX)) { continue; } @@ -238,7 +238,7 @@ export function findTemplateVarChanges(query: UrlQueryMap, old: UrlQueryMap): Ex } for (const key in old) { - if (!key.startsWith('var-')) { + if (!key.startsWith(VARIABLE_PREFIX)) { continue; }