Merge branch 'ph/moreVueFileListChecks' into 'master'

Puts Vue LFS badge behind a feature flag

See merge request gitlab-org/gitlab!23071

app/assets/javascripts/repository/components/tree_content.vue

@@ -5,6 +5,7 @@ import FileTable from './table/index.vue';
 import getRefMixin from '../mixins/get_ref';
 import getFiles from '../queries/getFiles.query.graphql';
 import getProjectPath from '../queries/getProjectPath.query.graphql';
+import getVueFileListLfsBadge from '../queries/getVueFileListLfsBadge.query.graphql';
 import FilePreview from './preview/index.vue';
 import { readmeFile } from '../utils/readme';
 
@@ -20,6 +21,9 @@ export default {
     projectPath: {
       query: getProjectPath,
     },
+    vueFileListLfsBadge: {
+      query: getVueFileListLfsBadge,
+    },
   },
   props: {
     path: {
@@ -43,6 +47,7 @@ export default {
         blobs: [],
       },
       isLoadingFiles: false,
+      vueFileListLfsBadge: false,
     };
   },
   computed: {
@@ -77,6 +82,7 @@ export default {
             path: this.path || '/',
             nextPageCursor: this.nextPageCursor,
             pageSize: PAGE_SIZE,
+            vueLfsEnabled: this.vueFileListLfsBadge,
           },
         })
         .then(({ data }) => {

app/assets/javascripts/repository/index.js

@@ -23,6 +23,7 @@ export default function setupVueRepositoryList() {
       projectPath,
       projectShortPath,
       ref,
+      vueFileListLfsBadge: gon?.features?.vueFileListLfsBadge,
       commits: [],
     },
   });

app/assets/javascripts/repository/queries/getFiles.query.graphql

@@ -14,6 +14,7 @@ query getFiles(
   $ref: String!
   $pageSize: Int!
   $nextPageCursor: String
+  $vueLfsEnabled: Boolean = false
 ) {
   project(fullPath: $projectPath) {
     repository {
@@ -46,7 +47,7 @@ query getFiles(
             node {
               ...TreeEntry
               webUrl
-              lfsOid
+              lfsOid @include(if: $vueLfsEnabled)
             }
           }
           pageInfo {

app/assets/javascripts/repository/queries/getVueFileListLfsBadge.query.graphql

+query getProjectShortPath {
+  vueFileListLfsBadge @client
+}

app/controllers/projects/tree_controller.rb

@@ -15,6 +15,10 @@ class Projects::TreeController < Projects::ApplicationController
   before_action :authorize_download_code!
   before_action :authorize_edit_tree!, only: [:create_dir]
 
+  before_action only: [:show] do
+    push_frontend_feature_flag(:vue_file_list_lfs_badge)
+  end
+
   def show
     return render_404 unless @repository.commit(@ref)
 

ee/app/assets/javascripts/repository/index.js

@@ -9,6 +9,8 @@ export default () => {
   if (data.pathLocksAvailable) {
     const toggleBtn = document.querySelector('.js-path-lock');
 
+    if (!toggleBtn) return;
+
     toggleBtn.addEventListener('click', e => {
       e.preventDefault();