Move EE differences for `app/assets/javascripts/environments/stores/environments_store.js`

The file app/assets/javascripts/environments/stores/environments_store.js has differences between CE and EE.

Diferences

diff --git a/home/yorickpeterse/Projects/gitlab/gdk-ce/gitlab/app/assets/javascripts/environments/stores/environments_store.js b/home/yorickpeterse/Projects/gitlab/gdk-ee/gitlab/app/assets/javascripts/environments/stores/environments_store.js
index 5808a2d4afa..4a076d44c3f 100644
--- a/home/yorickpeterse/Projects/gitlab/gdk-ce/gitlab/app/assets/javascripts/environments/stores/environments_store.js
+++ b/home/yorickpeterse/Projects/gitlab/gdk-ee/gitlab/app/assets/javascripts/environments/stores/environments_store.js
@@ -1,4 +1,7 @@
 import { parseIntPagination, normalizeHeaders } from '~/lib/utils/common_utils';
+
+// ee-only
+import { CLUSTER_TYPE } from '~/clusters/constants';
 /**
  * Environments Store.
  *
@@ -30,6 +33,14 @@ export default class EnvironmentsStore {
    * If the `size` is bigger than 1, it means it should be rendered as a folder.
    * In those cases we add `isFolder` key in order to render it properly.
    *
+   * Top level environments - when the size is 1 - with `rollout_status`
+   * can render a deploy board. We add `isDeployBoardVisible` and `deployBoardData`
+   * keys to those environments.
+   * The first key will let's us know if we should or not render the deploy board.
+   * It will be toggled when the user clicks to seee the deploy board.
+   *
+   * The second key will allow us to update the environment with the received deploy board data.
+   *
    * @param  {Array} environments
    * @returns {Array}
    */
@@ -62,14 +73,58 @@ export default class EnvironmentsStore {
         filtered = Object.assign(filtered, env);
       }
 
+      if (
+        filtered.size === 1 &&
+        filtered.rollout_status &&
+        filtered.cluster_type !== CLUSTER_TYPE.GROUP
+      ) {
+        filtered = Object.assign({}, filtered, {
+          hasDeployBoard: true,
+          isDeployBoardVisible:
+            oldEnvironmentState.isDeployBoardVisible === false
+              ? oldEnvironmentState.isDeployBoardVisible
+              : true,
+          deployBoardData:
+            filtered.rollout_status.status === 'found' ? filtered.rollout_status : {},
+          isLoadingDeployBoard: filtered.rollout_status.status === 'loading',
+          isEmptyDeployBoard: filtered.rollout_status.status === 'not_found',
+        });
+      }
       return filtered;
     });
 
     this.state.environments = filteredEnvironments;
 
+    // ee-only start
+    /**
+     * Add the canary callout banner underneath the second environment listed.
+     *
+     * If there is only one environment, then add to it underneath the first.
+     */
+    if (this.state.environments.length >= 2) {
+      this.state.environments[1].showCanaryCallout = true;
+    } else if (this.state.environments.length === 1) {
+      this.state.environments[0].showCanaryCallout = true;
+    }
+    // ee-only end
+
     return filteredEnvironments;
   }
 
+  /**
+   * Stores the pagination information needed to render the pagination for the
+   * table.
+   *
+   * Normalizes the headers to uppercase since they can be provided either
+   * in uppercase or lowercase.
+   *
+   * Parses to an integer the normalized ones needed for the pagination component.
+   *
+   * Stores the normalized and parsed information.
+   *
+   * @param  {Object} pagination = {}
+   * @return {Object}
+   */
   setPagination(pagination = {}) {
     const normalizedHeaders = normalizeHeaders(pagination);
     const paginationInformation = parseIntPagination(normalizedHeaders);
@@ -165,4 +220,27 @@ export default class EnvironmentsStore {
 
     return environments.filter(env => env.isFolder && env.isOpen);
   }
+
+  /**
+   * Toggles deploy board visibility for the provided environment ID.
+   *
+   * @param  {Object} environment
+   * @return {Array}
+   */
+  toggleDeployBoard(environmentID) {
+    const environments = this.state.environments.slice();
+
+    this.state.environments = environments.map(env => {
+      let updated = Object.assign({}, env);
+
+      if (env.id === environmentID) {
+        updated = Object.assign({}, updated, {
+          isDeployBoardVisible: !env.isDeployBoardVisible,
+        });
+      }
+      return updated;
+    });
+
+    return this.state.environments;
+  }
 }

What needs to be done

1. Create an EE store & extended