Feature/kas 2430 gebruik vergaderactiviteit codelist uit backend om keuzelijst op te stellen in frontend

app/components/agenda/agenda-header.hbs

@@ -15,13 +15,13 @@
                 {{moment-format @meeting.plannedStart "HH:mm"}}
               {{/unless}}
             </h4>
-            {{#if @meeting.kindToShow.label}}
+            {{#if @meeting.kind.label}}
               <span
                 data-test-agenda-header-kind
                 class="auk-u-text-muted auk-body-1"
               >
                 -
-                {{await @meeting.kindToShow.label}}
+                {{@meeting.kind.label}}
               </span>
             {{/if}}
           </div>

app/components/agenda/future-agendas.hbs

@@ -94,7 +94,7 @@
               {{/if}}
             </td>
             <td>
-              {{meeting.kindToShow.label}}
+              {{meeting.kind.label}}
             </td>
             <td class="auk-u-text-align--center">
               <Auk::Button

app/components/agenda/printable-agenda.hbs

@@ -18,7 +18,7 @@
         )
       }}
       -
-      {{@meeting.kindToShow.altLabel}}
+      {{kind-print-label @meeting.kind}}
     </h2>
 
     <div class="auk-content">

app/components/meeting/edit-meeting-modal.hbs

@@ -1,7 +1,11 @@
 <Auk::Modal @size="large">
   <Auk::Modal::Header @title={{t "edit-meeting"}} @onClose={{@onCancel}} />
   <Auk::Modal::Body>
-    <Utils::KindSelector @kind={{this.kind}} @setAction={{this.setKind}} />
+    <Utils::KindSelector
+      @selectedKind={{this.kind}}
+      @onChange={{this.setKind}}
+      @isLoading={{this.initializeKind.isRunning}}
+    />
     <div class="auk-u-mb-2">
       <div class="auk-form-group">
         <Auk::Label>{{t "start-date"}}</Auk::Label>
@@ -48,7 +52,7 @@
     <Auk::Button
       @skin="primary"
       {{on "click" (perform this.updateMeeting)}}
-      disabled={{this.updateMeeting.isRunning}}
+      disabled={{or (this.initializeKind.isRunning this.updateMeeting.isRunning)}}
       data-test-edit-meeting-save
     >
       {{t "edit"}}

app/components/meeting/edit-meeting-modal.js

@@ -3,8 +3,6 @@ import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
 import { task } from 'ember-concurrency';
-import EmberObject from '@ember/object';
-import CONFIG from 'frontend-kaleidos/utils/config';
 
 /**
  * @argument {meeting}
@@ -15,7 +13,6 @@ export default class MeetingEditMeetingComponent extends Component {
   @service toaster;
 
   @tracked kind;
-  @tracked selectedKindUri;
   @tracked startDate;
   @tracked extraInfo;
   @tracked _meetingNumber;
@@ -24,13 +21,9 @@ export default class MeetingEditMeetingComponent extends Component {
   constructor() {
     super(...arguments);
 
+    this.initializeKind.perform();
+
     this.meetingYear = this.args.meeting.plannedStart.getFullYear();
-    this.selectedKindUri = this.args.meeting.kind;
-    this.kind = EmberObject.create(
-      CONFIG.MINISTERRAAD_TYPES.TYPES.find(
-        (minsterraad) => minsterraad.uri === this.selectedKindUri
-      )
-    );
     this.startDate = this.args.meeting.plannedStart;
     this.extraInfo = this.args.meeting.extraInfo;
     this.meetingNumber = this.args.meeting.number;
@@ -57,13 +50,18 @@ export default class MeetingEditMeetingComponent extends Component {
     this._numberRepresentation = null;
   }
 
+  @task
+  *initializeKind() {
+    this.kind = yield this.args.meeting.kind;
+  }
+
   @task({ drop: true })
   *updateMeeting() {
     const now = new Date();
 
     this.args.meeting.extraInfo = this.extraInfo;
     this.args.meeting.plannedStart = this.startDate || now;
-    this.args.meeting.kind = this.selectedKindUri;
+    this.args.meeting.kind = this.kind;
     this.args.meeting.number = this.meetingNumber;
     this.args.meeting.numberRepresentation = this.numberRepresentation;
 
@@ -83,6 +81,6 @@ export default class MeetingEditMeetingComponent extends Component {
 
   @action
   setKind(kind) {
-    this.selectedKindUri = kind;
+    this.kind = kind;
   }
 }

app/components/meeting/new-meeting-modal.hbs

@@ -7,7 +7,9 @@
   <Auk::Modal::Body>
     <Utils::KindSelector
       data-test-new-meeting-kind
-      @setAction={{this.setKind}}
+      @onChange={{this.setKind}}
+      @selectedKind={{this.kind}}
+      @isLoading={{this.initializeKind.isRunning}}
     />
     {{#if this.isAnnexMeeting}}
       <div class="auk-u-mb-2">
@@ -16,12 +18,17 @@
           <Utils::ModelSelector
             data-test-new-meeting-related-main-meeting
             @modelName="meeting"
-            @searchField="numberRepresentation"
-            @propertyToShow="label"
+            @searchField="number-representation"
             @sortField="-planned-start"
             @selectedItems={{this.selectedMainMeeting}}
             @selectModel={{this.selectMainMeeting}}
-          />
+            as |model|
+          >
+            {{kind-print-label model.kind}}
+            {{t "of"}}
+            {{moment-format model.plannedStart "DD-MM-YYYY"}}
+            ({{model.numberRepresentation}})
+          </Utils::ModelSelector>
         </div>
       </div>
     {{else}}

app/components/meeting/new-meeting-modal.js

@@ -1,16 +1,12 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
-import { dropTask } from 'ember-concurrency';
+import { task, dropTask } from 'ember-concurrency';
 import { inject as service } from '@ember/service';
 import { A } from '@ember/array';
 import moment from 'moment';
 import CONSTANTS from 'frontend-kaleidos/config/constants';
-import CONFIG from 'frontend-kaleidos/utils/config';
-import {
-  isAnnexMeetingKind,
-  fetchClosestMeetingAndAgendaId,
-} from 'frontend-kaleidos/utils/meeting-utils';
+import { fetchClosestMeetingAndAgendaId } from 'frontend-kaleidos/utils/meeting-utils';
 
 /**
  * @argument {didSave}
@@ -21,8 +17,9 @@ export default class MeetingNewMeetingModal extends Component {
   @service newsletterService;
   @service toaster;
 
+  @tracked kind = null;
   @tracked selectedMainMeeting = null;
-  @tracked selectedKindUri = null;
+  @tracked isAnnexMeeting = false;
   @tracked isEditingFormattedMeetingIdentifier = false;
   @tracked _meetingNumber = null;
   @tracked _formattedMeetingIdentifier = null;
@@ -32,11 +29,15 @@ export default class MeetingNewMeetingModal extends Component {
   constructor() {
     super(...arguments);
 
+    this.initializeKind.perform();
     this.initializeMeetingNumber.perform();
   }
 
-  get isAnnexMeeting() {
-    return isAnnexMeetingKind(this.selectedKindUri);
+  get meetingKindPostfix() {
+    if (this.kind?.uri === CONSTANTS.MEETING_KINDS.PVV) {
+      return 'VV';
+    }
+    return '';
   }
 
   get formattedMeetingIdentifier() {
@@ -59,6 +60,13 @@ export default class MeetingNewMeetingModal extends Component {
     this._formattedMeetingIdentifier = null;
   }
 
+  @task
+  *initializeKind() {
+    this.kind = yield this.store.findRecordByUri('concept', CONSTANTS.MEETING_KINDS.MINISTERRAAD);
+    const broader = yield this.kind?.broader;
+    this.isAnnexMeeting = broader?.uri === CONSTANTS.MEETING_KINDS.ANNEX;
+  }
+
   @dropTask
   *initializeMeetingNumber() {
     const meeting = yield this.store.queryOne('meeting', {
@@ -85,7 +93,7 @@ export default class MeetingNewMeetingModal extends Component {
       extraInfo: this.extraInfo,
       isFinal: false,
       plannedStart: startDate,
-      kind: this.selectedKindUri ?? CONFIG.MINISTERRAAD_TYPES.DEFAULT,
+      kind: this.kind,
       mainMeeting: this.selectedMainMeeting,
       number: this.meetingNumber,
       numberRepresentation: this.formattedMeetingIdentifier,
@@ -96,7 +104,7 @@ export default class MeetingNewMeetingModal extends Component {
     try {
       yield meeting.save();
       const agenda = yield this.createAgenda(meeting, now);
-      if (!meeting.isAnnex && closestMeeting) {
+      if (!this.isAnnexMeeting && closestMeeting) {
         yield this.createAgendaitemToApproveMinutes(
           agenda,
           meeting,
@@ -171,10 +179,7 @@ export default class MeetingNewMeetingModal extends Component {
 
   @action
   selectMainMeeting(mainMeeting) {
-    const kind = CONFIG.MINISTERRAAD_TYPES.TYPES.find(
-      (minsterraad) => minsterraad.uri === this.selectedKindUri
-    );
-    const postfix = (kind && kind.postfix) || '';
+    const postfix = this.meetingKindPostfix;
     this.selectedMainMeeting = mainMeeting;
     this.startDate = mainMeeting.plannedStart;
     this.meetingNumber = mainMeeting.number;
@@ -188,8 +193,12 @@ export default class MeetingNewMeetingModal extends Component {
   }
 
   @action
-  setKind(kind) {
-    this.selectedKindUri = kind;
+  async setKind(kind) {
+    this.kind = kind;
+
+    const broader = await this.kind?.broader;
+    this.isAnnexMeeting = broader?.uri === CONSTANTS.MEETING_KINDS.ANNEX;
+
     if (!this.isAnnexMeeting) {
       this.selectedMainMeeting = null;
       this.initializeMeetingNumber.perform();

app/components/newsletter/newsletter-header-overview.hbs

@@ -10,7 +10,7 @@
             >
               {{t "newsletter-overview-pdf-name"}}
               -
-              {{@meeting.kindToShow.label}}
+              {{@meeting.kind.label}}
               {{moment-format @meeting.plannedStart "DD MMMM YYYY"}}
             </h4>
           </div>

app/components/newsletter/newsletter-meeting.hbs

@@ -2,7 +2,7 @@
 {{!-- template-lint-disable no-action --}}
 <div class="auk-o-flex auk-o-flex--justify-between auk-o-flex--align-baseline">
   <h2 class="auk-h2 auk-u-text-family-serif auk-u-text-capitalize" data-test-newsletter-meeting-title>
-    {{t "newsletter-overview-pdf-name"}} - {{this.meeting.kindToShow.altLabel}} {{t "of"}} {{moment-format this.meeting.plannedStart "dddd DD-MM-YYYY"}}
+    {{t "newsletter-overview-pdf-name"}} - {{kind-print-label this.meeting.kind}} {{t "of"}} {{moment-format this.meeting.plannedStart "dddd DD-MM-YYYY"}}
   </h2>
   {{#if (and this.allowEditing this.currentSession.isEditor)}}
     <div class="auk-u-ml-4">

app/components/utils/kind-selector.hbs

@@ -1,22 +1,18 @@
-{{! TODO: octane-refactor }}
-{{! template-lint-disable no-action }}
-<div data-test-utils-kind-selector class="auk-form-group">
-  {{#if (not this.hideLabel)}}
+{{#if this.isLoading}}
+  <div class="auk-u-text-muted">
+    {{t "please-be-patient"}}
+    <div class="auk-loader" role="alert" aria-busy="true"></div>
+  </div>
+{{else}}
+  <div data-test-utils-kind-selector class="auk-form-group">
     <Auk::Label>{{t "kind"}}</Auk::Label>
-  {{/if}}
-  {{#if this.isLoading}}
-    <div class="auk-u-text-muted">
-      {{t "please-be-patient"}}
-      <div class="auk-loader" role="alert" aria-busy="true"></div>
-    </div>
-  {{else}}
     <PowerSelect
       @options={{this.options}}
-      @selected={{this.selectedkind}}
-      @onChange={{action "setAction"}}
+      @selected={{@selectedKind}}
+      @onChange={{@onChange}}
       as |option|
     >
       {{option.label}}
     </PowerSelect>
-  {{/if}}
-</div>
+  </div>
+{{/if}}

app/components/utils/kind-selector.js

@@ -1,29 +1,42 @@
-/* eslint-disable ember/no-arrow-function-computed-properties */
-// TODO: octane-refactor
-// eslint-disable-next-line ember/no-classic-components
-import Component from '@ember/component';
-import CONFIG from 'frontend-kaleidos/utils/config';
-import EmberObject, { computed } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { task } from 'ember-concurrency';
+import CONSTANTS from '../../config/constants';
+import { PAGE_SIZE } from 'frontend-kaleidos/config/config';
 
-// TODO: octane-refactor
-// eslint-disable-next-line ember/no-classic-classes, ember/require-tagless-components
-export default Component.extend({
-  classNames: ['auk-u-mb-2'],
-  isLoading: null,
-  hideLabel: null,
+/**
+ * @argument {Concept} selectedKind The meeting kind to set the dropdown to
+ * @argument {function} onChange Action to perform once a meeting kind has been selected
+ * @argument {boolean} disabled
+ */
+export default class UtilsKindSelector extends Component {
+  @service store;
 
-  options: computed(() => CONFIG.MINISTERRAAD_TYPES.TYPES.map((meetingType) => EmberObject.create(meetingType))),
+  @tracked options;
 
-  selectedkind: computed('kind.uri', 'options', function() {
-    return this.options.find((kind) => this.kind && kind.uri === this.kind.uri) || this.options.get('firstObject');
-  }),
+  constructor() {
+    super(...arguments);
 
-  // TODO: octane-refactor
-  // eslint-disable-next-line ember/no-actions-hash
-  actions: {
-    setAction(meetingType) {
-      this.set('selectedkind', meetingType);
-      this.setAction(meetingType.get('uri'));
-    },
-  },
-});
+    this.loadKinds.perform();
+  }
+
+  get isLoading() {
+    return this.args.isLoading || this.loadKinds.isRunning;
+  }
+
+  @task
+  *loadKinds() {
+    this.options = yield this.store.query('concept', {
+      filter: {
+        'concept-schemes': {
+          ':uri:': CONSTANTS.CONCEPT_SCHEMES.VERGADERACTIVITEIT,
+        },
+        ':has-no:narrower': true, // Only the most specific concepts, i.e. the actual meeting kinds (so no "Annex")
+      },
+      include: 'broader,narrower',
+      'page[size]': PAGE_SIZE.CODE_LISTS,
+      sort: 'position',
+    });
+  }
+}

app/config/config.js

@@ -9,7 +9,6 @@ export const PAGE_SIZE = {
   PIECES: 500,
   ACTIVITIES: 500,
   CASES: 500,
-
   SELECT: 10,
 };