Merge pull request #7701 from stopfstedt/5304_course_objective_viz_mu…

…ltiple_parents

list out all mapped competencies, not just the one linked to the firs…

packages/ilios-common/addon-test-support/ilios-common/page-objects/components/visualizer-course-objectives.js

@@ -26,8 +26,8 @@ const definition = {
         scope: '[data-test-objective]',
         toggle: clickable('button'),
       },
-      competency: {
-        scope: '[data-test-competency]',
+      competencies: {
+        scope: '[data-test-competencies]',
         toggle: clickable('button'),
       },
       sessions: {
@@ -42,7 +42,7 @@ const definition = {
     rows: collection('tbody tr', {
       percentage: text('[data-test-percentage]'),
       objective: text('[data-test-objective]'),
-      competency: text('[data-test-competency]'),
+      competencies: text('[data-test-competencies]'),
       sessions: {
         scope: '[data-test-sessions]',
         links: collection('a', {

packages/ilios-common/addon/components/visualizer-course-objectives.hbs

@@ -78,11 +78,11 @@
             <SortableTh
               @colspan="2"
               @sortedAscending={{this.sortedAscending}}
-              @sortedBy={{or (eq this.sortBy "competency") (eq this.sortBy "competency:desc")}}
-              @onClick={{fn this.setSortBy "competency"}}
-              data-test-competency
+              @sortedBy={{or (eq this.sortBy "competencies") (eq this.sortBy "competencies:desc")}}
+              @onClick={{fn this.setSortBy "competencies"}}
+              data-test-competencies
             >
-              {{t "general.competency"}}
+              {{t "general.competencies"}}
             </SortableTh>
             <SortableTh
               @colspan="2"
@@ -109,7 +109,7 @@
             <tr>
               <td data-test-percentage>{{row.percentageLabel}}</td>
               <td class="objective" colspan="3" data-test-objective>{{{row.objective}}}</td>
-              <td colspan="2" data-test-competency>{{row.competency}}</td>
+              <td colspan="2" data-test-competencies>{{row.competencies}}</td>
               <td colspan="2" data-test-sessions>
                 {{#each row.sessions as |session index|}}
                   <LinkTo @route="session" @models={{array @course session}}>

packages/ilios-common/addon/components/visualizer-course-objectives.js

@@ -9,7 +9,7 @@ import { use } from 'ember-could-get-used-to-this';
 import { TrackedAsyncData } from 'ember-async-data';
 import { cached } from '@glimmer/tracking';
 import AsyncProcess from 'ilios-common/classes/async-process';
-import { mapBy, sortBy } from 'ilios-common/utils/array-helpers';
+import { mapBy, sortBy, uniqueValues } from 'ilios-common/utils/array-helpers';
 
 export default class VisualizerCourseObjectives extends Component {
   @service router;
@@ -57,7 +57,7 @@ export default class VisualizerCourseObjectives extends Component {
       rhett.percentage = obj.percentage * 1000;
       rhett.percentageLabel = obj.label;
       rhett.objective = obj.meta.courseObjective.title;
-      rhett.competency = obj.meta.competency?.title;
+      rhett.competencies = obj.meta.competencies;
       rhett.sessions = sortBy(mapBy(obj.meta.sessionObjectives, 'session'), 'title');
       rhett.sessionTitles = mapBy(rhett.sessions, 'title').join(', ');
       return rhett;
@@ -131,9 +131,14 @@ export default class VisualizerCourseObjectives extends Component {
     const courseObjectives = await this.args.course.courseObjectives;
     const mappedObjectives = await map(courseObjectives.slice(), async (courseObjective) => {
       const programYearObjectives = (await courseObjective.programYearObjectives).slice();
-      const competency = programYearObjectives.length
-        ? await programYearObjectives[0].competency
-        : null;
+      const competencyTitles = (
+        await map(programYearObjectives, async (pyObjective) => {
+          const competency = await pyObjective.competency;
+          return competency ? competency.title : null;
+        })
+      )
+        .filter((title) => !!title)
+        .sort();
       const minutes = sessionCourseObjectiveMap.map((obj) => {
         if (obj.objectives.includes(courseObjective.get('id'))) {
           return obj.minutes;
@@ -145,7 +150,7 @@ export default class VisualizerCourseObjectives extends Component {
         obj.objectives.includes(courseObjective.get('id')),
       );
       const meta = {
-        competency,
+        competencies: uniqueValues(competencyTitles).join(', '),
         courseObjective,
         sessionObjectives,
       };
@@ -179,8 +184,8 @@ export default class VisualizerCourseObjectives extends Component {
     const { data, meta } = obj;
 
     let objectiveTitle = meta.courseObjective.title;
-    if (meta.competency) {
-      objectiveTitle += `(${meta.competency.title})`;
+    if (meta.competencies) {
+      objectiveTitle += `(${meta.competencies})`;
     }
 
     const title = htmlSafe(`${objectiveTitle} • ${data} ${this.intl.t('general.minutes')}`);

packages/test-app/tests/integration/components/visualizer-course-objectives-test.js

@@ -23,9 +23,12 @@ module('Integration | Component | visualizer-course-objectives', function (hooks
     const programYearObjective3 = this.server.create('programYearObjective', {
       competency: competencies[2],
     });
+    const programYearObjective4 = this.server.create('programYearObjective', {
+      competency: competencies[1],
+    });
     const courseObjective1 = this.server.create('courseObjective', {
       course,
-      programYearObjectives: [programYearObjective1],
+      programYearObjectives: [programYearObjective1, programYearObjective2, programYearObjective4],
     });
     const courseObjective2 = this.server.create('courseObjective', {
       course,
@@ -97,13 +100,13 @@ module('Integration | Component | visualizer-course-objectives', function (hooks
     assert.strictEqual(component.untaughtObjectives.items[0].text, 'course objective 2');
     assert.strictEqual(component.dataTable.header.percentage.text, 'Percentage');
     assert.strictEqual(component.dataTable.header.objective.text, 'Course Objective');
-    assert.strictEqual(component.dataTable.header.competency.text, 'Competency');
+    assert.strictEqual(component.dataTable.header.competencies.text, 'Competencies');
     assert.strictEqual(component.dataTable.header.sessions.text, 'Sessions');
     assert.strictEqual(component.dataTable.header.minutes.text, 'Minutes');
     assert.strictEqual(component.dataTable.rows.length, 3);
     assert.strictEqual(component.dataTable.rows[0].percentage, '77.8%');
     assert.strictEqual(component.dataTable.rows[0].objective, 'course objective 0');
-    assert.strictEqual(component.dataTable.rows[0].competency, 'competency 0');
+    assert.strictEqual(component.dataTable.rows[0].competencies, 'competency 0, competency 1');
     assert.strictEqual(component.dataTable.rows[0].sessions.links.length, 1);
     assert.strictEqual(
       component.dataTable.rows[0].sessions.links[0].text,
@@ -113,7 +116,7 @@ module('Integration | Component | visualizer-course-objectives', function (hooks
     assert.strictEqual(component.dataTable.rows[0].minutes, '630');
     assert.strictEqual(component.dataTable.rows[1].percentage, '22.2%');
     assert.strictEqual(component.dataTable.rows[1].objective, 'course objective 1');
-    assert.strictEqual(component.dataTable.rows[1].competency, 'competency 1');
+    assert.strictEqual(component.dataTable.rows[1].competencies, 'competency 1');
     assert.strictEqual(component.dataTable.rows[1].sessions.links.length, 1);
     assert.strictEqual(
       component.dataTable.rows[1].sessions.links[0].text,
@@ -123,7 +126,7 @@ module('Integration | Component | visualizer-course-objectives', function (hooks
     assert.strictEqual(component.dataTable.rows[1].minutes, '180');
     assert.strictEqual(component.dataTable.rows[2].percentage, '0.0%');
     assert.strictEqual(component.dataTable.rows[2].objective, 'course objective 2');
-    assert.strictEqual(component.dataTable.rows[2].competency, 'competency 2');
+    assert.strictEqual(component.dataTable.rows[2].competencies, 'competency 2');
     assert.strictEqual(component.dataTable.rows[2].sessions.links.length, 1);
     assert.strictEqual(component.dataTable.rows[2].sessions.links[0].text, 'Empty Session');
     assert.strictEqual(component.dataTable.rows[2].sessions.links[0].url, '/courses/1/sessions/3');
@@ -174,17 +177,17 @@ module('Integration | Component | visualizer-course-objectives', function (hooks
       hbs`<VisualizerCourseObjectives @course={{this.course}} @isIcon={{false}} @showDataTable={{true}} />
 `,
     );
-    assert.strictEqual(component.dataTable.rows[0].competency, 'competency 0');
-    assert.strictEqual(component.dataTable.rows[1].competency, 'competency 1');
-    assert.strictEqual(component.dataTable.rows[2].competency, 'competency 2');
-    await component.dataTable.header.competency.toggle();
-    assert.strictEqual(component.dataTable.rows[0].competency, 'competency 0');
-    assert.strictEqual(component.dataTable.rows[1].competency, 'competency 1');
-    assert.strictEqual(component.dataTable.rows[2].competency, 'competency 2');
-    await component.dataTable.header.competency.toggle();
-    assert.strictEqual(component.dataTable.rows[0].competency, 'competency 2');
-    assert.strictEqual(component.dataTable.rows[1].competency, 'competency 1');
-    assert.strictEqual(component.dataTable.rows[2].competency, 'competency 0');
+    assert.strictEqual(component.dataTable.rows[0].competencies, 'competency 0, competency 1');
+    assert.strictEqual(component.dataTable.rows[1].competencies, 'competency 1');
+    assert.strictEqual(component.dataTable.rows[2].competencies, 'competency 2');
+    await component.dataTable.header.competencies.toggle();
+    assert.strictEqual(component.dataTable.rows[0].competencies, 'competency 0, competency 1');
+    assert.strictEqual(component.dataTable.rows[1].competencies, 'competency 1');
+    assert.strictEqual(component.dataTable.rows[2].competencies, 'competency 2');
+    await component.dataTable.header.competencies.toggle();
+    assert.strictEqual(component.dataTable.rows[0].competencies, 'competency 2');
+    assert.strictEqual(component.dataTable.rows[1].competencies, 'competency 1');
+    assert.strictEqual(component.dataTable.rows[2].competencies, 'competency 0, competency 1');
   });
 
   test('sort data-table by sessions', async function (assert) {