fix when no GCP projects are found

app/assets/javascripts/projects/gke_cluster_dropdowns/components/gke_dropdown_mixin.js

@@ -38,6 +38,10 @@ export default {
   },
   computed: {
     results() {
+      if (!this.items) {
+        return [];
+      }
+
       return this.items.filter(item => item.name.toLowerCase().indexOf(this.searchQuery) > -1);
     },
   },

app/assets/javascripts/projects/gke_cluster_dropdowns/components/gke_project_id_dropdown.vue

@@ -19,10 +19,10 @@ export default {
     ...mapState({ items: 'projects' }),
     ...mapGetters(['hasProject']),
     hasOneProject() {
-      return this.items.length === 1;
+      return this.items && this.items.length === 1;
     },
     isDisabled() {
-      return this.items.length < 2;
+      return this.items && this.items.length < 2;
     },
     toggleText() {
       if (this.isLoading) {
@@ -33,18 +33,25 @@ export default {
         return this.selectedProject.name;
       }
 
-      return !this.items.length
-        ? s__('ClusterIntegration|No projects found')
-        : s__('ClusterIntegration|Select project');
+      if (!this.items) {
+        return s__('ClusterIntegration|No projects found');
+      }
+
+      return s__('ClusterIntegration|Select project');
     },
     helpText() {
       let message;
       if (this.hasErrors) {
+        message = this.gapiError;
+      }
+
+      if (!this.items) {
         message =
           'ClusterIntegration|We were unable to fetch any projects. Ensure that you have a project on %{docsLinkStart}Google Cloud Platform%{docsLinkEnd}.';
       }
 
-      message = this.items.length
+      message =
+        this.items && this.items.length
           ? 'ClusterIntegration|To use a new project, first create one on %{docsLinkStart}Google Cloud Platform%{docsLinkEnd}.'
           : 'ClusterIntegration|To create a cluster, first create a project on %{docsLinkStart}Google Cloud Platform%{docsLinkEnd}.';
 

spec/javascripts/projects/gke_cluster_dropdowns/components/gke_project_id_dropdown_spec.js

@@ -58,7 +58,7 @@ describe('GkeProjectIdDropdown', () => {
 
     it('returns empty toggle text', done =>
       vm.$nextTick().then(() => {
-        vm.$store.commit(SET_PROJECTS, []);
+        vm.$store.commit(SET_PROJECTS, null);
         vm.setItem(emptyProjectMock);
 
         expect(vm.toggleText).toBe(LABELS.EMPTY);