Use util function to determine file is ci config

Instead of relying on a regexp in the frontend which
is a flakier and also doesn't consider that we can
have custom gitlab-ci names, this is in sync with
the API to determine that we are editing a config
file.

app/assets/javascripts/pages/projects/blob/show/index.js

@@ -5,17 +5,13 @@ import initBlob from '~/pages/projects/init_blob';
 import GpgBadges from '~/gpg_badges';
 import '~/sourcegraph/load';
 import PipelineTourSuccessModal from '~/blob/pipeline_tour_success_modal.vue';
+import { parseBoolean } from '~/lib/utils/common_utils';
 
 const createGitlabCiYmlVisualization = (containerId = '#js-blob-toggle-graph-preview') => {
   const el = document.querySelector(containerId);
-  const { filename, blobData } = el?.dataset;
-
-  const nameRegexp = /\.gitlab-ci.yml/;
-
-  if (!el || !nameRegexp.test(filename)) {
-    return;
-  }
+  const { isCiConfigFile, blobData } = el?.dataset;
 
+  if (el && parseBoolean(isCiConfigFile)) {
     // eslint-disable-next-line no-new
     new Vue({
       el,
@@ -31,6 +27,7 @@ const createGitlabCiYmlVisualization = (containerId = '#js-blob-toggle-graph-pre
         });
       },
     });
+  }
 };
 
 document.addEventListener('DOMContentLoaded', () => {

app/views/projects/blob/_content.html.haml

@@ -2,9 +2,9 @@
 - rich_viewer = blob.rich_viewer
 - rich_viewer_active = rich_viewer && params[:viewer] != 'simple'
 - blob_data = defined?(@blob) ? @blob.data : {}
-- filename = defined?(@blob) ? @blob.name : ''
+- is_ci_config_file = defined?(@blob) && defined?(@project) ? editing_ci_config?.to_s : 'false'
 
-#js-blob-toggle-graph-preview{ data: { blob_data: blob_data, filename: filename } }
+#js-blob-toggle-graph-preview{ data: { blob_data: blob_data, is_ci_config_file: is_ci_config_file } }
 
 = render 'projects/blob/viewer', viewer: simple_viewer, hidden: rich_viewer_active