Enabled optional selection of a github repo when creating a task, so …

…that task can be synced with a github issue

app/components/select/github-repo.js

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+const { Component } = Ember;
+
+export default Component.extend({
+  classNames: ['select-github-repo'],
+
+  githubRepos: null
+});

app/controllers/project/tasks/new.js

@@ -2,6 +2,7 @@ import Ember from 'ember';
 import { isNonValidationError } from 'code-corps-ember/utils/error-utils';
 
 const {
+  computed: { mapBy },
   Controller,
   get,
   RSVP,
@@ -10,6 +11,9 @@ const {
 
 export default Controller.extend({
   unsavedTaskSkills: [],
+
+  githubRepos: mapBy('task.project.projectGithubRepos', 'githubRepo'),
+
   actions: {
     /**
      saveTask - action
@@ -23,9 +27,11 @@ export default Controller.extend({
     */
     async saveTask(task) {
       let project = get(task, 'project');
+      let githubRepo = get(this, 'selectedRepo');
       let inboxTaskList = await this._getInboxTaskList(project);
 
       set(task, 'taskList', inboxTaskList);
+      set(task, 'githubRepo', githubRepo);
 
       return task.save()
                  .then((task) => this._saveSkills(task))

app/models/task.js

@@ -20,14 +20,6 @@ export default Model.extend(ContainsCodeMixin, {
    */
   body: attr(),
 
-  /**
-    The github issue the task is associated with.
-
-    @attribute githubId
-    @type string
-  */
-  githubId: attr(),
-
   /**
     The date that the task was inserted.
 
@@ -100,7 +92,15 @@ export default Model.extend(ContainsCodeMixin, {
     @attribute commentUserMentions
     @type Ember.computed
    */
-  commentUserMentions: hasMany('comment-user-mention', { asnyc: true }),
+  commentUserMentions: hasMany('comment-user-mention', { async: true }),
+
+  /**
+   * The github repository where an issue connected to this task exists
+   *
+   * @attribute githubRepo
+   * @type DS.Model
+   */
+  githubRepo: belongsTo('github-repo', { async: true }),
 
   /**
     The task-list that the task belongs to

app/routes/project/tasks/new.js

@@ -43,6 +43,7 @@ export default Route.extend(AuthenticatedRouteMixin, {
     let task = store.createRecord('task', { project, user });
 
     set(controller, 'task', task);
+    set(controller, 'selectedRepo', null);
     set(controller, 'unsavedTaskSkills', []);
   },
 

app/styles/app.scss

@@ -150,6 +150,11 @@
 //
 @import "components/related-skills";
 
+//
+// COMPONENTS - SELECTS
+//
+@import "components/select/github-repo";
+
 //
 // COMPONENTS - TASK
 //

app/styles/components/select/github-repo.scss

@@ -0,0 +1,3 @@
+.select-github-repo select {
+  width: 100%;
+}

app/templates/components/select/github-repo.hbs

@@ -0,0 +1,6 @@
+{{#x-select value=selectedRepo action=onSelected as |xs|}}
+  {{#xs.option value=null}}None (default){{/xs.option}}
+  {{#each githubRepos as |githubRepo|}}
+    {{#xs.option value=githubRepo}}{{githubRepo.name}}{{/xs.option}}
+  {{/each}}
+{{/x-select}}

app/templates/components/task-card.hbs

@@ -18,7 +18,7 @@
   </p>
   {{#if canAssign}}
     {{#power-select
-      beforeOptionsComponent=(component "power-select/before-options" selectRemoteController=selectRemoteController)
+      beforeOptionsComponent=(component "power-select/before-task-options" selectRemoteController=selectRemoteController)
       buildSelection=(action "buildSelection")
       class="select-inline"
       disabled=userSelectDisabled

app/templates/project/tasks/new.hbs

@@ -31,13 +31,26 @@
           skillsList=unsavedTaskSkills
         }}
       </div>
+
       {{project-skills-list
         onSkillClicked=(action 'toggleSkill')
         project=task.project
         excludedSkills=unsavedTaskSkills
         showHeader=true
         header="Or click to add skills below"
       }}
+
+      <div class="task-sidebar-section">
+        <div class="task-sidebar-section__header">
+          <h2>Github</h2>
+          <p>Select a github repo to sync this task with</p>
+        </div>
+        {{select/github-repo
+          githubRepos=githubRepos
+          selectedRepo=selectedRepo
+          onSelected=(action (mut selectedRepo))
+        }}
+      </div>
     </div>
   </div>
 </div>

mirage/factories/github-repo.js

@@ -0,0 +1,5 @@
+import { Factory, faker } from 'ember-cli-mirage';
+
+export default Factory.extend({
+  name: faker.internet.domainWord
+});

mirage/factories/project-github-repo.js

@@ -0,0 +1,16 @@
+import { Factory } from 'ember-cli-mirage';
+
+export default Factory.extend({
+  // ensures creation of associated records if they were not otherwise specified
+  afterCreate(record, server) {
+    if (!record.githubRepo) {
+      record.githubRepo  = server.create('github-repo');
+      record.save();
+    }
+
+    if (!record.project) {
+      record.project = server.create('project');
+      record.save();
+    }
+  }
+});

mirage/models/task.js

@@ -3,6 +3,7 @@ import { Model, belongsTo, hasMany } from 'ember-cli-mirage';
 export default Model.extend({
   comments: hasMany(),
   commentUserMentions: hasMany('comment-user-mention'),
+  githubRepo: belongsTo(),
   taskList: belongsTo(),
   taskUserMentions: hasMany('task-user-mention'),
   project: belongsTo(),

tests/acceptance/task-creation-test.js

@@ -332,3 +332,41 @@ test('Skills can be assigned to task during creation', function(assert) {
     assert.equal(cssTaskSkill.skillId, css.id, 'The correct skill was assigned.');
   });
 });
+
+test('A github repo can be assigned to the task during creation', function(assert) {
+  assert.expect(2);
+
+  let user = server.create('user', { username: 'test_user' });
+
+  let project = server.create('project');
+  let { organization } = project;
+  project.createTaskList({ inbox: true });
+
+  let githubRepo = server.create('githubRepo');
+  server.create('project-github-repo', { githubRepo, project });
+
+  authenticateSession(this.application, { user_id: user.id });
+
+  projectTasksIndexPage.visit({ organization: organization.slug, project: project.slug });
+
+  andThen(() => {
+    projectTasksIndexPage.clickNewTask();
+  });
+
+  andThen(() => {
+    projectTasksNewPage.taskTitle('A task title')
+                       .taskMarkdown('A task body')
+                       .githubRepo.select.fillIn(githubRepo.name);
+  });
+
+  andThen(() => {
+    projectTasksNewPage.clickSubmit();
+  });
+
+  andThen(() => {
+    assert.equal(server.schema.tasks.all().models.length, 1, 'A task has been created.');
+
+    let [task] = server.schema.tasks.all().models;
+    assert.equal(task.githubRepoId, githubRepo.id, 'The correct github repo was assigned.');
+  });
+});

tests/integration/components/select/github-repo-test.js

@@ -0,0 +1,69 @@
+import Ember from 'ember';
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+import selectGithubRepoComponent from '../../../pages/components/select/github-repo';
+import PageObject from 'ember-cli-page-object';
+
+const { get, run, set } = Ember;
+
+let page = PageObject.create(selectGithubRepoComponent);
+
+function renderPage() {
+  page.render(hbs`
+    {{select/github-repo
+      githubRepos=githubRepos
+      selectedRepo=selectedRepo
+      onSelected=(action (mut selectedRepo))
+    }}
+  `);
+}
+
+moduleForComponent('select/github-repo', 'Integration | Component | select/github repo', {
+  integration: true,
+  beforeEach() {
+    page.setContext(this);
+  },
+  afterEach() {
+    page.removeContext();
+  }
+});
+
+test('it renders options', function(assert) {
+  assert.expect(3);
+
+  let githubRepos = [
+    { name: 'Repo 1', id: 1 },
+    { name: 'Repo 2', id: 2 }
+  ];
+
+  set(this, 'githubRepos', githubRepos);
+
+  renderPage();
+
+  assert.equal(page.select.options(0).text, 'None (default)', 'The default option of none renders.');
+  assert.equal(page.select.options(1).text, 'Repo 1');
+  assert.equal(page.select.options(2).text, 'Repo 2');
+});
+
+test('it triggers action on selection', function(assert) {
+  assert.expect(2);
+
+  let [repo1, repo2] = [
+    { name: 'Repo 1', id: 1 },
+    { name: 'Repo 2', id: 2 }
+  ];
+
+  set(this, 'githubRepos', [repo1, repo2]);
+
+  renderPage();
+
+  run(() => page.select.fillIn('Repo 1'));
+  run(() => {
+    assert.deepEqual(get(this, 'selectedRepo'), repo1);
+  });
+
+  run(() => page.select.fillIn('Repo 2'));
+  run(() => {
+    assert.deepEqual(get(this, 'selectedRepo'), repo2);
+  });
+});

tests/pages/components/select/github-repo.js

@@ -0,0 +1,21 @@
+import { collection } from 'ember-cli-page-object';
+import { fullScope } from 'ember-cli-page-object/extend';
+import { select } from 'code-corps-ember/tests/helpers/x-select';
+
+export default {
+  scope: '.select-github-repo',
+
+  select: {
+    scope: 'select:eq(0)',
+
+    fillIn(text) {
+      let scope = fullScope(this, this.scope);
+      select(scope, text);
+      return this;
+    },
+
+    options: collection({
+      itemScope: 'option'
+    })
+  }
+};

tests/pages/project/tasks/new.js

@@ -10,6 +10,7 @@ import {
 import projectMenu from 'code-corps-ember/tests/pages/components/project-menu';
 import projectSkillsList from 'code-corps-ember/tests/pages/components/project-skills-list';
 import skillsTypeahead from 'code-corps-ember/tests/pages/components/skills-typeahead';
+import githubRepo from 'code-corps-ember/tests/pages/components/select/github-repo';
 
 export default create({
   clickPreviewTask: clickable('.preview'),
@@ -19,6 +20,8 @@ export default create({
     scope: '.error'
   }),
 
+  githubRepo,
+
   taskTitle: fillable('[name=title]'),
   taskMarkdown: fillable('[name=markdown]'),
 

tests/unit/components/power-select/before-options-test.js → tests/unit/components/power-select/before-task-options-test.js

@@ -4,8 +4,8 @@ import Ember from 'ember';
 const { Controller, set } = Ember;
 
 moduleForComponent(
-  'power-select/before-options',
-  'Unit | Component | power select before options',
+  'power-select/before-task-options',
+  'Unit | Component | power select before task options',
   {
     unit: true
   }

tests/unit/models/task-test.js

@@ -7,6 +7,7 @@ moduleForModel('task', 'Unit | Model | task', {
   needs: [
     'model:comment',
     'model:comment-user-mention',
+    'model:github-repo',
     'model:project',
     'model:task-list',
     'model:task-skill',
@@ -21,7 +22,8 @@ test('it exists', function(assert) {
   assert.ok(!!model);
 });
 
-testForAttributes('task', ['body', 'githubId', 'insertedAt', 'markdown', 'number', 'order', 'position', 'status', 'title']);
+testForAttributes('task', ['body', 'insertedAt', 'markdown', 'number', 'order', 'position', 'status', 'title']);
+testForBelongsTo('task', 'githubRepo');
 testForBelongsTo('task', 'project');
 testForBelongsTo('task', 'taskList');
 testForBelongsTo('task', 'user');

tests/unit/serializers/task-test.js

@@ -5,6 +5,7 @@ moduleForModel('task', 'Unit | Serializer | task', {
   needs: [
     'model:comment',
     'model:comment-user-mention',
+    'model:github-repo',
     'model:project',
     'model:task-list',
     'model:task-skill',