Merge branch '332347-cleanup-policies-ui-do-not-show-nil-values' into 'master'

Show empty option for keep_n and older_than in Cleanup Policies

See merge request gitlab-org/gitlab!65722

app/assets/javascripts/packages_and_registries/settings/project/components/settings_form.vue

@@ -88,8 +88,6 @@ export default {
       return {
         ...this.value,
         cadence: this.findDefaultOption('cadence'),
-        keepN: this.findDefaultOption('keepN'),
-        olderThan: this.findDefaultOption('olderThan'),
       };
     },
     showLoadingIcon() {

app/assets/javascripts/packages_and_registries/settings/project/utils.js

@@ -11,11 +11,14 @@ export const olderThanTranslationGenerator = (variable) => n__('%d day', '%d day
 export const keepNTranslationGenerator = (variable) =>
   n__('%d tag per image name', '%d tags per image name', variable);
 
-export const optionLabelGenerator = (collection, translationFn) =>
-  collection.map((option) => ({
+export const optionLabelGenerator = (collection, translationFn) => {
+  const result = collection.map((option) => ({
     ...option,
     label: translationFn(option.variable),
   }));
+  result.unshift({ key: null, label: '' });
+  return result;
+};
 
 export const formOptionsGenerator = () => {
   return {

spec/frontend/packages_and_registries/settings/project/settings/__snapshots__/utils_spec.js.snap

@@ -32,6 +32,10 @@ Array [
 
 exports[`Utils formOptionsGenerator returns an object containing keepN 1`] = `
 Array [
+  Object {
+    "key": null,
+    "label": "",
+  },
   Object {
     "default": false,
     "key": "ONE_TAG",
@@ -73,6 +77,10 @@ Array [
 
 exports[`Utils formOptionsGenerator returns an object containing olderThan 1`] = `
 Array [
+  Object {
+    "key": null,
+    "label": "",
+  },
   Object {
     "default": false,
     "key": "SEVEN_DAYS",

spec/frontend/packages_and_registries/settings/project/settings/components/__snapshots__/settings_form_spec.js.snap

@@ -22,7 +22,7 @@ exports[`Settings Form Enable matches snapshot 1`] = `
 exports[`Settings Form Keep N matches snapshot 1`] = `
 <expiration-dropdown-stub
   data-testid="keep-n-dropdown"
-  formoptions="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]"
+  formoptions="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]"
   label="Keep the most recent:"
   name="keep-n"
   value="TEN_TAGS"
@@ -44,7 +44,7 @@ exports[`Settings Form Keep Regex matches snapshot 1`] = `
 exports[`Settings Form OlderThan matches snapshot 1`] = `
 <expiration-dropdown-stub
   data-testid="older-than-dropdown"
-  formoptions="[object Object],[object Object],[object Object],[object Object]"
+  formoptions="[object Object],[object Object],[object Object],[object Object],[object Object]"
   label="Remove tags older than:"
   name="older-than"
   value="FOURTEEN_DAYS"

spec/frontend/packages_and_registries/settings/project/settings/components/settings_form_spec.js

@@ -132,9 +132,9 @@ describe('Settings Form', () => {
     model              | finder                   | fieldName         | type          | defaultValue
     ${'enabled'}       | ${findEnableToggle}      | ${'Enable'}       | ${'toggle'}   | ${false}
     ${'cadence'}       | ${findCadenceDropdown}   | ${'Cadence'}      | ${'dropdown'} | ${'EVERY_DAY'}
-    ${'keepN'}         | ${findKeepNDropdown}     | ${'Keep N'}       | ${'dropdown'} | ${'TEN_TAGS'}
+    ${'keepN'}         | ${findKeepNDropdown}     | ${'Keep N'}       | ${'dropdown'} | ${''}
     ${'nameRegexKeep'} | ${findKeepRegexInput}    | ${'Keep Regex'}   | ${'textarea'} | ${''}
-    ${'olderThan'}     | ${findOlderThanDropdown} | ${'OlderThan'}    | ${'dropdown'} | ${'NINETY_DAYS'}
+    ${'olderThan'}     | ${findOlderThanDropdown} | ${'OlderThan'}    | ${'dropdown'} | ${''}
     ${'nameRegex'}     | ${findRemoveRegexInput}  | ${'Remove regex'} | ${'textarea'} | ${''}
   `('$fieldName', ({ model, finder, type, defaultValue }) => {
     it('matches snapshot', () => {
@@ -293,10 +293,10 @@ describe('Settings Form', () => {
           input: {
             cadence: 'EVERY_DAY',
             enabled: true,
-            keepN: 'TEN_TAGS',
+            keepN: null,
             nameRegex: 'asdasdssssdfdf',
             nameRegexKeep: 'sss',
-            olderThan: 'NINETY_DAYS',
+            olderThan: null,
             projectPath: 'path',
           },
         });

spec/frontend/packages_and_registries/settings/project/settings/utils_spec.js

@@ -12,6 +12,7 @@ describe('Utils', () => {
         olderThanTranslationGenerator,
       );
       expect(result).toEqual([
+        { key: null, label: '' },
         { variable: 1, label: '1 day' },
         { variable: 2, label: '2 days' },
       ]);