@lblod/ember-rdfa-editor-lblod-plugins 25.2.2 → 26.0.0

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @lblod/ember-rdfa-editor-lblod-plugins
 
+## 26.0.0
+
+### Major Changes
+
+- [#504](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/504) [`82dd848`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/82dd848062665bf907055d47231beaa156ec243c) Thanks [@elpoelma](https://github.com/elpoelma)! - Adjustments to `lmb-plugin`:
+
+  - Rework `fetchMandatees` queries into `fetchElectees`
+    - Fetches all electees for a certain legislation period + all non-elected people with a mandate
+    - Replace `Mandatee` model by simpler `Electee` model
+  - Adjust UI components to reflect the `Mandatee` to `Electee` change
+
+- [#504](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/504) [`82dd848`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/82dd848062665bf907055d47231beaa156ec243c) Thanks [@elpoelma](https://github.com/elpoelma)! - Adjustments to `person` variable:
+  - Removal of unused `content` attribute
+  - Removal of `mandatee` attribute. Replaced by `value` attribute which contains an object of type `Person`.
+    ```ts
+    type Person = {
+      uri: string;
+      firstName: string;
+      lastName: string;
+    };
+    ```
+  - Adjust parsing rules of `person_variable` nodespec to work with old and new serializations
+  - Is now more generic, instead of relying on `Mandatee` instances
+
+### Minor Changes
+
+- [#509](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/509) [`092cc56`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/092cc569ef130e65611bb6de0e45c6d73f9c3718) Thanks [@elpoelma](https://github.com/elpoelma)! - Mandatee table plugin: ensure synchronisation warning shown in mandatee tables is clearer/more explicit
+
+### Patch Changes
+
+- [#504](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/504) [`c5d4e05`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/c5d4e05c9b1e7a37bba6f79df862d5505aebbd47) Thanks [@elpoelma](https://github.com/elpoelma)! - person-variable plugin: remove unused `content` node-attribute
+
+- [#505](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/505) [`0cb4f55`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/0cb4f555effe599d6e481d14bfcb6de7ac15fb66) Thanks [@lagartoverde](https://github.com/lagartoverde)! - Use new template uris on variables
+
+- [#508](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/508) [`05f5e77`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/05f5e7711f7062132f1912f6675b8fd440d54daf) Thanks [@elpoelma](https://github.com/elpoelma)! - Decision article structures: remove unnecessary css placeholder from content section
+
 ## 25.2.2
 
 ### Patch Changes

package/addon/components/lmb-plugin/insert.ts

@@ -5,7 +5,7 @@ import { AddIcon } from '@appuniversum/ember-appuniversum/components/icons/add';
 
 import { SayController } from '@lblod/ember-rdfa-editor';
 import { LmbPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/lmb-plugin';
-import Mandatee from '@lblod/ember-rdfa-editor-lblod-plugins/models/mandatee';
+import Electee from '@lblod/ember-rdfa-editor-lblod-plugins/models/electee';
 import { v4 as uuidv4 } from 'uuid';
 import {
   DCT,
@@ -16,10 +16,12 @@ import { replaceSelectionWithAndSelectNode } from '@lblod/ember-rdfa-editor-lblo
 import { service } from '@ember/service';
 import IntlService from 'ember-intl/services/intl';
 import { sayDataFactory } from '@lblod/ember-rdfa-editor/core/say-data-factory';
+import { Person } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/variable-plugin/variables';
 
 interface Args {
   controller: SayController;
   config: LmbPluginConfig;
+  templateMode?: boolean;
 }
 
 export default class LmbPluginInsertComponent extends Component<Args> {
@@ -44,11 +46,21 @@ export default class LmbPluginInsertComponent extends Component<Args> {
   }
 
   @action
-  onInsert(mandatee: Mandatee) {
-    const mappingSubject = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+  onInsert(electee: Electee) {
+    const mappingSubject = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const variableId = uuidv4();
 
+    const person: Person = {
+      uri: electee.uri,
+      firstName: electee.firstName,
+      lastName: electee.lastName,
+    };
+
     const label = this.intl.t('variable.person.label', {
       locale: this.controller.documentLanguage,
     });
@@ -56,7 +68,7 @@ export default class LmbPluginInsertComponent extends Component<Args> {
       subject: mappingSubject,
       rdfaNodeType: 'resource',
       __rdfaId: variableId,
-      mandatee,
+      value: person,
       properties: [
         {
           predicate: RDF('type').full,

package/addon/components/lmb-plugin/list.hbs

@@ -11,24 +11,8 @@
       </th>
       <th>
         <Common::Sort::SortableTableHeader
-          @field='status'
-          @label={{t 'lmb-plugin.modal.fields.status'}}
-          @sort={{@sort}}
-          @setSort={{@setSort}}
-        />
-      </th>
-      <th>
-        <Common::Sort::SortableTableHeader
-          @field='fractie'
-          @label={{t 'lmb-plugin.modal.fields.fractie'}}
-          @sort={{@sort}}
-          @setSort={{@setSort}}
-        />
-      </th>
-      <th>
-        <Common::Sort::SortableTableHeader
-          @field='role'
-          @label={{t 'lmb-plugin.modal.fields.role'}}
+          @field='kandidatenlijst'
+          @label={{t 'lmb-plugin.modal.fields.kandidatenlijst'}}
           @sort={{@sort}}
           @setSort={{@setSort}}
         />
@@ -39,7 +23,7 @@
   <:body>
     {{#if @services.isRunning}}
       <tr>
-        <td colspan='5'>
+        <td colspan='100%'>
           <AuLoader @centered={{true}}>
             {{t 'common.search.loading'}}
           </AuLoader>
@@ -50,9 +34,13 @@
         {{#each @services.value.results as |row|}}
           <tr>
             <td>{{row.fullName}}</td>
-            <td>{{row.status}}</td>
-            <td>{{row.fractie}}</td>
-            <td>{{row.role}}</td>
+            <td>
+              {{#if row.kandidatenlijst}}
+                {{row.kandidatenlijst}}
+              {{else}}
+                <span class='au-u-italic'>{{t 'common.not-applicable'}}</span>
+              {{/if}}
+            </td>
             <td class='au-u-text-center'>
               <AuButton {{on 'click' (fn @insert row)}}>
                 {{t 'lmb-plugin.modal.insert'}}
@@ -60,6 +48,12 @@
             </td>
           </tr>
         {{/each}}
+      {{else}}
+        <tr>
+          <td colspan='100%'>
+            {{t 'common.search.no-results'}}
+          </td>
+        </tr>
       {{/if}}
     {{/if}}
   </:body>

package/addon/components/lmb-plugin/search-modal.ts

@@ -6,24 +6,24 @@ import { restartableTask, timeout } from 'ember-concurrency';
 import { task as trackedTask } from 'reactiveweb/ember-concurrency';
 import { LmbPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/lmb-plugin';
 
-import Mandatee from '@lblod/ember-rdfa-editor-lblod-plugins/models/mandatee';
+import Electee from '@lblod/ember-rdfa-editor-lblod-plugins/models/electee';
 import {
   FetchMandateesArgs,
-  fetchMandatees,
-} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/lmb-plugin/utils/fetchMandatees';
+  fetchElectees,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/lmb-plugin/utils/fetchElectees';
 import {
   BESTUURSPERIODES,
   BestuursperiodeLabel,
   BestuursperiodeURI,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
 import { isSome } from '@lblod/ember-rdfa-editor/utils/_private/option';
-export type SearchSort = [keyof Mandatee, 'ASC' | 'DESC'] | false;
+export type SearchSort = [keyof Electee, 'ASC' | 'DESC'] | false;
 
 interface Args {
   config: LmbPluginConfig;
   open: boolean;
   closeModal: () => void;
-  onInsert: (mandatee: Mandatee) => void;
+  onInsert: (electee: Electee) => void;
 }
 interface AdminPeriodOption {
   label: BestuursperiodeLabel;
@@ -118,7 +118,7 @@ export default class LmbPluginSearchModalComponent extends Component<Args> {
       }
 
       try {
-        const result = await fetchMandatees({
+        const result = await fetchElectees({
           endpoint,
           searchString,
           page,
@@ -127,14 +127,14 @@ export default class LmbPluginSearchModalComponent extends Component<Args> {
           period,
           adminUnitSearch,
         });
-        const { count, mandatees } = result;
+        const { count, electees } = result;
 
         return {
-          results: mandatees,
+          results: electees,
           totalCount: count,
         };
       } catch (err) {
-        console.error('Got an error fetching LMB data', err);
+        console.error('Got an error fetching electees', err);
         this.error = err;
       }
       return {
@@ -182,8 +182,8 @@ export default class LmbPluginSearchModalComponent extends Component<Args> {
     ++this.pageNumber;
   }
   @action
-  async onInsert(mandatee: Mandatee) {
-    this.args.onInsert(mandatee);
+  async onInsert(electee: Electee) {
+    this.args.onInsert(electee);
     await this.closeModal();
   }
 }

package/addon/components/location-plugin/insert.gts

@@ -54,6 +54,7 @@ interface Signature {
     controller: SayController;
     config: LocationPluginConfig;
     defaultMunicipality?: string;
+    templateMode?: boolean;
   };
   Element: HTMLLIElement;
 }
@@ -194,6 +195,7 @@ export default class LocationPluginInsertComponent extends Component<Signature>
         this.intl.t('location-plugin.default-label', {
           locale: this.documentLanguage,
         }),
+        this.args.templateMode,
       );
     }
     this.modalOpen = true;

package/addon/components/mandatee-table-plugin/node.gts

@@ -1,4 +1,6 @@
+import AuAlert from '@appuniversum/ember-appuniversum/components/au-alert';
 import AuIcon from '@appuniversum/ember-appuniversum/components/au-icon';
+import { AlertTriangleIcon } from '@appuniversum/ember-appuniversum/components/icons/alert-triangle';
 
 import { UserIcon } from '@appuniversum/ember-appuniversum/components/icons/user';
 import { service } from '@ember/service';
@@ -45,12 +47,19 @@ export default class MandateeTableNode extends Component<Sig> {
         />
         <div>
           <h6 class='say-mandatee-table__title'>{{this.title}}</h6>
-          <p class='say-mandatee-table__warning'>
-            {{this.warning}}
-          </p>
         </div>
       </div>
-      <div class='say-mandatee-table-content'>{{yield}}</div>
+      <div class='say-mandatee-table-content'>
+        <AuAlert
+          class='say-mandatee-table__warning'
+          @icon={{AlertTriangleIcon}}
+          @skin='warning'
+          @size='small'
+        >
+          {{this.warning}}
+        </AuAlert>
+        {{yield}}
+      </div>
     </div>
   </template>
 }

package/addon/components/structure-plugin/_private/structure.gts

@@ -5,7 +5,6 @@ import { tracked } from '@glimmer/tracking';
 import { SayView, Schema } from '@lblod/ember-rdfa-editor';
 import { redacted } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/confidentiality-plugin';
 import NestedProsemirror from '@lblod/ember-rdfa-editor-lblod-plugins/utils/nested-prosemirror';
-import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 import { color } from '@lblod/ember-rdfa-editor/plugins/color/marks/color';
 import { highlight } from '@lblod/ember-rdfa-editor/plugins/highlight/marks/highlight';
 import {
@@ -75,20 +74,6 @@ export default class Structure extends Component<Sig> {
     return this.args.node;
   }
 
-  get isEmpty() {
-    if (this.node.childCount > 1) {
-      return false;
-    }
-    const firstChild = unwrap(this.node.firstChild);
-    if (!firstChild.isTextblock) {
-      return false;
-    }
-    if (firstChild.childCount > 0) {
-      return false;
-    }
-    return true;
-  }
-
   get tag() {
     return 'div';
   }
@@ -188,7 +173,7 @@ export default class Structure extends Component<Sig> {
           </Tag>
         {{/let}}
       </div>
-      <div class='say-structure__content {{if this.isEmpty "say-empty" ""}}'>
+      <div class='say-structure__content'>
         {{yield}}
       </div>
     </div>

package/addon/components/variable-plugin/address/insert-variable.ts

@@ -8,6 +8,7 @@ import IntlService from 'ember-intl/services/intl';
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class VariablePluginAddressInsertVariableComponent extends Component<Args> {
@@ -35,6 +36,7 @@ export default class VariablePluginAddressInsertVariableComponent extends Compon
         this.intl.t('variable.address.label', {
           locale: this.documentLanguage,
         }),
+      this.args.templateMode,
     );
   }
 }

package/addon/components/variable-plugin/address/insert.ts

@@ -9,6 +9,7 @@ import { replaceSelectionWithAddress } from './utils';
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class InsertAddressComponent extends Component<Args> {
@@ -31,6 +32,7 @@ export default class InsertAddressComponent extends Component<Args> {
       this.intl.t('variable.address.label', {
         locale: this.documentLanguage,
       }),
+      this.args.templateMode,
     );
   }
 

package/addon/components/variable-plugin/address/utils.ts

@@ -10,9 +10,14 @@ import { v4 as uuidv4 } from 'uuid';
 export function replaceSelectionWithAddress(
   controller: SayController,
   label?: string,
+  templateMode?: boolean,
 ) {
-  const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
-  const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+  const mappingResource = `http://data.lblod.info/mappings/${
+    templateMode ? '--ref-uuid4-' : ''
+  }${uuidv4()}`;
+  const variableInstance = `http://data.lblod.info/variables/${
+    templateMode ? '--ref-uuid4-' : ''
+  }${uuidv4()}`;
 
   controller.withTransaction((tr) => {
     tr.replaceSelectionWith(

package/addon/components/variable-plugin/autofilled/insert.gts

@@ -23,6 +23,7 @@ import LabelInput from '@lblod/ember-rdfa-editor-lblod-plugins/components/variab
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class AutoFilledVariableInsertComponent extends Component<Args> {
@@ -60,8 +61,12 @@ export default class AutoFilledVariableInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingSubject = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingSubject = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const variableId = uuidv4();
 
     const placeholder = this.intl.t('variable.autofilled.label', {

package/addon/components/variable-plugin/codelist/insert.ts

@@ -26,6 +26,7 @@ export type CodelistInsertOptions = {
 type Args = {
   controller: SayController;
   options: CodelistInsertOptions;
+  templateMode?: boolean;
 };
 
 interface SelectStyle {
@@ -88,8 +89,12 @@ export default class CodelistInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingResource = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const codelistResource = this.selectedCodelist?.uri;
     const label =
       this.label ??

package/addon/components/variable-plugin/date/insert-variable.ts

@@ -16,6 +16,7 @@ import { replaceSelectionWithAndSelectNode } from '@lblod/ember-rdfa-editor-lblo
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class DateInsertVariableComponent extends Component<Args> {
@@ -41,8 +42,12 @@ export default class DateInsertVariableComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingResource = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
 
     const defaultLabel = this.intl.t('variable.date.label', {
       locale: this.documentLanguage,

package/addon/components/variable-plugin/date/insert.ts

@@ -15,6 +15,7 @@ import { AddIcon } from '@appuniversum/ember-appuniversum/components/icons/add';
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class DateInsertComponent extends Component<Args> {
@@ -36,9 +37,12 @@ export default class DateInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
-
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingResource = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const defaultLabel = this.intl.t('variable.date.label', {
       locale: this.documentLanguage,
     });

package/addon/components/variable-plugin/insert-variable-card.hbs

@@ -29,6 +29,7 @@
         <this.selectedVariable.component
           @controller={{this.controller}}
           @options={{this.selectedVariable.options}}
+          @templateMode={{@templateMode}}
         />
       {{/if}}
     </c.content>

package/addon/components/variable-plugin/location/insert.ts

@@ -14,6 +14,7 @@ export type LocationInsertOptions = {
 type Args = {
   controller: SayController;
   options: LocationInsertOptions;
+  templateMode?: boolean;
 };
 
 export default class LocationInsertComponent extends Component<Args> {
@@ -44,8 +45,12 @@ export default class LocationInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingResource = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
 
     const placeholder = this.intl.t('variable.location.label', {
       locale: this.documentLanguage,

package/addon/components/variable-plugin/number/insert.ts

@@ -17,6 +17,7 @@ import { replaceSelectionWithAndSelectNode } from '@lblod/ember-rdfa-editor-lblo
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class NumberInsertComponent extends Component<Args> {
@@ -85,9 +86,13 @@ export default class NumberInsertComponent extends Component<Args> {
   insert() {
     if (this.numberVariableError !== '') return;
 
-    const mappingResource = `http://data.lblod.info/mappings/${uuidv4()}`;
+    const mappingResource = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const subject = mappingResource;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
 
     const defaultLabel = this.intl.t('variable.number.label', {
       locale: this.documentLanguage,

package/addon/components/variable-plugin/person/edit.ts

@@ -4,7 +4,8 @@ import { SayController, PNode } from '@lblod/ember-rdfa-editor';
 import { NodeSelection } from '@lblod/ember-rdfa-editor';
 import { tracked } from '@glimmer/tracking';
 import { LmbPluginConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/lmb-plugin';
-import Mandatee from '@lblod/ember-rdfa-editor-lblod-plugins/models/mandatee';
+import Electee from '@lblod/ember-rdfa-editor-lblod-plugins/models/electee';
+import { Person } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/variable-plugin/variables/person';
 
 type Args = {
   controller: SayController;
@@ -44,12 +45,11 @@ export default class PersonEditComponent extends Component<Args> {
 
   get isEditing() {
     const personNode = this.selectedPersonNode;
-    return !!personNode?.node.attrs.mandatee;
+    return !!personNode?.node.attrs.value;
   }
 
   @action
   openModal() {
-    console.log('Open modal!!!');
     this.controller.focus();
     this.showModal = true;
   }
@@ -59,16 +59,16 @@ export default class PersonEditComponent extends Component<Args> {
     this.showModal = false;
   }
   @action
-  onInsert(mandatee: Mandatee) {
+  onInsert(electee: Electee) {
     const personNode = this.selectedPersonNode as PersonNode;
-    this.controller.withTransaction((tr) => {
-      tr.setNodeAttribute(personNode.pos, 'mandatee', mandatee);
-      return tr.setNodeAttribute(
-        personNode.pos,
-        'content',
-        mandatee.mandateeUri,
-      );
-    });
+    const person: Person = {
+      uri: electee.uri,
+      firstName: electee.firstName,
+      lastName: electee.lastName,
+    };
+    this.controller.withTransaction((tr) =>
+      tr.setNodeAttribute(personNode.pos, 'value', person),
+    );
     this.closeModal();
   }
 }

package/addon/components/variable-plugin/person/insert.ts

@@ -15,6 +15,7 @@ import { replaceSelectionWithAndSelectNode } from '@lblod/ember-rdfa-editor-lblo
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class PersonVariableInsertComponent extends Component<Args> {
@@ -40,8 +41,12 @@ export default class PersonVariableInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingSubject = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingSubject = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const variableId = uuidv4();
 
     const placeholder = this.intl.t('variable.person.label', {

package/addon/components/variable-plugin/person/nodeview.ts

@@ -3,7 +3,7 @@ import Component from '@glimmer/component';
 import { PNode, SayController } from '@lblod/ember-rdfa-editor';
 import { getOutgoingTriple } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
 import { EXT } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
-import Mandatee from '@lblod/ember-rdfa-editor-lblod-plugins/models/mandatee';
+import { Person } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/variable-plugin/variables';
 
 type Args = {
   getPos: () => number | undefined;
@@ -20,22 +20,22 @@ export default class PersonNodeviewComponent extends Component<Args> {
     return this.args.node;
   }
 
-  get mandatee() {
-    return this.node.attrs.mandatee as Mandatee | null;
+  get person() {
+    return this.node.attrs.value as Person | null;
   }
 
   get label() {
-    if (this.mandatee) return '';
+    if (this.person) return '';
     return getOutgoingTriple(this.node.attrs, EXT('label'))?.object.value;
   }
 
   get filled() {
-    return !!this.mandatee;
+    return !!this.person;
   }
 
   get content() {
-    if (this.filled) {
-      return this.mandatee?.fullName;
+    if (this.person) {
+      return `${this.person.firstName} ${this.person.lastName}`;
     } else {
       return this.label;
     }

package/addon/components/variable-plugin/text/insert.ts

@@ -15,6 +15,7 @@ import { replaceSelectionWithAndSelectNode } from '@lblod/ember-rdfa-editor-lblo
 
 type Args = {
   controller: SayController;
+  templateMode?: boolean;
 };
 
 export default class TextVariableInsertComponent extends Component<Args> {
@@ -40,8 +41,12 @@ export default class TextVariableInsertComponent extends Component<Args> {
 
   @action
   insert() {
-    const mappingSubject = `http://data.lblod.info/mappings/${uuidv4()}`;
-    const variableInstance = `http://data.lblod.info/variables/${uuidv4()}`;
+    const mappingSubject = `http://data.lblod.info/mappings/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
+    const variableInstance = `http://data.lblod.info/variables/${
+      this.args.templateMode ? '--ref-uuid4-' : ''
+    }${uuidv4()}`;
     const variableId = uuidv4();
 
     const placeholder = this.intl.t('variable.text.label', {