From 848d69f63b4c59ae51a71e92ffed80955b75a1c2 Mon Sep 17 00:00:00 2001
From: Julia Miocene <jmiocene@gitlab.com>
Date: Mon, 4 Mar 2024 14:02:14 +0100
Subject: [PATCH] Update Terraform modules empty state illustration

Changelog: changed
---
 .../list/components/packages_list_app.vue              |  6 +++++-
 .../groups/infrastructure_registry/index.html.haml     |  2 +-
 .../packages/infrastructure_registry/index.html.haml   |  2 +-
 .../list/components/packages_list_app_spec.js          | 10 ++++++++++
 4 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
index 08072908c4d414..9e246ef00d8446 100644
--- a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
+++ b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
@@ -97,7 +97,11 @@ export default {
 
 <template>
   <div>
-    <infrastructure-title :help-url="$options.terraformRegistryHelpUrl" :count="packagesCount" />
+    <infrastructure-title
+      v-if="packagesCount > 0"
+      :help-url="$options.terraformRegistryHelpUrl"
+      :count="packagesCount"
+    />
     <infrastructure-search v-if="packagesCount > 0" @update="requestPackagesList" />
 
     <package-list @page:changed="onPageChanged" @package:delete="onPackageDeleteRequest">
diff --git a/app/views/groups/infrastructure_registry/index.html.haml b/app/views/groups/infrastructure_registry/index.html.haml
index e95cf1ed19b17a..dec4524386d0cc 100644
--- a/app/views/groups/infrastructure_registry/index.html.haml
+++ b/app/views/groups/infrastructure_registry/index.html.haml
@@ -2,4 +2,4 @@
 
 #js-vue-packages-list{ data: { resource_id: @group.id,
   page_type: 'groups',
-  empty_list_illustration: image_path('illustrations/empty-state/empty-terraform-register-lg.svg') } }
+  empty_list_illustration: image_path('illustrations/empty-state/empty-environment-md.svg') } }
diff --git a/app/views/projects/packages/infrastructure_registry/index.html.haml b/app/views/projects/packages/infrastructure_registry/index.html.haml
index 2979c937714aca..82da24683d5c46 100644
--- a/app/views/projects/packages/infrastructure_registry/index.html.haml
+++ b/app/views/projects/packages/infrastructure_registry/index.html.haml
@@ -2,4 +2,4 @@
 
 #js-vue-packages-list{ data: { resource_id: @project.id,
   page_type: 'project',
-  empty_list_illustration: image_path('illustrations/empty-state/empty-terraform-register-lg.svg') } }
+  empty_list_illustration: image_path('illustrations/empty-state/empty-environment-md.svg') } }
diff --git a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js
index 30542721329afa..228ac00c676023 100644
--- a/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js
+++ b/spec/frontend/packages_and_registries/infrastructure_registry/components/list/components/packages_list_app_spec.js
@@ -13,6 +13,7 @@ import { SHOW_DELETE_SUCCESS_ALERT } from '~/packages_and_registries/shared/cons
 
 import * as packageUtils from '~/packages_and_registries/shared/utils';
 import InfrastructureSearch from '~/packages_and_registries/infrastructure_registry/list/components/infrastructure_search.vue';
+import InfrastructureTitle from '~/packages_and_registries/infrastructure_registry/list/components/infrastructure_title.vue';
 import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 
 jest.mock('~/lib/utils/common_utils');
@@ -33,6 +34,7 @@ describe('packages_list_app', () => {
   const findEmptyState = () => wrapper.findComponent(GlEmptyState);
   const findListComponent = () => wrapper.findComponent(PackageList);
   const findInfrastructureSearch = () => wrapper.findComponent(InfrastructureSearch);
+  const findInfrastructureTitle = () => wrapper.findComponent(InfrastructureTitle);
 
   const createStore = ({ isGroupPage = false, filter = [], packageCount = 0 } = {}) => {
     store = new Vuex.Store({
@@ -158,6 +160,10 @@ describe('packages_list_app', () => {
       expect(heading().text()).toBe('You have no Terraform modules in your project');
     });
 
+    it('does not show infrastructure registry title', () => {
+      expect(findInfrastructureTitle().exists()).toBe(false);
+    });
+
     describe('when group page', () => {
       beforeEach(() => {
         createStore({ isGroupPage: true });
@@ -201,6 +207,10 @@ describe('packages_list_app', () => {
         expect(findInfrastructureSearch().exists()).toBe(true);
       });
 
+      it('shows infrastructure registry title', () => {
+        expect(findInfrastructureTitle().exists()).toBe(true);
+      });
+
       it('on update fetches data from the store', () => {
         store.dispatch.mockClear();
 
-- 
GitLab