@lblod/ember-rdfa-editor-lblod-plugins 32.6.0 → 32.6.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @lblod/ember-rdfa-editor-lblod-plugins
 
+## 32.6.1
+
+### Patch Changes
+
+- [#600](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/pull/600) [`93cb522`](https://github.com/lblod/ember-rdfa-editor-lblod-plugins/commit/93cb522d59d066a00bb0c3b80f1de251948ad5fa) Thanks [@piemonkey](https://github.com/piemonkey)! - Display a warning for codelist variables with no codelist URI
+
 ## 32.6.0
 
 ### Minor Changes

package/addon/components/roadsign-regulation-plugin/roadsigns-modal.gts

@@ -393,7 +393,6 @@ export default class RoadsignsModal extends Component<Signature> {
                 </AuLabel>
                 <PowerSelect
                   @renderInPlace={{true}}
-                  {{! @glint-expect-error some type issue of ember-power-select }}
                   @verticalPosition='below'
                   @options={{this.typeOptions}}
                   @searchEnabled={{true}}
@@ -412,7 +411,6 @@ export default class RoadsignsModal extends Component<Signature> {
                 </AuLabel>
                 <PowerSelect
                   @renderInPlace={{true}}
-                  {{! @glint-expect-error some type issue of ember-power-select }}
                   @verticalPosition='below'
                   @searchEnabled={{true}}
                   @search={{this.searchCodes.perform}}
@@ -442,9 +440,7 @@ export default class RoadsignsModal extends Component<Signature> {
                     consume the value in the template and force powerselect to rerender.
                     Other tricks such as #let bindings also do not work. }}
                 {{#if this.codeCombinationOptions.length}}
-                  {{! @glint-expect-error some type issue of ember-power-select }}
                   <PowerSelectMultiple
-                    {{! @glint-expect-error some type issue of ember-power-select }}
                     @renderInPlace={{true}}
                     @verticalPosition='below'
                     @searchEnabled={{true}}
@@ -459,9 +455,7 @@ export default class RoadsignsModal extends Component<Signature> {
                     {{option.label}}
                   </PowerSelectMultiple>
                 {{else}}
-                  {{! @glint-expect-error some type issue of ember-power-select }}
                   <PowerSelectMultiple
-                    {{! @glint-expect-error some type issue of ember-power-select }}
                     @renderInPlace={{true}}
                     @verticalPosition='below'
                     @searchEnabled={{false}}
@@ -483,7 +477,6 @@ export default class RoadsignsModal extends Component<Signature> {
                 </AuLabel>
                 <PowerSelect
                   @renderInPlace={{true}}
-                  {{! @glint-expect-error some type issue of ember-power-select }}
                   @verticalPosition='below'
                   @options={{this.zonalityOptions}}
                   @searchEnabled={{false}}

package/addon/components/variable-plugin/codelist/{edit.ts → edit.gts}

@@ -1,5 +1,9 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
+import { on } from '@ember/modifier';
+import { eq, not } from 'ember-truth-helpers';
+import t from 'ember-intl/helpers/t';
+import PowerSelect from 'ember-power-select/components/power-select';
 import { SayController } from '@lblod/ember-rdfa-editor';
 import {
   CodeListOption,
@@ -12,15 +16,25 @@ import { trackedFunction } from 'reactiveweb/function';
 import { updateCodelistVariable } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/variable-plugin/utils/codelist-utils';
 import { Option } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 import { tracked } from '@glimmer/tracking';
+import AuCard from '@appuniversum/ember-appuniversum/components/au-card';
+import AuHeading from '@appuniversum/ember-appuniversum/components/au-heading';
+import AuLabel from '@appuniversum/ember-appuniversum/components/au-label';
+import PowerSelectMultiple from 'ember-power-select/components/power-select-multiple';
+import AuButton from '@appuniversum/ember-appuniversum/components/au-button';
+import { AlertTriangleIcon } from '@appuniversum/ember-appuniversum/components/icons/alert-triangle';
+import AuAlert from '@appuniversum/ember-appuniversum/components/au-alert';
+
 export type CodelistEditOptions = {
   endpoint: string;
 };
-type Args = {
-  controller: SayController;
-  options: CodelistEditOptions;
+type Sig = {
+  Args: {
+    controller: SayController;
+    options: CodelistEditOptions;
+  };
 };
 
-export default class CodelistEditComponent extends Component<Args> {
+export default class CodelistEditComponent extends Component<Sig> {
   @tracked selectedCodelistOption?: CodeListOption | CodeListOption[];
 
   get controller() {
@@ -46,7 +60,7 @@ export default class CodelistEditComponent extends Component<Args> {
     if (this.selectedCodelist) {
       const { node } = this.selectedCodelist;
       const source = node.attrs['source'] as Option<string>;
-      if (source) {
+      if (source && source !== 'UNKNOWN') {
         return source;
       }
     }
@@ -109,4 +123,68 @@ export default class CodelistEditComponent extends Component<Args> {
   updateCodelistOption(codelistOption: CodeListOption | CodeListOption[]) {
     this.selectedCodelistOption = codelistOption;
   }
+
+  <template>
+    {{#if this.showCard}}
+      <AuCard
+        @flex={{true}}
+        @divided={{true}}
+        @isOpenInitially={{true}}
+        @expandable={{true}}
+        @shadow={{true}}
+        @size='small'
+        as |c|
+      >
+        <c.header>
+          <AuHeading @level='3' @skin='6'>
+            {{t 'variable-plugin.enter-variable-value'}}
+          </AuHeading>
+        </c.header>
+        <c.content>
+          {{#if (eq this.codelistUri 'UNKNOWN')}}
+            <AuAlert @icon={{AlertTriangleIcon}} @skin='warning'>
+              {{t 'variable-plugin.unknown-codelist'}}
+            </AuAlert>
+          {{else}}
+            <AuLabel for='codelist-select'>
+              {{this.label}}
+            </AuLabel>
+            {{#if this.multiSelect}}
+              <PowerSelectMultiple
+                id='codelist-select'
+                @allowClear={{false}}
+                @searchEnabled={{true}}
+                @searchField='label'
+                @options={{this.codelistOptions.value.options}}
+                @selected={{this.selectedCodelistOption}}
+                @onChange={{this.updateCodelistOption}}
+                as |option|
+              >
+                {{option.label}}
+              </PowerSelectMultiple>
+            {{else}}
+              <PowerSelect
+                id='codelist-select'
+                @allowClear={{false}}
+                @searchEnabled={{true}}
+                @searchField='label'
+                @options={{this.codelistOptions.value.options}}
+                @selected={{this.selectedCodelistOption}}
+                @onChange={{this.updateCodelistOption}}
+                as |option|
+              >
+                {{option.label}}
+              </PowerSelect>
+            {{/if}}
+            <AuButton
+              {{on 'click' this.insert}}
+              @disabled={{not this.selectedCodelistOption}}
+            >
+              {{t 'editor-plugins.utils.insert'}}
+            </AuButton>
+          {{/if}}
+        </c.content>
+      </AuCard>
+    {{/if}}
+  </template>
 }

package/addon/plugins/variable-plugin/variables/codelist.ts

@@ -104,8 +104,10 @@ const parseDOMLegacy = [
           variable: variableUri,
           variableInstance: variableInstanceUri,
           label,
-          source: sourceUri,
-          codelist: codelistUri,
+          // These attrs are required but it's possible for older documents to get into a broken
+          // state. We mark these as unknown so we can push the user to fix this as we can't do it.
+          source: sourceUri ?? 'UNKNOWN',
+          codelist: codelistUri ?? 'UNKNOWN',
           selectionStyle,
         });
       }

package/addon/plugins/variable-plugin/variables/location.ts

@@ -98,7 +98,8 @@ const parseDOMLegacy = [
           variable: variableUri,
           variableInstance: variableInstanceUri,
           label,
-          source: sourceUri,
+          // Default to a blank string so the edit component uses the default
+          source: sourceUri ?? '',
         });
       }
       return false;

package/declarations/addon/components/variable-plugin/codelist/edit.d.ts

@@ -4,11 +4,13 @@ import { CodeListOption, CodeListOptions } from '@lblod/ember-rdfa-editor-lblod-
 export type CodelistEditOptions = {
     endpoint: string;
 };
-type Args = {
-    controller: SayController;
-    options: CodelistEditOptions;
+type Sig = {
+    Args: {
+        controller: SayController;
+        options: CodelistEditOptions;
+    };
 };
-export default class CodelistEditComponent extends Component<Args> {
+export default class CodelistEditComponent extends Component<Sig> {
     selectedCodelistOption?: CodeListOption | CodeListOption[];
     get controller(): SayController;
     get selectedCodelist(): {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lblod/ember-rdfa-editor-lblod-plugins",
-  "version": "32.6.0",
+  "version": "32.6.1",
   "description": "Ember addon providing lblod specific plugins for the ember-rdfa-editor",
   "keywords": [
     "ember-addon",

package/translations/en-US.yaml

@@ -220,6 +220,7 @@ variable-plugin:
   insert-variable: Insert variable
   button: Insert
   enter-variable-value: Select value
+  unknown-codelist: Unable to find possible values for this codelist
   label: Label
   labelPlaceholder: Type something...
   number:

package/translations/nl-BE.yaml

@@ -224,6 +224,7 @@ variable-plugin:
   insert-variable: Voeg variabele in
   button: Voeg in
   enter-variable-value: Selecteer waarde
+  unknown-codelist: Er werden geen mogelijke waarden voor deze codelijst gevonden
   label: Label
   labelPlaceholder: Type iets...
   number:

package/types/ember-power-select/components/power-select-multiple.d.ts

@@ -0,0 +1,7 @@
+// Types from ember-power-select but with tweaks to improve glint support. Can be removed if moving
+// to >v8.0
+declare module 'ember-power-select/components/power-select-multiple' {
+  import PowerSelect from 'ember-power-select/components/power-select';
+  export * from 'ember-power-select/components/power-select';
+  export default PowerSelect;
+}

package/types/ember-power-select/components/power-select.d.ts

@@ -34,6 +34,7 @@ declare module 'ember-power-select/components/power-select' {
     allowClear?: boolean;
     renderInPlace?: boolean;
     disabled?: boolean;
+    verticalPosition?: 'below' | 'above' | 'auto';
     // END extra args
     highlightOnHover?: boolean;
     placeholderComponent?: string;

package/addon/components/variable-plugin/codelist/edit.hbs

@@ -1,56 +0,0 @@
-{{! @glint-nocheck: not typesafe yet }}
-{{#if this.showCard}}
-  <AuCard
-    @flex={{true}}
-    @divided={{true}}
-    @isOpenInitially={{true}}
-    @expandable={{true}}
-    @shadow={{true}}
-    @size='small'
-    as |c|
-  >
-    <c.header>
-      <AuHeading @level='3' @skin='6'>
-        {{t 'variable-plugin.enter-variable-value'}}
-      </AuHeading>
-    </c.header>
-    <c.content>
-      <AuLabel for='codelist-select'>
-        {{this.label}}
-      </AuLabel>
-      {{#if this.multiSelect}}
-        <PowerSelectMultiple
-          id='codelist-select'
-          @allowClear={{false}}
-          @searchEnabled={{true}}
-          @searchField='label'
-          @options={{this.codelistOptions.value.options}}
-          @selected={{this.selectedCodelistOption}}
-          @onChange={{this.updateCodelistOption}}
-          as |option|
-        >
-          {{option.label}}
-        </PowerSelectMultiple>
-      {{else}}
-        <PowerSelect
-          id='codelist-select'
-          @allowClear={{false}}
-          @searchEnabled={{true}}
-          @searchField='label'
-          @options={{this.codelistOptions.value.options}}
-          @selected={{this.selectedCodelistOption}}
-          @onChange={{this.updateCodelistOption}}
-          as |option|
-        >
-          {{option.label}}
-        </PowerSelect>
-      {{/if}}
-      <AuButton
-        {{on 'click' this.insert}}
-        @disabled={{not this.selectedCodelistOption}}
-      >
-        {{t 'editor-plugins.utils.insert'}}
-      </AuButton>
-    </c.content>
-  </AuCard>
-{{/if}}