feat: add options to v2 route (#1080)

Co-authored-by: Ming-Hay <[email protected]>

app/components/secret-view/component.js

@@ -1,4 +1,4 @@
-import { computed } from '@ember/object';
+import { computed, get } from '@ember/object';
 import Component from '@ember/component';
 
 export default Component.extend({
@@ -10,8 +10,8 @@ export default Component.extend({
     get() {
       const { secret, pipeline } = this;
 
-      if (pipeline.get('configPipelineId')) {
-        if (secret.get('pipelineId') === pipeline.get('configPipelineId')) {
+      if (get(pipeline, 'configPipelineId')) {
+        if (get(secret, 'pipelineId') === get(pipeline, 'configPipelineId')) {
           return 'Override';
         }
 
@@ -31,7 +31,7 @@ export default Component.extend({
     get() {
       const { secret, pipeline } = this;
 
-      if (secret.get('pipelineId') === pipeline.get('configPipelineId')) {
+      if (get(secret, 'pipelineId') === get(pipeline, 'configPipelineId')) {
         return 'Inherited from parent pipeline';
       }
 
@@ -57,14 +57,14 @@ export default Component.extend({
         }
         secret.save();
         this.set('newValue', null);
-        this.set('originalAllowInPR', secret.get('allowInPR'));
+        this.set('originalAllowInPR', get(secret, 'allowInPR'));
       } else if (this.newValue) {
         // Create child pipeline secret to override inherited secret of same name
         return this.onCreateSecret(
-          secret.get('name'),
+          get(secret, 'name'),
           this.newValue,
           this.get('pipeline.id'),
-          secret.get('allowInPR')
+          get(secret, 'allowInPR')
         );
       }
 

app/components/token-view/component.js

@@ -1,4 +1,4 @@
-import { computed } from '@ember/object';
+import { computed, get } from '@ember/object';
 import Component from '@ember/component';
 
 export default Component.extend({
@@ -14,8 +14,8 @@ export default Component.extend({
       get() {
         const { token } = this;
 
-        return this.newName !== token.get('name') ||
-          this.newDescription !== token.get('description')
+        return this.newName !== get(token, 'name') ||
+          this.newDescription !== get(token, 'description')
           ? 'Update'
           : 'Delete';
       }

app/pipeline/service.js

@@ -42,14 +42,21 @@ export default Service.extend({
     // No preferences for the pipeline exist, so we will create the default set.
     // Note: the newly created preferences for this pipeline are not saved back on the server as they are just default settings.
     // When a user changes the options in the options view of the pipeline, then the settings are saved.
-    const pipelinePreference = await this.store.createRecord(
+    let pipelinePreference = await this.store.peekRecord(
       'preference/pipeline',
-      {
-        id: pipelineId,
-        ...pipelinePreferences
-      }
+      `${pipelineId}`
     );
 
+    if (pipelinePreference === null) {
+      pipelinePreference = await this.store.createRecord(
+        'preference/pipeline',
+        {
+          id: pipelineId,
+          ...pipelinePreferences
+        }
+      );
+    }
+
     return pipelinePreference;
   }
 });

app/shuttle/service.js

@@ -353,6 +353,14 @@ export default Service.extend({
     const method = 'get';
     const url = `/pipelines/${pipelineId}/stages`;
 
+    return this.fetchFromApi(method, url);
+  },
+
+  // GET /pipelines/{id}/jobs
+  async fetchJobs(pipelineId) {
+    const method = 'get';
+    const url = `/pipelines/${pipelineId}/jobs`;
+
     return this.fetchFromApi(method, url);
   }
 });

app/v2/pipeline/options/controller.js

@@ -0,0 +1,68 @@
+import Controller from '@ember/controller';
+import { service } from '@ember/service';
+import { action } from '@ember/object';
+
+export default class PipelineOptionsController extends Controller {
+  @service session;
+
+  @service router;
+
+  errorMessage = '';
+
+  isSaving = false;
+
+  get pipeline() {
+    return this.model.pipeline;
+  }
+
+  get jobs() {
+    return this.model.jobs;
+  }
+
+  @action
+  async removePipeline() {
+    const currentPipeline = await this.store.findRecord(
+      'pipeline',
+      this.pipeilne.id
+    );
+
+    currentPipeline
+      .destroyRecord()
+      .then(() => {
+        this.router.transitionTo('home');
+      })
+      .catch(err => {
+        this.errorMessage = err.errors[0].detail || '';
+      });
+  }
+
+  @action
+  async updatePipeline({ scmUrl, rootDir }) {
+    const { pipeline } = this;
+
+    pipeline.setProperties({
+      checkoutUrl: scmUrl,
+      rootDir
+    });
+    this.isSaving = true;
+
+    const currentPipeline = await this.store.findRecord(
+      'pipeline',
+      this.pipeline.id
+    );
+
+    currentPipeline.setProperties({
+      ...pipeline
+    });
+
+    currentPipeline
+      .save()
+      .then(() => (this.errorMessage = ''))
+      .catch(err => {
+        this.errorMessage = err.errors[0].detail || '';
+      })
+      .finally(() => {
+        this.isSaving = false;
+      });
+  }
+}

app/v2/pipeline/options/route.js

@@ -1,3 +1,41 @@
 import Route from '@ember/routing/route';
+import { service } from '@ember/service';
+import { get } from '@ember/object';
 
-export default class NewPipelineOptionsRoute extends Route {}
+export default class PipelineOptionsRoute extends Route {
+  @service session;
+
+  @service router;
+
+  @service shuttle;
+
+  beforeModel() {
+    // Guests should not access this page
+    if (get(this, 'session.data.authenticated.isGuest')) {
+      this.router.transitionTo('v2.pipeline');
+    }
+
+    // Reset error message when switching pages
+    this.router.on('routeWillChange', (/* transition */) => {
+      const pipelineOptionsController = this.controllerFor(
+        'v2.pipeline.options'
+      );
+
+      pipelineOptionsController.set('errorMessage', '');
+    });
+  }
+
+  async model() {
+    const { pipeline } = this.modelFor('v2.pipeline');
+    const pipelineId = pipeline.id;
+
+    const jobs = await this.shuttle.fetchJobs(pipelineId).catch(e => {
+      // eslint-disable-next-line no-console
+      console.error(e);
+
+      return [];
+    });
+
+    return { pipeline, jobs };
+  }
+}

app/v2/pipeline/options/template.hbs

@@ -1,5 +1,13 @@
 {{page-title "Options"}}
 <div class="pipeline-options">
-  <div>options content</div>
-  {{outlet}}
+  <PipelineOptions
+    class="padded-container"
+    @username={{this.session.data.authenticated.username}}
+    @pipeline={{this.pipeline}}
+    @jobs={{this.jobs}}
+    @errorMessage={{this.errorMessage}}
+    @onRemovePipeline={{action "removePipeline"}}
+    @isSaving={{this.isSaving}}
+    @onUpdatePipeline={{action "updatePipeline"}}
+  />
 </div>

tests/unit/pipeline/service-test.js

@@ -16,6 +16,12 @@ const storeServiceStub = Service.extend({
   query() {
     return pipelines;
   },
+  peekRecord(name, id) {
+    return EmberObject.create({
+      id,
+      showPRJobs: true
+    });
+  },
   peekAll() {
     /* eslint new-cap: ["error", { "capIsNewExceptions": ["A"] }] */
     return A([