Run prettier on 30 files: 6 of 8

Mandatory not to break master. Automatically created with prettier.

app/assets/javascripts/tree.js

@@ -8,7 +8,7 @@ export default class TreeView {
     this.initKeyNav();
     // Code browser tree slider
     // Make the entire tree-item row clickable, but not if clicking another link (like a commit message)
-    $('.tree-content-holder .tree-item').on('click', function(e) {
+    $('.tree-content-holder .tree-item').on('click', function (e) {
       const $clickedEl = $(e.target);
       const path = $('.tree-item-file-name a', this).attr('href');
       if (!$clickedEl.is('a') && !$clickedEl.is('.str-truncated')) {
@@ -20,9 +20,7 @@ export default class TreeView {
       }
     });
     // Show the "Loading commit data" for only the first element
-    $('span.log_loading')
-      .first()
-      .removeClass('hide');
+    $('span.log_loading').first().removeClass('hide');
   }
 
   initKeyNav() {

app/assets/javascripts/users_select/index.js

@@ -75,7 +75,7 @@ function UsersSelect(currentUser, els, options = {}) {
       selectedId = selectedIdDefault;
     }
 
-    const assignYourself = function() {
+    const assignYourself = function () {
       const unassignedSelected = $dropdown
         .closest('.selectbox')
         .find(`input[name='${$dropdown.data('fieldName')}'][value=0]`);
@@ -108,17 +108,17 @@ function UsersSelect(currentUser, els, options = {}) {
       $block[0].addEventListener('assignYourself', assignYourself);
     }
 
-    const getSelectedUserInputs = function() {
+    const getSelectedUserInputs = function () {
       return $selectbox.find(`input[name="${$dropdown.data('fieldName')}"]`);
     };
 
-    const getSelected = function() {
+    const getSelected = function () {
       return getSelectedUserInputs()
         .map((index, input) => parseInt(input.value, 10))
         .get();
     };
 
-    const checkMaxSelect = function() {
+    const checkMaxSelect = function () {
       const maxSelect = $dropdown.data('maxSelect');
       if (maxSelect) {
         const selected = getSelected();
@@ -144,7 +144,7 @@ function UsersSelect(currentUser, els, options = {}) {
       }
     };
 
-    const getMultiSelectDropdownTitle = function(selectedUser, isSelected) {
+    const getMultiSelectDropdownTitle = function (selectedUser, isSelected) {
       const selectedUsers = getSelected().filter(u => u !== 0);
 
       const firstUser = getSelectedUserInputs()
@@ -201,7 +201,7 @@ function UsersSelect(currentUser, els, options = {}) {
       return assignTo(userSelect.currentUser.id);
     });
 
-    assignTo = function(selected) {
+    assignTo = function (selected) {
       const data = {};
       data[abilityName] = {};
       data[abilityName].assignee_id = selected != null ? selected : null;
@@ -694,7 +694,7 @@ function UsersSelect(currentUser, els, options = {}) {
   }
 }
 
-UsersSelect.prototype.initSelection = function(element, callback) {
+UsersSelect.prototype.initSelection = function (element, callback) {
   const id = $(element).val();
   if (id === '0') {
     const nullUser = {
@@ -706,7 +706,7 @@ UsersSelect.prototype.initSelection = function(element, callback) {
   }
 };
 
-UsersSelect.prototype.formatResult = function(user) {
+UsersSelect.prototype.formatResult = function (user) {
   let avatar = gon.default_avatar_url;
   if (user.avatar_url) {
     avatar = user.avatar_url;
@@ -728,11 +728,11 @@ UsersSelect.prototype.formatResult = function(user) {
   `;
 };
 
-UsersSelect.prototype.formatSelection = function(user) {
+UsersSelect.prototype.formatSelection = function (user) {
   return escape(user.name);
 };
 
-UsersSelect.prototype.user = function(user_id, callback) {
+UsersSelect.prototype.user = function (user_id, callback) {
   if (!/^\d+$/.test(user_id)) {
     return false;
   }
@@ -746,7 +746,7 @@ UsersSelect.prototype.user = function(user_id, callback) {
 
 // Return users list. Filtered by query
 // Only active users retrieved
-UsersSelect.prototype.users = function(query, options, callback) {
+UsersSelect.prototype.users = function (query, options, callback) {
   const url = this.buildUrl(this.usersPath);
   const params = {
     search: query,
@@ -755,8 +755,8 @@ UsersSelect.prototype.users = function(query, options, callback) {
   };
 
   const isMergeRequest = options.issuableType === 'merge_request';
-  const isEditMergeRequest = !options.issuableType && (options.iid && options.targetBranch);
-  const isNewMergeRequest = !options.issuableType && (!options.iid && options.targetBranch);
+  const isEditMergeRequest = !options.issuableType && options.iid && options.targetBranch;
+  const isNewMergeRequest = !options.issuableType && !options.iid && options.targetBranch;
 
   if (isMergeRequest || isEditMergeRequest || isNewMergeRequest) {
     params.merge_request_iid = options.iid || null;
@@ -772,14 +772,14 @@ UsersSelect.prototype.users = function(query, options, callback) {
   });
 };
 
-UsersSelect.prototype.buildUrl = function(url) {
+UsersSelect.prototype.buildUrl = function (url) {
   if (gon.relative_url_root != null) {
     url = gon.relative_url_root.replace(/\/$/, '') + url;
   }
   return url;
 };
 
-UsersSelect.prototype.renderRow = function(
+UsersSelect.prototype.renderRow = function (
   issuableType,
   user,
   selected,
@@ -815,7 +815,7 @@ UsersSelect.prototype.renderRow = function(
   `;
 };
 
-UsersSelect.prototype.renderRowAvatar = function(issuableType, user, img) {
+UsersSelect.prototype.renderRowAvatar = function (issuableType, user, img) {
   if (user.beforeDivider) {
     return img;
   }
@@ -831,7 +831,7 @@ UsersSelect.prototype.renderRowAvatar = function(issuableType, user, img) {
   </span>`;
 };
 
-UsersSelect.prototype.renderApprovalRules = function(elsClassName, approvalRules = []) {
+UsersSelect.prototype.renderApprovalRules = function (elsClassName, approvalRules = []) {
   const count = approvalRules.length;
 
   if (!gon.features?.reviewerApprovalRules || !elsClassName?.includes('reviewer') || !count) {

app/assets/javascripts/vue_merge_request_widget/components/deployment/memory_usage.vue

@@ -145,7 +145,7 @@ export default {
         <template #metricsLink="{ content }">
           <gl-link :href="metricsMonitoringUrl">{{ content }}</gl-link>
         </template>
-        <template #emphasis="{content}">
+        <template #emphasis="{ content }">
           <strong>{{ content }}</strong>
         </template>
         <template #memoryFrom>{{ memoryFrom }}</template>

app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue

@@ -142,7 +142,7 @@ export default {
         data-testid="ci-error-message"
       >
         <gl-sprintf :message="$options.errorText">
-          <template #link="{content}">
+          <template #link="{ content }">
             <gl-link :href="mrTroubleshootingDocsPath">{{ content }}</gl-link>
           </template>
         </gl-sprintf>

app/assets/javascripts/vue_merge_request_widget/components/mr_widget_suggest_pipeline.vue

@@ -86,12 +86,12 @@ export default {
           to create one.`)
           "
         >
-          <template #prefixToLink="{content}">
+          <template #prefixToLink="{ content }">
             <strong>
               {{ content }}
             </strong>
           </template>
-          <template #addPipelineLink="{content}">
+          <template #addPipelineLink="{ content }">
             <gl-link
               :href="pipelinePath"
               class="gl-ml-1"

app/assets/javascripts/vue_merge_request_widget/components/states/work_in_progress.vue

@@ -113,10 +113,18 @@ export default {
             },
           },
         })
-        .then(({ data: { mergeRequestSetWip: { mergeRequest: { title } } } }) => {
+        .then(
+          ({
+            data: {
+              mergeRequestSetWip: {
+                mergeRequest: { title },
+              },
+            },
+          }) => {
             createFlash(__('The merge request can now be merged.'), 'notice');
             $('.merge-request .detail-page-description .title').text(title);
-        })
+          },
+        )
         .catch(() => createFlash(__('Something went wrong. Please try again.')))
         .finally(() => {
           this.isMakingRequest = false;

app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue

@@ -166,7 +166,8 @@ export default {
       return (
         !this.mr.canRemoveSourceBranch &&
         this.mr.shouldRemoveSourceBranch &&
-        (!this.mr.isNothingToMergeState && !this.mr.isMergedState)
+        !this.mr.isNothingToMergeState &&
+        !this.mr.isMergedState
       );
     },
     shouldRenderCollaborationStatus() {

app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue

@@ -39,9 +39,7 @@ export default {
     <div class="file-content">
       <p class="gl-mt-3 file-info">
         {{ fileName }}
-        <template v-if="fileSize > 0">
-          ({{ fileSizeReadable }})
-        </template>
+        <template v-if="fileSize > 0"> ({{ fileSizeReadable }}) </template>
       </p>
       <a :href="path" class="btn btn-default" rel="nofollow" :download="fileName" target="_blank">
         <gl-icon :size="16" name="download" class="float-left gl-mr-3" />

app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue

@@ -95,9 +95,7 @@ export default {
       <template v-if="hasFileSize">
         {{ fileSizeReadable }}
       </template>
-      <template v-if="hasFileSize && hasDimensions">
-        |
-      </template>
+      <template v-if="hasFileSize && hasDimensions"> | </template>
       <template v-if="hasDimensions">
         <strong>{{ s__('ImageViewerDimensions|W') }}</strong
         >: {{ width }} | <strong>{{ s__('ImageViewerDimensions|H') }}</strong

app/assets/javascripts/vue_shared/components/deprecated_modal_2.vue

@@ -46,14 +46,10 @@ export default {
     },
   },
   mounted() {
-    $(this.$el)
-      .on('shown.bs.modal', this.opened)
-      .on('hidden.bs.modal', this.closed);
+    $(this.$el).on('shown.bs.modal', this.opened).on('hidden.bs.modal', this.closed);
   },
   beforeDestroy() {
-    $(this.$el)
-      .off('shown.bs.modal', this.opened)
-      .off('hidden.bs.modal', this.closed);
+    $(this.$el).off('shown.bs.modal', this.opened).off('hidden.bs.modal', this.closed);
   },
   methods: {
     emitCancel(event) {

app/assets/javascripts/vue_shared/components/file_icon/file_icon_map.js

@@ -593,15 +593,6 @@ const fileNameIcons = {
 
 export default function getIconForFile(name) {
   return (
-    fileNameIcons[name] ||
-    fileExtensionIcons[
-      name
-        ? name
-            .split('.')
-            .pop()
-            .toLowerCase()
-        : ''
-    ] ||
-    ''
+    fileNameIcons[name] || fileExtensionIcons[name ? name.split('.').pop().toLowerCase() : ''] || ''
   );
 }

app/assets/javascripts/vue_shared/components/markdown/toolbar.vue

@@ -49,10 +49,10 @@ export default {
             )
           "
         >
-          <template #markdownDocsLink="{content}">
+          <template #markdownDocsLink="{ content }">
             <gl-link :href="markdownDocsPath" target="_blank">{{ content }}</gl-link>
           </template>
-          <template #quickActionsDocsLink="{content}">
+          <template #quickActionsDocsLink="{ content }">
             <gl-link :href="quickActionsDocsPath" target="_blank">{{ content }}</gl-link>
           </template>
         </gl-sprintf>
@@ -81,7 +81,7 @@ export default {
             )
           "
         >
-          <template #retryButton="{content}">
+          <template #retryButton="{ content }">
             <gl-button
               variant="link"
               category="primary"
@@ -90,7 +90,7 @@ export default {
               {{ content }}
             </gl-button>
           </template>
-          <template #newFileButton="{content}">
+          <template #newFileButton="{ content }">
             <gl-button
               variant="link"
               category="primary"

app/assets/javascripts/vue_shared/components/notes/system_note.vue

@@ -78,16 +78,10 @@ export default {
     },
     // following 2 methods taken from code in `collapseLongCommitList` of notes.js:
     actionTextHtml() {
-      return $(this.note.note_html)
-        .unwrap()
-        .html();
+      return $(this.note.note_html).unwrap().html();
     },
     hasMoreCommits() {
-      return (
-        $(this.note.note_html)
-          .filter('ul')
-          .children().length > MAX_VISIBLE_COMMIT_LIST_COUNT
-      );
+      return $(this.note.note_html).filter('ul').children().length > MAX_VISIBLE_COMMIT_LIST_COUNT;
     },
     descriptionVersion() {
       return this.descriptionVersions[this.note.description_version_id];

app/assets/javascripts/vue_shared/components/registry/title_area.vue

@@ -89,7 +89,7 @@ export default {
         data-testid="info-message"
       >
         <gl-sprintf :message="message.text">
-          <template #docLink="{content}">
+          <template #docLink="{ content }">
             <gl-link :href="message.link" target="_blank">{{ content }}</gl-link>
           </template>
         </gl-sprintf>

app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue

@@ -143,7 +143,7 @@ export default {
     >
       <slot></slot>
     </dropdown-value>
-    <div v-if="canEdit" class="selectbox js-selectbox" style="display: none;">
+    <div v-if="canEdit" class="selectbox js-selectbox" style="display: none">
       <dropdown-hidden-input
         v-for="label in context.labels"
         :key="label.id"

app/assets/javascripts/vue_shared/directives/validation.js

@@ -86,7 +86,7 @@ const createValidator = (context, feedbackMap) => ({ el, reportInvalidInput = fa
  * @param {Object<string, { message: string, isValid: ?function}>} customFeedbackMap
  * @returns {{ inserted: function, update: function }} validateDirective
  */
-export default function(customFeedbackMap = {}) {
+export default function (customFeedbackMap = {}) {
   const feedbackMap = merge(defaultFeedbackMap, customFeedbackMap);
   const elDataMap = new WeakMap();
 

app/assets/javascripts/vue_shared/security_reports/components/security_summary.vue

@@ -34,13 +34,13 @@ export default {
 <template>
   <span>
     <gl-sprintf :message="message.message">
-      <template #total="{content}">
+      <template #total="{ content }">
         <strong>{{ content }}</strong>
       </template>
     </gl-sprintf>
     <span v-if="shouldShowCountMessage" class="gl-font-sm">
       <gl-sprintf :message="message.countMessage">
-        <template v-for="slotName in $options.slotNames" #[slotName]="{content}">
+        <template v-for="slotName in $options.slotNames" #[slotName]="{ content }">
           <span :key="slotName">
             <strong
               v-if="message[slotName] > 0"

app/assets/javascripts/zen_mode.js

@@ -48,11 +48,7 @@ export default class ZenMode {
       return $(e.currentTarget).trigger('zen_mode:leave');
     });
     $(document).on('zen_mode:enter', e => {
-      this.enter(
-        $(e.target)
-          .closest('.md-area')
-          .find('.zen-backdrop'),
-      );
+      this.enter($(e.target).closest('.md-area').find('.zen-backdrop'));
     });
     $(document).on('zen_mode:leave', () => {
       this.exit();

ee/app/assets/javascripts/analytics/code_review_analytics/components/approvers_column.vue

@@ -68,8 +68,6 @@ export default {
     >
       <gl-avatar :src="firstApprover.avatar_url" :size="$options.avatarSize" />
     </gl-avatar-link>
-    <template v-else>
-      &ndash;
-    </template>
+    <template v-else> &ndash; </template>
   </div>
 </template>

ee/app/assets/javascripts/analytics/code_review_analytics/components/merge_request_table.vue

@@ -121,9 +121,7 @@ export default {
         <!-- eslint-disable-next-line vue/no-v-html-->
         <span v-html="formatReviewTime(value)"></span>
       </template>
-      <template v-else>
-        &ndash;
-      </template>
+      <template v-else> &ndash; </template>
     </template>
 
     <template #cell(author)="{ value }">

ee/app/assets/javascripts/analytics/cycle_analytics/components/total_time_component.vue

@@ -48,8 +48,6 @@ export default {
     <template v-if="hasData">
       {{ calculatedTime.duration }} <span> {{ calculatedTime.units }} </span>
     </template>
-    <template v-else>
-      --
-    </template>
+    <template v-else> -- </template>
   </span>
 </template>

ee/app/assets/javascripts/analytics/productivity_analytics/components/metric_column.vue

@@ -40,9 +40,7 @@ export default {
         {{ value }}
         <span> {{ unit }} </span>
       </template>
-      <template v-else>
-        &ndash;
-      </template>
+      <template v-else> &ndash; </template>
     </span>
     <span v-if="label" class="d-flex d-md-none text-secondary metric-label">{{ label }}</span>
   </div>

ee/app/assets/javascripts/approvals/components/project_settings/app.vue

@@ -11,5 +11,5 @@ export default {
 </script>
 
 <template>
-  <app :is-mr-edit="false"><project-rules slot="rules"/></app>
+  <app :is-mr-edit="false"><project-rules slot="rules" /></app>
 </template>

ee/app/assets/javascripts/approvals/stores/modules/mr_edit/actions.js

@@ -32,10 +32,7 @@ const seedUsers = ({ userRecords, ...rule }) =>
 const seedGroups = ({ groupRecords, ...rule }) =>
   groupRecords ? { ...rule, groups: groupRecords } : rule;
 
-const seedLocalRule = rule =>
-  seedApprovers(rule)
-    .then(seedUsers)
-    .then(seedGroups);
+const seedLocalRule = rule => seedApprovers(rule).then(seedUsers).then(seedGroups);
 
 const seedNewRule = rule => {
   const name = rule.ruleType === RULE_TYPE_ANY_APPROVER ? '' : rule.name;

ee/app/assets/javascripts/audit_events/components/tokens/group_token.vue

@@ -23,7 +23,7 @@ export default {
 
 <template>
   <audit-filter-token v-bind="{ ...this.$attrs, ...this.$options.tokenMethods }" v-on="$listeners">
-    <template #suggestion="{item: group}">
+    <template #suggestion="{ item: group }">
       <p class="m-0">{{ group.full_name }}</p>
       <p class="m-0">{{ group.full_path }}</p>
     </template>

ee/app/assets/javascripts/audit_events/components/tokens/member_token.vue

@@ -34,7 +34,7 @@ export default {
 
 <template>
   <audit-filter-token v-bind="{ ...this.$attrs, ...this.$options.tokenMethods }" v-on="$listeners">
-    <template #suggestion="{item: user}">
+    <template #suggestion="{ item: user }">
       <p class="m-0">{{ user.name }}</p>
       <p class="m-0">@{{ user.username }}</p>
     </template>

ee/app/assets/javascripts/audit_events/components/tokens/project_token.vue

@@ -23,7 +23,7 @@ export default {
 
 <template>
   <audit-filter-token v-bind="{ ...this.$attrs, ...this.$options.tokenMethods }" v-on="$listeners">
-    <template #suggestion="{item: project}">
+    <template #suggestion="{ item: project }">
       <p class="m-0">{{ project.name }}</p>
       <p class="m-0">{{ project.name_with_namespace }}</p>
     </template>

ee/app/assets/javascripts/audit_events/components/tokens/shared/audit_filter_token.vue

@@ -64,10 +64,7 @@ export default {
       return this.suggestions.length > 0;
     },
     lowerCaseType() {
-      return this.config.type
-        .replace('_', ' ')
-        .trim()
-        .toLowerCase();
+      return this.config.type.replace('_', ' ').trim().toLowerCase();
     },
     noSuggestionsString() {
       return sprintf(s__('AuditLogs|No matching %{type} found.'), { type: this.lowerCaseType });
@@ -75,7 +72,7 @@ export default {
   },
   watch: {
     // eslint-disable-next-line func-names
-    'value.data': function(term) {
+    'value.data': function (term) {
       this.debouncedLoadSuggestions(term);
     },
     active() {

ee/app/assets/javascripts/audit_events/components/tokens/user_token.vue

@@ -23,7 +23,7 @@ export default {
 
 <template>
   <audit-filter-token v-bind="{ ...this.$attrs, ...this.$options.tokenMethods }" v-on="$listeners">
-    <template #suggestion="{item: user}">
+    <template #suggestion="{ item: user }">
       <p class="m-0">{{ user.name }}</p>
       <p class="m-0">@{{ user.username }}</p>
     </template>

ee/app/assets/javascripts/behaviors/shortcuts/shortcuts_epic.js

@@ -21,10 +21,7 @@ export default class ShortcutsEpic extends ShortcutsIssuable {
     if (parseBoolean(Cookies.get('collapsed_gutter'))) {
       document.dispatchEvent(new Event('toggleSidebarRevealLabelsDropdown'));
     } else {
-      $block
-        .find('.js-sidebar-dropdown-toggle')
-        .get(0)
-        .dispatchEvent(new Event('click'));
+      $block.find('.js-sidebar-dropdown-toggle').get(0).dispatchEvent(new Event('click'));
     }
   }
 }

ee/spec/frontend/analytics/code_review_analytics/components/__snapshots__/approvers_column_spec.js.snap

@@ -60,8 +60,6 @@ exports[`ApproversColumn component when a list with two approvers is passed matc
 
 exports[`ApproversColumn component when an empty list approvers is passed matches the snapshot 1`] = `
 <div>
-  
    – 
-  
 </div>
 `;

ee/spec/frontend/analytics/cycle_analytics/components/__snapshots__/total_time_component_spec.js.snap

 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`TotalTimeComponent with a blank object to render -- 1`] = `
-"<span class=\\"total-time\\">
-    --
-  </span>"
-`;
+exports[`TotalTimeComponent with a blank object to render -- 1`] = `"<span class=\\"total-time\\"> -- </span>"`;
 
 exports[`TotalTimeComponent with a valid time object with {"days": 3, "mins": 47, "seconds": 3} 1`] = `
 "<span class=\\"total-time\\">