Draft: Add verification level to ai catalog list items and drawer

What does this MR do and why?

References

Screenshots or screen recordings

Before	After

How to set up and validate locally

CI/CD Catalog Patch

diff --git a/app/assets/javascripts/ci/catalog/components/pages/ci_resource_details_page.vue b/app/assets/javascripts/ci/catalog/components/pages/ci_resource_details_page.vue
index 3500c7bc8aa0..952b12f27303 100644
--- a/app/assets/javascripts/ci/catalog/components/pages/ci_resource_details_page.vue
+++ b/app/assets/javascripts/ci/catalog/components/pages/ci_resource_details_page.vue
@@ -7,6 +7,7 @@ import getCatalogCiResourceSharedData from '../../graphql/queries/get_ci_catalog
 import CiResourceDetails from '../details/ci_resource_details.vue';
 import CiResourceHeader from '../details/ci_resource_header.vue';
 import { VISIBILITY_LEVEL_PRIVATE } from '../../constants';
+import mockData from './mockDetails';
 
 export default {
   components: {
@@ -19,33 +20,33 @@ export default {
   data() {
     return {
       isEmpty: false,
-      resourceSharedData: {},
+      resourceSharedData: mockData.data.ciCatalogResource,
       showPrivateProjectAlert: true,
     };
   },
-  apollo: {
-    resourceSharedData: {
-      query: getCatalogCiResourceSharedData,
-      variables() {
-        return {
-          fullPath: this.cleanFullPath,
-        };
-      },
-      update(data) {
-        return data.ciCatalogResource;
-      },
-      error(e) {
-        this.isEmpty = true;
-        createAlert({ message: e.message });
-      },
-    },
-  },
+  // apollo: {
+  //   resourceSharedData: {
+  //     query: getCatalogCiResourceSharedData,
+  //     variables() {
+  //       return {
+  //         fullPath: this.cleanFullPath,
+  //       };
+  //     },
+  //     update(data) {
+  //       return data.ciCatalogResource;
+  //     },
+  //     error(e) {
+  //       this.isEmpty = true;
+  //       createAlert({ message: e.message });
+  //     },
+  //   },
+  // },
   computed: {
     cleanFullPath() {
       return cleanLeadingSeparator(this.$route.params.id);
     },
     isLoadingData() {
-      return this.$apollo.queries.resourceSharedData.loading;
+      return false;
     },
     isPrivateProjectAlertVisible() {
       return this.isProjectPrivate && this.showPrivateProjectAlert;
diff --git a/app/assets/javascripts/ci/catalog/components/pages/ci_resources_page.vue b/app/assets/javascripts/ci/catalog/components/pages/ci_resources_page.vue
index 6f9af21a1c36..bf019b395114 100644
--- a/app/assets/javascripts/ci/catalog/components/pages/ci_resources_page.vue
+++ b/app/assets/javascripts/ci/catalog/components/pages/ci_resources_page.vue
@@ -15,6 +15,7 @@ import getCurrentPage from '../../graphql/queries/client/get_current_page.query.
 import updateCurrentPageMutation from '../../graphql/mutations/client/update_current_page.mutation.graphql';
 import getCatalogResourcesCount from '../../graphql/queries/get_ci_catalog_resources_count.query.graphql';
 import { DEFAULT_SORT_VALUE, SCOPE } from '../../constants';
+import mockData from './mock';
 
 export default {
   i18n: {
@@ -73,7 +74,7 @@ export default {
         };
       },
       update(data) {
-        return data?.ciCatalogResources?.nodes || [];
+        return mockData.ciCatalogResources?.nodes || [];
       },
       result({ data }) {
         const { pageInfo } = data?.ciCatalogResources || {};

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #572752 (closed)