Make text attr in custom var type optional

Custom type variables in monitoring dashboard expects
the options to have a text attribute. This MR makes the
attribute optional and uses value as text in such cases

app/assets/javascripts/monitoring/stores/variable_mapping.js

@@ -47,7 +47,7 @@ const textAdvancedVariableParser = advTextVar => ({
  */
 const normalizeCustomVariableOptions = ({ default: defaultOpt = false, text, value }) => ({
   default: defaultOpt,
-  text,
+  text: text || value,
   value,
 });
 

spec/frontend/monitoring/mock_data.js

@@ -621,6 +621,19 @@ const templatingVariableTypes = {
           ],
         },
       },
+      withoutOptText: {
+        label: 'Options without text',
+        type: 'custom',
+        options: {
+          values: [
+            { value: 'value1' },
+            {
+              value: 'value2',
+              default: true,
+            },
+          ],
+        },
+      },
     },
   },
 };
@@ -709,6 +722,26 @@ const responseForAdvancedCustomVariableWithoutLabel = {
   },
 };
 
+const responseForAdvancedCustomVariableWithoutOptText = {
+  advCustomWithoutOptText: {
+    label: 'Options without text',
+    value: 'value2',
+    options: [
+      {
+        default: false,
+        text: 'value1',
+        value: 'value1',
+      },
+      {
+        default: true,
+        text: 'value2',
+        value: 'value2',
+      },
+    ],
+    type: 'custom',
+  },
+};
+
 const responseForAdvancedCustomVariable = {
   ...responseForSimpleCustomVariable,
   advCustomNormal: {
@@ -752,6 +785,9 @@ export const mockTemplatingData = {
   advCustomWithoutLabel: generateMockTemplatingData({
     advCustomWithoutLabel: templatingVariableTypes.custom.advanced.withoutLabel,
   }),
+  advCustomWithoutOptText: generateMockTemplatingData({
+    advCustomWithoutOptText: templatingVariableTypes.custom.advanced.withoutOptText,
+  }),
   simpleAndAdv: generateMockTemplatingData({
     simpleCustom: templatingVariableTypes.custom.simple,
     advCustomNormal: templatingVariableTypes.custom.advanced.normal,
@@ -773,6 +809,7 @@ export const mockTemplatingDataResponses = {
   advCustomWithoutOpts: responseForAdvancedCustomVariableWithoutOptions,
   advCustomWithoutType: {},
   advCustomWithoutLabel: responseForAdvancedCustomVariableWithoutLabel,
+  advCustomWithoutOptText: responseForAdvancedCustomVariableWithoutOptText,
   simpleAndAdv: responseForAdvancedCustomVariable,
   allVariableTypes: responsesForAllVariableTypes,
 };

spec/frontend/monitoring/store/variable_mapping_spec.js

@@ -3,19 +3,20 @@ import { mockTemplatingData, mockTemplatingDataResponses } from '../mock_data';
 
 describe('parseTemplatingVariables', () => {
   it.each`
-    case                                                                    | input                                       | expected
-    ${'Returns empty object for no dashboard input'}                        | ${{}}                                       | ${{}}
-    ${'Returns empty object for empty dashboard input'}                     | ${{ dashboard: {} }}                        | ${{}}
-    ${'Returns empty object for empty templating prop'}                     | ${mockTemplatingData.emptyTemplatingProp}   | ${{}}
-    ${'Returns empty object for empty variables prop'}                      | ${mockTemplatingData.emptyVariablesProp}    | ${{}}
-    ${'Returns parsed object for simple text variable'}                     | ${mockTemplatingData.simpleText}            | ${mockTemplatingDataResponses.simpleText}
-    ${'Returns parsed object for advanced text variable'}                   | ${mockTemplatingData.advText}               | ${mockTemplatingDataResponses.advText}
-    ${'Returns parsed object for simple custom variable'}                   | ${mockTemplatingData.simpleCustom}          | ${mockTemplatingDataResponses.simpleCustom}
-    ${'Returns parsed object for advanced custom variable without options'} | ${mockTemplatingData.advCustomWithoutOpts}  | ${mockTemplatingDataResponses.advCustomWithoutOpts}
-    ${'Returns parsed object for advanced custom variable without type'}    | ${mockTemplatingData.advCustomWithoutType}  | ${{}}
-    ${'Returns parsed object for advanced custom variable without label'}   | ${mockTemplatingData.advCustomWithoutLabel} | ${mockTemplatingDataResponses.advCustomWithoutLabel}
-    ${'Returns parsed object for simple and advanced custom variables'}     | ${mockTemplatingData.simpleAndAdv}          | ${mockTemplatingDataResponses.simpleAndAdv}
-    ${'Returns parsed object for all variable types'}                       | ${mockTemplatingData.allVariableTypes}      | ${mockTemplatingDataResponses.allVariableTypes}
+    case                                                                            | input                                         | expected
+    ${'Returns empty object for no dashboard input'}                                | ${{}}                                         | ${{}}
+    ${'Returns empty object for empty dashboard input'}                             | ${{ dashboard: {} }}                          | ${{}}
+    ${'Returns empty object for empty templating prop'}                             | ${mockTemplatingData.emptyTemplatingProp}     | ${{}}
+    ${'Returns empty object for empty variables prop'}                              | ${mockTemplatingData.emptyVariablesProp}      | ${{}}
+    ${'Returns parsed object for simple text variable'}                             | ${mockTemplatingData.simpleText}              | ${mockTemplatingDataResponses.simpleText}
+    ${'Returns parsed object for advanced text variable'}                           | ${mockTemplatingData.advText}                 | ${mockTemplatingDataResponses.advText}
+    ${'Returns parsed object for simple custom variable'}                           | ${mockTemplatingData.simpleCustom}            | ${mockTemplatingDataResponses.simpleCustom}
+    ${'Returns parsed object for advanced custom variable without options'}         | ${mockTemplatingData.advCustomWithoutOpts}    | ${mockTemplatingDataResponses.advCustomWithoutOpts}
+    ${'Returns parsed object for advanced custom variable for option without text'} | ${mockTemplatingData.advCustomWithoutOptText} | ${mockTemplatingDataResponses.advCustomWithoutOptText}
+    ${'Returns parsed object for advanced custom variable without type'}            | ${mockTemplatingData.advCustomWithoutType}    | ${{}}
+    ${'Returns parsed object for advanced custom variable without label'}           | ${mockTemplatingData.advCustomWithoutLabel}   | ${mockTemplatingDataResponses.advCustomWithoutLabel}
+    ${'Returns parsed object for simple and advanced custom variables'}             | ${mockTemplatingData.simpleAndAdv}            | ${mockTemplatingDataResponses.simpleAndAdv}
+    ${'Returns parsed object for all variable types'}                               | ${mockTemplatingData.allVariableTypes}        | ${mockTemplatingDataResponses.allVariableTypes}
   `('$case', ({ input, expected }) => {
     expect(parseTemplatingVariables(input?.dashboard?.templating)).toEqual(expected);
   });