chore: cleanup constant naming convention (#1596)

* chore: cleanup constant naming convention

* chore: update some more naming

* fix: add additional probe API server mapping

Author: g3john

src/components/App.tsx

@@ -13,7 +13,7 @@ import { MetaContextProvider } from 'contexts/MetaContext';
 import { PermissionsContextProvider } from 'contexts/PermissionsContext';
 import { SMDatasourceProvider } from 'contexts/SMDatasourceContext';
 import { queryClient } from 'data/queryClient';
-import { queryKeys as alertingQueryKeys } from 'data/useAlerts';
+import { QUERY_KEYS as alertingQueryKeys } from 'data/useAlerts';
 
 import { DevTools } from './DevTools';
 import { FeatureFlagProvider } from './FeatureFlagProvider';

src/components/CheckUsage.test.tsx

@@ -7,7 +7,7 @@ import { Check, CheckType } from 'types';
 
 import { ChecksterProvider } from './Checkster/contexts/ChecksterContext';
 import { CheckUsage } from './CheckUsage';
-import { fallbackCheckMap } from './constants';
+import { FALLBACK_CHECK_MAP } from './constants';
 
 function RenderWrapper() {
   return (
@@ -26,7 +26,7 @@ async function renderComponent(check?: Check) {
 
 describe('CheckUsage', () => {
   describe('existing check', () => {
-    const mockedCheck = fallbackCheckMap[CheckType.Http];
+    const mockedCheck = FALLBACK_CHECK_MAP[CheckType.Http];
     it('should render', async () => {
       const { container } = await renderComponent(mockedCheck);
       expect(container).toBeInTheDocument();

src/components/CheckUsage.tsx

@@ -32,15 +32,15 @@ const getStyles = (theme: GrafanaTheme2) => ({
   }),
 });
 
-const hideTelemetryForTypes = [CheckType.Scripted, CheckType.MultiHttp, CheckType.Browser];
+const HIDE_TELEMETRY_FOR_TYPES = [CheckType.Scripted, CheckType.MultiHttp, CheckType.Browser];
 
 export const CheckUsage = ({ checkType }: { checkType: CheckType }) => {
   const styles = useStyles2(getStyles);
   const { watch } = useFormContext<CheckFormValues>();
   const checkFormValues = watch();
   const usage = useUsageCalc([checkFormValuesToUsageCalcValues(checkFormValues)]);
 
-  const hideTelemetry = hideTelemetryForTypes.includes(checkType);
+  const hideTelemetry = HIDE_TELEMETRY_FOR_TYPES.includes(checkType);
 
   if (!usage) {
     return null;

src/components/Checkster/components/form/FormDnsRegExpValidationField.tsx

@@ -33,7 +33,7 @@ const newItem: RegexpItem = {
   inverted: false,
 };
 
-const selectInputWidth = 13; // times theme.spacing
+const SELECT_INPUT_WIDTH = 13; // times theme.spacing
 
 export function FormDnsRegExpValidationField({
   field,
@@ -65,7 +65,7 @@ export function FormDnsRegExpValidationField({
               return (
                 <Fragment key={fieldArray.id}>
                   <GenericInputSelectField
-                    width={selectInputWidth}
+                    width={SELECT_INPUT_WIDTH}
                     field={createPath(field, index, 'responseMatch')}
                     aria-label={`Match subject for validation ${index + 1}`}
                     options={DNS_RESPONSE_MATCH_OPTIONS}
@@ -110,7 +110,7 @@ function getStyles(theme: GrafanaTheme2) {
   return {
     inputGrid: css`
       display: grid;
-      grid-template-columns: minmax(auto, ${theme.spacing(selectInputWidth)}) auto minmax(auto, 60px) minmax(auto, 30px);
+      grid-template-columns: minmax(auto, ${theme.spacing(SELECT_INPUT_WIDTH)}) auto minmax(auto, 60px) minmax(auto, 30px);
       gap: ${theme.spacing(1)};
     `,
     centeredCell: css`

src/components/Checkster/components/form/FormMultiHttpVariablesField.tsx

@@ -15,7 +15,7 @@ interface FormMultiHttpVariablesFieldProps {
   field: `settings.multihttp.entries.${number}.variables`;
 }
 
-const expressionFieldPropsMap: Record<
+const EXPRESSION_FIELD_PROPS_MAP: Record<
   MultiHttpVariableType,
   Pick<ComponentProps<typeof GenericInputField>, 'label' | 'description' | 'placeholder'>
 > = {
@@ -49,7 +49,7 @@ const expressionFieldPropsMap: Record<
 };
 
 function getExpressionFieldProps(variableType: MultiHttpVariableType) {
-  return expressionFieldPropsMap[variableType];
+  return EXPRESSION_FIELD_PROPS_MAP[variableType];
 }
 
 export function FormMultiHttpVariablesField({ field }: FormMultiHttpVariablesFieldProps) {

src/components/Checkster/components/form/FormTcpQueryAndResponseField.tsx

@@ -20,7 +20,7 @@ interface FormTcpQueryAndResponseFieldProps {
   addButtonText?: string;
 }
 
-const newOption = { expect: '', send: '', startTLS: false };
+const NEW_OPTION = { expect: '', send: '', startTLS: false };
 
 export function FormTcpQueryAndResponseField({
   field,
@@ -92,7 +92,7 @@ export function FormTcpQueryAndResponseField({
           align-self: flex-start; // Stops button from being 100% width
         `}
         icon="plus"
-        onClick={() => append(newOption)}
+        onClick={() => append(NEW_OPTION)}
         variant="secondary"
         size="sm"
         type="button"

src/components/Checkster/components/form/sections/AlertingSection.tsx

@@ -5,11 +5,11 @@ import { FormSectionName } from '../../../types';
 import { FormSection } from '../FormSection';
 import { GenericAlertingContent } from '../layouts/GenericAlertingContent';
 
-const defaultAlertingFields = ['alerts'];
+const DEFAULT_ALERTING_FIELDS = ['alerts'];
 
 export function AlertingSection() {
   return (
-    <FormSection sectionName={FormSectionName.Alerting} fields={defaultAlertingFields}>
+    <FormSection sectionName={FormSectionName.Alerting} fields={DEFAULT_ALERTING_FIELDS}>
       <GenericAlertingContent />
     </FormSection>
   );

src/components/Checkster/components/form/sections/CheckSection.tsx

@@ -15,7 +15,7 @@ import { SCRIPTED_CHECK_FIELDS,ScriptedCheckContent } from '../layouts/ScriptedC
 import { TCP_REQUEST_OPTIONS_FIELDS,TcpCheckContent } from '../layouts/TcpCheckContent';
 import { TRACEROUTE_CHECK_FIELDS,TracerouteCheckContent } from '../layouts/TracerouteCheckContent';
 
-const defaultCheckFields = ['job', 'target'];
+const DEFAULT_CHECK_FIELDS = ['job', 'target'];
 
 function getCheckTypeFields(checkType: CheckType) {
   switch (checkType) {
@@ -36,11 +36,11 @@ function getCheckTypeFields(checkType: CheckType) {
     case CheckType.Browser:
       return BROWSER_CHECK_FIELDS;
     default:
-      return defaultCheckFields;
+      return DEFAULT_CHECK_FIELDS;
   }
 }
 
-const checkTypeLayoutMap: Record<CheckType, ComponentType> = {
+const CHECK_TYPE_LAYOUT_MAP: Record<CheckType, ComponentType> = {
   /* Protocol checks (blackbox exporter)*/
   [CheckType.Http]: HttpCheckContent,
   [CheckType.Ping]: PingCheckContent,
@@ -69,7 +69,7 @@ function getNavLabel(checkType: CheckType) {
 export function CheckSection() {
   const { checkType } = useChecksterContext();
 
-  const SectionComponent = checkTypeLayoutMap[checkType] ?? null;
+  const SectionComponent = CHECK_TYPE_LAYOUT_MAP[checkType] ?? null;
   const fields = getCheckTypeFields(checkType);
 
   return (

src/components/Checkster/components/form/sections/ExecutionSection.tsx

@@ -6,13 +6,13 @@ import { useChecksterContext } from '../../../contexts/ChecksterContext';
 import { FormSection } from '../FormSection';
 import { GenericExecutionContent } from '../layouts/GenericExecutionContent';
 
-const defaultExecutionFields = ['probes', 'frequency'];
+const DEFAULT_EXECUTION_FIELDS = ['probes', 'frequency'];
 
 export function ExecutionSection() {
   const { isK6Check } = useChecksterContext();
 
   return (
-    <FormSection sectionName={FormSectionName.Execution} fields={defaultExecutionFields}>
+    <FormSection sectionName={FormSectionName.Execution} fields={DEFAULT_EXECUTION_FIELDS}>
       <GenericExecutionContent publishAdvancedMetrics={!isK6Check} />
     </FormSection>
   );

src/components/Checkster/components/form/sections/UptimeSection.tsx

@@ -16,7 +16,7 @@ import { ScriptedUptimeContent } from '../layouts/ScriptedUptimeContent';
 import { TcpUptimeContent } from '../layouts/TcpUptimeContent';
 import { TracerouteUptimeContent } from '../layouts/TracerouteUptimeContent';
 
-const checkTypeLayoutMap: Record<CheckType, ComponentType> = {
+const CHECK_TYPE_LAYOUT_MAP: Record<CheckType, ComponentType> = {
   /* Protocol checks (blackbox exporter)*/
   [CheckType.Http]: HttpUptimeContent,
   [CheckType.Ping]: PingUptimeContent,
@@ -30,7 +30,7 @@ const checkTypeLayoutMap: Record<CheckType, ComponentType> = {
   [CheckType.Browser]: BrowserUptimeContent,
 };
 
-const defaultUptimeFields = ['timeout'];
+const DEFAULT_UPTIME_FIELDS = ['timeout'];
 
 function getCheckTypeFields(checkType: CheckType) {
   switch (checkType) {
@@ -39,14 +39,14 @@ function getCheckTypeFields(checkType: CheckType) {
     case CheckType.Http:
       return HTTP_UPTIME_FIELDS;
     default:
-      return defaultUptimeFields;
+      return DEFAULT_UPTIME_FIELDS;
   }
 }
 
 export function UptimeSection() {
   const { checkType } = useChecksterContext();
 
-  const SectionComponent = checkTypeLayoutMap[checkType] ?? null;
+  const SectionComponent = CHECK_TYPE_LAYOUT_MAP[checkType] ?? null;
   const fields = getCheckTypeFields(checkType);
 
   return (