Merge branch 'environment-dashboard-without-deployable' into 'master'

Render Environment Dashboard Without Deployable

See merge request gitlab-org/gitlab!17720

ee/app/assets/javascripts/environments_dashboard/components/dashboard/environment.vue

@@ -70,7 +70,7 @@ export default {
       return !_.isEmpty(this.environment.last_deployment) ? this.environment.last_deployment : null;
     },
     deployable() {
-      return !_.isEmpty(this.lastDeployment.deployable) ? this.lastDeployment.deployable : null;
+      return this.lastDeployment ? this.lastDeployment.deployable : null;
     },
     commit() {
       return !_.isEmpty(this.lastDeployment.commit) ? this.lastDeployment.commit : {};
@@ -102,15 +102,7 @@ export default {
       );
     },
     buildName() {
-      if (
-        this.environment &&
-        this.environment.last_deployment &&
-        this.environment.last_deployment.deployable
-      ) {
-        const { deployable } = this.environment.last_deployment;
-        return `${deployable.name} #${deployable.id}`;
-      }
-      return '';
+      return this.deployable ? `${this.deployable.name} #${this.deployable.id}` : '';
     },
   },
 };
@@ -124,7 +116,7 @@ export default {
     />
 
     <div :class="cardClasses" class="dashboard-card-body card-body">
-      <div v-if="lastDeployment" class="row">
+      <div v-if="deployable" class="row">
         <div class="col-1 align-self-center">
           <user-avatar-link
             v-if="user"

ee/spec/frontend/environments_dashboard/components/environment_spec.js

@@ -81,4 +81,37 @@ describe('Environment', () => {
       });
     });
   });
+
+  it('renders an environment without a deployment', () => {
+    propsData = {
+      environment: {
+        ...environment,
+        last_deployment: null,
+      },
+    };
+    wrapper = shallowMount(Component, {
+      localVue,
+      propsData,
+    });
+
+    expect(wrapper.text()).toContain('This environment has no deployments yet.');
+  });
+
+  it('renders an environment with a deployment without a deployable', () => {
+    propsData = {
+      environment: {
+        ...environment,
+        last_deployment: {
+          ...environment.last_deployment,
+          deployable: null,
+        },
+      },
+    };
+    wrapper = shallowMount(Component, {
+      localVue,
+      propsData,
+    });
+
+    expect(wrapper.text()).toContain('This environment has no deployments yet.');
+  });
 });