Use created date from last_deployment

Adds test

Adds changelog entry

3 files changed, 26 insertions, 2 deletions

diff --git a/app/assets/javascripts/environments/components/environment_item.js.es6 b/app/assets/javascripts/environments/components/environment_item.js.es6
index 07f49cce3dc..a3ba3c762d7 100644
--- a/app/assets/javascripts/environments/components/environment_item.js.es6
+++ b/app/assets/javascripts/environments/components/environment_item.js.es6
@@ -147,6 +147,12 @@
           this.model.last_deployment.deployable;
       },
 
+      canShowDate() {
+        return this.model.last_deployment &&
+          this.model.last_deployment.deployable &&
+          this.model.last_deployment.deployable.created_at;
+      },
+
       /**
        * Human readable date.
        *
@@ -155,7 +161,7 @@
       createdDate() {
         const timeagoInstance = new timeago(); // eslint-disable-line
 
-        return timeagoInstance.format(this.model.created_at);
+        return timeagoInstance.format(this.model.last_deployment.deployable.created_at);
       },
 
       /**
@@ -453,7 +459,7 @@
 
         <td>
           <span
-            v-if="!isFolder && model.last_deployment"
+            v-if="!isFolder && canShowDate"
             class="environment-created-date-timeago">
             {{createdDate}}
           </span>
diff --git a/changelogs/unreleased/24844-environments-date.yml b/changelogs/unreleased/24844-environments-date.yml
new file mode 100644
index 00000000000..2bc23d40a68
--- /dev/null
+++ b/changelogs/unreleased/24844-environments-date.yml
@@ -0,0 +1,4 @@
+---
+title: Fixes Environments displaying incorrect date since 8.14 upgrade
+merge_request:
+author:
diff --git a/spec/javascripts/environments/environment_item_spec.js.es6 b/spec/javascripts/environments/environment_item_spec.js.es6
index 14e90a9dd1b..3e2fa730c8d 100644
--- a/spec/javascripts/environments/environment_item_spec.js.es6
+++ b/spec/javascripts/environments/environment_item_spec.js.es6
@@ -1,4 +1,5 @@
 //= require vue
+//= require timeago
 //= require environments/components/environment_item
 
 describe('Environment item', () => {
@@ -109,6 +110,8 @@ describe('Environment item', () => {
             name: 'deploy',
             build_path: '/root/ci-folders/builds/1279',
             retry_path: '/root/ci-folders/builds/1279/retry',
+            created_at: '2016-11-29T18:11:58.430Z',
+            updated_at: '2016-11-29T18:11:58.430Z',
           },
           manual_actions: [
             {
@@ -149,6 +152,17 @@ describe('Environment item', () => {
         ).toContain('#');
       });
 
+      it('should render last deployment date', () => {
+        const timeagoInstance = new timeago(); // eslint-disable-line
+        const formatedDate = timeagoInstance.format(
+          environment.last_deployment.deployable.created_at
+        );
+
+        expect(
+          component.$el.querySelector('.environment-created-date-timeago').textContent
+        ).toContain(formatedDate);
+      });
+
       describe('With user information', () => {
         it('should render user avatar with link to profile', () => {
           expect(