feat(editors/subtation): allow instantiation of LNode from LNodeType's (openscd#766)

* refactor(foundation): change menu action API

* feat(wizards/lnode): add create wizards

* feat(wizards/wizard-library): add LNode create wizard to library

* test(editors/substation): test LNode instatiotion with function type editors

* refactor(wizards/lnode): combine reference type and instace type wizard

* fix(wizard-libraray): import statement

* refactor(wizards/lnode): triggered by review

* refactor(wizards/lnode): better uniqueLnInst function

* refactor(wizards/lnode): better search for uniqeu lnInst

* test(wizards/lnode): better test unique lnInst selection

* fix(wizard-dialog): stabilize jump to initial page

This fixes the issue we had when opening the LNode instance reference create
wizard from the overflow menu of the LNodeType reference create wizard.

Co-authored-by: Christian Dinkel <[email protected]>

Author: JakobVogelsang

src/translations/de.ts

@@ -324,11 +324,11 @@ export const de: Translations = {
     none: 'Keine Verbindung vorhanden',
     publisherGoose: {
       title: 'GOOSE-Publizierer',
-      subscriberTitle: 'Verbunden mit {{ selected }}'
+      subscriberTitle: 'Verbunden mit {{ selected }}',
     },
     subscriberGoose: {
       title: 'IED-Publizierer',
-      publisherTitle: 'GOOSE(s) verbunden mit {{selected}}'
+      publisherTitle: 'GOOSE(s) verbunden mit {{selected}}',
     },
     subscriber: {
       subscribed: 'Verbunden',
@@ -338,9 +338,9 @@ export const de: Translations = {
       noIedSelected: 'Keine IED ausgewählt',
     },
     view: {
-      publisherView: "Zeigt verbundene IED(s) der ausgewählten GOOSE",
-      subscriberView: "Zeigt verbundene GOOSE(s) des ausgewählten IED"
-    }
+      publisherView: 'Zeigt verbundene IED(s) der ausgewählten GOOSE',
+      subscriberView: 'Zeigt verbundene GOOSE(s) des ausgewählten IED',
+    },
   },
   sampledvalues: {
     none: 'Keine Verbindung vorhanden',
@@ -460,8 +460,17 @@ export const de: Translations = {
         selectIEDs: 'Auswahl IEDs',
         selectLDs: 'Auswahl logische Geräte',
         selectLNs: 'Auswahl logische Knoten',
+        selectLNodeTypes: 'Auswahl logische Knoten Type',
       },
       placeholder: 'Bitte laden Sie eine SCL-Datei, die IED-Elemente enthält.',
+      uniquewarning: 'Logische Knoten Klasse existiert bereits',
+      reference: 'Referenz auf bestehenden logischen Knoten erstellen',
+      instance: 'Referenz auf logischen Knoten Typ erstellen',
+    },
+    log: {
+      title: 'LNode vom Type {{lnClass}} kann nicht hinzugefügt werden',
+      nonuniquelninst: 'Keine eindeutige Instanz (lnInst)',
+      uniqueln0: 'Nur eine Instanz von {{lnClass}} zulässig',
     },
     tooltip: 'Referenz zu logischen Knoten erstellen',
   },

src/translations/en.ts

@@ -321,11 +321,11 @@ export const en = {
     none: 'None',
     publisherGoose: {
       title: 'GOOSE Publisher',
-      subscriberTitle: 'Subscriber of {{ selected }}'
+      subscriberTitle: 'Subscriber of {{ selected }}',
     },
     subscriberGoose: {
       title: 'GOOSE Subscriber',
-      publisherTitle: 'GOOSE(s) subscribed by {{selected}}'
+      publisherTitle: 'GOOSE(s) subscribed by {{selected}}',
     },
     subscriber: {
       subscribed: 'Subscribed',
@@ -335,9 +335,9 @@ export const en = {
       noIedSelected: 'No IED selected',
     },
     view: {
-      publisherView: "Show subscriber IED(s) per selected GOOSE",
-      subscriberView: "Show subscribed GOOSE publisher for selected IED"
-    }
+      publisherView: 'Show subscriber IED(s) per selected GOOSE',
+      subscriberView: 'Show subscribed GOOSE publisher for selected IED',
+    },
   },
   sampledvalues: {
     none: 'none',
@@ -457,8 +457,17 @@ export const en = {
         selectIEDs: 'Select IEDs',
         selectLDs: 'Select logical devices',
         selectLNs: 'Select logical nodes',
+        selectLNodeTypes: 'Select logical node types',
       },
       placeholder: 'Please load an SCL file that contains IED elements.',
+      uniquewarning: 'Logical node class already exists',
+      reference: 'Add reference to existing logical node',
+      instance: 'Add reference to logical node type',
+    },
+    log: {
+      title: 'Cannot add LNode of class {{lnClass}}',
+      nonuniquelninst: 'Cannot find unique lnInst',
+      uniqueln0: 'Only one instance of {{lnClass}} allowed',
     },
     tooltip: 'Create logical nodes reference',
   },

src/wizard-dialog.ts

@@ -174,11 +174,15 @@ export class WizardDialog extends LitElement {
   }
 
   prev(): void {
-    if (this.pageIndex > 0) this.pageIndex--;
+    if (this.pageIndex <= 0) return;
+    this.pageIndex--;
+    this.dialog?.show();
   }
+
   async next(): Promise<void> {
     if (dialogValid(this.dialog)) {
       if (this.wizard.length > this.pageIndex + 1) this.pageIndex++;
+      this.dialog?.show();
     } else {
       this.dialog?.show();
       await this.dialog?.updateComplete;
@@ -295,8 +299,7 @@ export class WizardDialog extends LitElement {
         : 0;
 
     return html`<mwc-dialog
-      defaultAction="close"
-      ?open=${index === this.pageIndex}
+      defaultAction="next"
       heading=${page.title}
       @closed=${this.onClosed}
       style="--mdc-dialog-min-width:calc(100% + ${extraWidth}px)"

src/wizards/ied.ts

@@ -21,16 +21,17 @@ import {
 } from '../foundation.js';
 import { patterns } from './foundation/limits.js';
 
-import { updateNamingAttributeWithReferencesAction } from "./foundation/actions.js";
-import { deleteReferences } from "./foundation/references.js";
-import { emptyInputsDeleteActions } from "../foundation/ied.js";
+import { updateNamingAttributeWithReferencesAction } from './foundation/actions.js';
+import { deleteReferences } from './foundation/references.js';
+import { emptyInputsDeleteActions } from '../foundation/ied.js';
 
-const iedNamePattern = "[A-Za-z][0-9A-Za-z_]{0,2}|" +
-  "[A-Za-z][0-9A-Za-z_]{4,63}|" +
-  "[A-MO-Za-z][0-9A-Za-z_]{3}|" +
-  "N[0-9A-Za-np-z_][0-9A-Za-z_]{2}|" +
-  "No[0-9A-Za-mo-z_][0-9A-Za-z_]|" +
-  "Non[0-9A-Za-df-z_]";
+const iedNamePattern =
+  '[A-Za-z][0-9A-Za-z_]{0,2}|' +
+  '[A-Za-z][0-9A-Za-z_]{4,63}|' +
+  '[A-MO-Za-z][0-9A-Za-z_]{3}|' +
+  'N[0-9A-Za-np-z_][0-9A-Za-z_]{2}|' +
+  'No[0-9A-Za-mo-z_][0-9A-Za-z_]|' +
+  'Non[0-9A-Za-df-z_]';
 
 export function renderIEDWizard(
   name: string | null,
@@ -59,26 +60,26 @@ export function renderIEDWizard(
 }
 
 function renderIEDReferencesWizard(references: Delete[]): TemplateResult[] {
-  return [html `
-      <section>
-        <h1>${translate('ied.wizard.title.references')}</h1>
-        <mwc-list>
-          ${references.map(reference => {
-            const oldElement = <Element>reference.old.element
-            return html `
-              <mwc-list-item noninteractive twoline>
-                <span>${oldElement.tagName}</span>
-                <span slot="secondary">${identity(<Element>reference.old.element)}</span>
-              </mwc-list-item>`;
-          })}
-        </mwc-list>
-      </section>`];
+  return [
+    html` <section>
+      <h1>${translate('ied.wizard.title.references')}</h1>
+      <mwc-list>
+        ${references.map(reference => {
+          const oldElement = <Element>reference.old.element;
+          return html` <mwc-list-item noninteractive twoline>
+            <span>${oldElement.tagName}</span>
+            <span slot="secondary"
+              >${identity(<Element>reference.old.element)}</span
+            >
+          </mwc-list-item>`;
+        })}
+      </mwc-list>
+    </section>`,
+  ];
 }
 
 export function reservedNamesIED(currentElement: Element): string[] {
-  return Array.from(
-    currentElement.parentNode!.querySelectorAll('IED')
-  )
+  return Array.from(currentElement.parentNode!.querySelectorAll('IED'))
     .filter(isPublic)
     .map(ied => ied.getAttribute('name') ?? '')
     .filter(name => name !== currentElement.getAttribute('name'));
@@ -92,21 +93,24 @@ export function removeIEDAndReferences(element: Element): WizardActor {
     // Get Delete Actions for other elements that also need to be removed
     const referencesDeleteActions = deleteReferences(element);
     // Use the ExtRef Elements to check if after removing the ExtRef there are empty Inputs that can also be removed.
-    const extRefsDeleteActions = referencesDeleteActions
-      .filter(deleteAction => (<Element>deleteAction.old.element).tagName === 'ExtRef')
-    const inputsDeleteActions = emptyInputsDeleteActions(extRefsDeleteActions)
+    const extRefsDeleteActions = referencesDeleteActions.filter(
+      deleteAction => (<Element>deleteAction.old.element).tagName === 'ExtRef'
+    );
+    const inputsDeleteActions = emptyInputsDeleteActions(extRefsDeleteActions);
 
     // Create Complex Action to remove IED and all references.
     const name = element.getAttribute('name') ?? 'Unknown';
     const complexAction: ComplexAction = {
       actions: [],
-      title: get('ied.action.deleteied', {name}),
+      title: get('ied.action.deleteied', { name }),
     };
-    complexAction.actions.push({ old: { parent: element.parentElement!, element } });
+    complexAction.actions.push({
+      old: { parent: element.parentElement!, element },
+    });
     complexAction.actions.push(...referencesDeleteActions);
     complexAction.actions.push(...inputsDeleteActions);
     return [complexAction];
-  }
+  };
 }
 
 export function removeIEDWizard(element: Element): Wizard | null {
@@ -157,7 +161,10 @@ export function editIEDWizard(element: Element): Wizard {
       primary: {
         icon: 'edit',
         label: get('save'),
-        action: updateNamingAttributeWithReferencesAction(element, 'ied.action.updateied'),
+        action: updateNamingAttributeWithReferencesAction(
+          element,
+          'ied.action.updateied'
+        ),
       },
       content: renderIEDWizard(
         element.getAttribute('name'),