Update editor to rdfa-backwards-compatibility build (#395)

* wip: update editor * update editor to latest dev commit * update nodes to use rdfa-attr-spec function * update dummy pages to use rdfa-aware nodes * enable rdfa-awareness on regulatory statement doc node-spec * lint: remove unused imports * lint: prettier * make links in dummy pages rdfa-aware * feat(citation-plugin): update citation plugin to work with rdfa-aware link nodes * fix invisible_rdfa typo * enable rdfa-awareness on besluit-editable-nodes doc node-spec * use full uris when inserting/removing decision type properties * fix issue with toDOM of besluit_articel_structure node-spec * chore: bump editor to latest release * fix: revert dummy app route back to js --------- Co-authored-by: abeforgit <[email protected]>
lblod · Apr 4, 2024 · 3cc0097 · 3cc0097
1 parent f2020d0
commit 3cc0097
Show file tree

Hide file tree

Showing 24 changed files with 420 additions and 258 deletions.
diff --git a/addon/components/besluit-type-plugin/toolbar-dropdown.ts b/addon/components/besluit-type-plugin/toolbar-dropdown.ts
@@ -5,7 +5,6 @@ import { addProperty, removeProperty } from '@lblod/ember-rdfa-editor/commands';
 import { SayController } from '@lblod/ember-rdfa-editor';
 import { sayDataFactory } from '@lblod/ember-rdfa-editor/core/say-data-factory';
 import { ResolvedPNode } from '@lblod/ember-rdfa-editor/plugins/datastore';
-import { getRdfaAttribute } from '@lblod/ember-rdfa-editor/utils/rdfa-utils';
 import fetchBesluitTypes, {
   BesluitType,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/besluit-type-plugin/utils/fetchBesluitTypes';
@@ -77,7 +76,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
   get currentBesluitURI() {
     if (this.currentBesluitRange) {
       const node = unwrap(this.doc.nodeAt(this.currentBesluitRange.from));
-      return getRdfaAttribute(node, 'resource').pop();
+      return node.attrs['subject'] as string | undefined;
     }
     return;
   }
@@ -204,7 +203,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
     const resource =
       (this.currentBesluitRange &&
         'node' in this.currentBesluitRange &&
-        (this.currentBesluitRange.node.attrs.resource as string)) ||
+        (this.currentBesluitRange.node.attrs.subject as string)) ||
       undefined;
     if (this.besluitType && resource) {
       this.cardExpanded = false;
@@ -213,7 +212,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
           removeProperty({
             resource,
             property: {
-              predicate: RDF('type').prefixed,
+              predicate: RDF('type').full,
               object: sayDataFactory.namedNode(this.previousBesluitType),
             },
           }),
@@ -224,7 +223,7 @@ export default class EditorPluginsToolbarDropdownComponent extends Component<Arg
         addProperty({
           resource,
           property: {
-            predicate: RDF('type').prefixed,
+            predicate: RDF('type').full,
             object: sayDataFactory.namedNode(this.besluitType.uri),
           },
         }),

diff --git a/addon/components/variable-plugin/codelist/insert.ts b/addon/components/variable-plugin/codelist/insert.ts
@@ -1,7 +1,7 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
-import { NodeSelection, SayController } from '@lblod/ember-rdfa-editor';
+import { SayController } from '@lblod/ember-rdfa-editor';
 import { sayDataFactory } from '@lblod/ember-rdfa-editor/core/say-data-factory';
 import {
   CodeList,

diff --git a/addon/plugins/article-structure-plugin/structures/article-paragraph.ts b/addon/plugins/article-structure-plugin/structures/article-paragraph.ts
@@ -18,6 +18,7 @@ import {
   hasOutgoingNamedNodeTriple,
   hasRDFaAttribute,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
+const rdfaAware = true;
 import {
   constructStructureBodyNodeSpec,
   getNumberUtils,
@@ -141,7 +142,7 @@ export const article_paragraph: NodeSpec = {
   editable: true,
   defining: true,
   attrs: {
-    ...rdfaAttrSpec,
+    ...rdfaAttrSpec({ rdfaAware }),
     typeof: {
       default: SAY('Paragraph').prefixed,
     },
@@ -173,7 +174,7 @@ export const article_paragraph: NodeSpec = {
       tag: 'div',
       context: 'article/article_body/',
       getAttrs(element: HTMLElement) {
-        const rdfaAttrs = getRdfaAttrs(element);
+        const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
         if (
           hasOutgoingNamedNodeTriple(
             rdfaAttrs,
@@ -194,7 +195,7 @@ export const article_paragraph: NodeSpec = {
       tag: 'div',
       context: 'article/article_body/',
       getAttrs(element: HTMLElement) {
-        const rdfaAttrs = getRdfaAttrs(element);
+        const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
         if (
           hasOutgoingNamedNodeTriple(rdfaAttrs, RDF('type'), SAY('Paragraph'))
         ) {

diff --git a/addon/plugins/article-structure-plugin/structures/structure-header-number.ts b/addon/plugins/article-structure-plugin/structures/structure-header-number.ts
@@ -9,8 +9,9 @@ import {
   hasRDFaAttribute,
 } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
 
+const rdfaAware = true;
 export const structure_header_number: NodeSpec = {
-  attrs: rdfaAttrSpec,
+  attrs: rdfaAttrSpec({ rdfaAware }),
   content: 'text*',
   inline: true,
   editable: true,
@@ -30,7 +31,7 @@ export const structure_header_number: NodeSpec = {
     {
       tag: 'span',
       getAttrs(node: HTMLElement) {
-        const attrs = getRdfaAttrs(node);
+        const attrs = getRdfaAttrs(node, { rdfaAware });
         if (hasBacklink(attrs, ELI('number'))) {
           return attrs;
         }

diff --git a/addon/plugins/article-structure-plugin/structures/structure-header-title.ts b/addon/plugins/article-structure-plugin/structures/structure-header-title.ts
@@ -6,8 +6,9 @@ import {
 import { EXT } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
 import { hasBacklink } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
 
+const rdfaAware = true;
 export const structure_header_title: NodeSpec = {
-  attrs: rdfaAttrSpec,
+  attrs: rdfaAttrSpec({ rdfaAware }),
   content: 'placeholder|text*',
   inline: true,
   editable: true,
@@ -25,7 +26,7 @@ export const structure_header_title: NodeSpec = {
       tag: 'span',
       context: 'structure_header/|article_header/',
       getAttrs(node: HTMLElement) {
-        const attrs = getRdfaAttrs(node);
+        const attrs = getRdfaAttrs(node, { rdfaAware });
         if (hasBacklink(attrs, EXT('title'))) {
           return attrs;
         }

diff --git a/addon/plugins/article-structure-plugin/utils/structure.ts b/addon/plugins/article-structure-plugin/utils/structure.ts
@@ -28,6 +28,7 @@ import { StructureSpec } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/ar
 import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
 import { romanize } from './romanize';
 
+const rdfaAware = true;
 export function constructStructureNodeSpec(config: {
   type: Resource;
   content: string;
@@ -42,7 +43,7 @@ export function constructStructureNodeSpec(config: {
     editable: true,
     isolating: true,
     attrs: {
-      ...rdfaAttrSpec,
+      ...rdfaAttrSpec({ rdfaAware }),
       rdfaNodeType: {
         default: 'resource',
       },
@@ -68,7 +69,7 @@ export function constructStructureNodeSpec(config: {
         tag: 'div',
         preserveWhitespace: false,
         getAttrs(element: HTMLElement) {
-          const rdfaAttrs = getRdfaAttrs(element);
+          const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
           if (
             hasOutgoingNamedNodeTriple(rdfaAttrs, RDF('type'), type) &&
             hasRdfaContentChild(element)
@@ -84,7 +85,7 @@ export function constructStructureNodeSpec(config: {
         tag: 'div',
         preserveWhitespace: false,
         getAttrs(element: HTMLElement) {
-          const rdfaAttrs = getRdfaAttrs(element);
+          const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
           if (hasOutgoingNamedNodeTriple(rdfaAttrs, RDF('type'), type)) {
             return rdfaAttrs;
           }
@@ -109,7 +110,7 @@ export function constructStructureBodyNodeSpec(config: {
     editable: true,
     isolating: true,
     allowSplitByTable: config.allowSplitByTable,
-    attrs: rdfaAttrSpec,
+    attrs: rdfaAttrSpec({ rdfaAware }),
     toDOM(node) {
       return renderRdfaAware({
         renderable: node,
@@ -128,7 +129,7 @@ export function constructStructureBodyNodeSpec(config: {
         tag,
         context,
         getAttrs(element: HTMLElement) {
-          const rdfaAttrs = getRdfaAttrs(element);
+          const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
           if (
             hasBacklink(rdfaAttrs, SAY('body')) &&
             hasRdfaContentChild(element)
@@ -144,7 +145,7 @@ export function constructStructureBodyNodeSpec(config: {
         tag,
         context,
         getAttrs(element: HTMLElement) {
-          const rdfaAttrs = getRdfaAttrs(element);
+          const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
           if (hasBacklink(rdfaAttrs, SAY('body'))) {
             return rdfaAttrs;
           }
@@ -188,7 +189,7 @@ export function constructStructureHeaderNodeSpec({
     selectable: false,
     allowSplitByTable: false,
     attrs: {
-      ...rdfaAttrSpec,
+      ...rdfaAttrSpec({ rdfaAware }),
       property: {
         default: SAY('heading').prefixed,
       },
@@ -233,8 +234,7 @@ export function constructStructureHeaderNodeSpec({
         priority: 60,
         getAttrs(element: HTMLElement) {
           const level = TAG_TO_LEVEL.get(element.tagName.toLowerCase()) ?? 6;
-          const rdfaAttrs = getRdfaAttrs(element);
-
+          const rdfaAttrs = getRdfaAttrs(element, { rdfaAware });
           if (hasBacklink(rdfaAttrs, SAY('heading'))) {
             const titleChild = element.querySelector(`
               span[property~='${EXT('title').prefixed}'],

diff --git a/addon/plugins/citation-plugin/utils/cited-text.ts b/addon/plugins/citation-plugin/utils/cited-text.ts
@@ -1,18 +1,48 @@
 import { PNode } from '@lblod/ember-rdfa-editor';
 import { CitationSchema } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/citation-plugin';
+import {
+  ELI,
+  RDF,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
 import { unwrap } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/option';
+import { sayDataFactory } from '@lblod/ember-rdfa-editor/core/say-data-factory';
 
 export function citedText(
   schema: CitationSchema,
   title: string,
   uri: string,
 ): PNode {
-  return unwrap(schema.nodes.link).create(
-    {
-      href: uri,
-      property: 'eli:cites',
-      typeof: 'eli:LegalExpression',
-    },
-    [schema.text(title)],
-  );
+  const linkType = unwrap(schema.nodes.link);
+  const linkSpec = linkType.spec;
+  if (linkSpec.attrs && linkSpec.attrs['properties']) {
+    // Link node-spec is RDFa-aware
+    return linkType.create(
+      {
+        href: uri,
+        subject: uri,
+        rdfaNodeType: 'resource',
+        properties: [
+          {
+            predicate: RDF('type').full,
+            object: sayDataFactory.namedNode(ELI('LegalExpression').full),
+          },
+          {
+            predicate: ELI('cites').full,
+            object: sayDataFactory.contentLiteral(),
+          },
+        ],
+      },
+      schema.text(title),
+    );
+  } else {
+    // Link node-spec uses classic RDFa
+    return linkType.create(
+      {
+        href: uri,
+        property: 'eli:cites',
+        typeof: 'eli:LegalExpression',
+      },
+      [schema.text(title)],
+    );
+  }
 }
diff --git a/addon/plugins/document-title-plugin/nodes/document-title.ts b/addon/plugins/document-title-plugin/nodes/document-title.ts
@@ -1,9 +1,10 @@
-import { NodeSpec, getRdfaAttrs, rdfaAttrs } from '@lblod/ember-rdfa-editor';
+import { NodeSpec, getRdfaAttrs, rdfaAttrSpec } from '@lblod/ember-rdfa-editor';
 
 import { ELI } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/constants';
 
 import { hasRDFaAttribute } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/namespace';
 
+const rdfaAware = true;
 export const document_title: NodeSpec = {
   content: 'paragraph{1}',
   inline: false,
@@ -12,7 +13,7 @@ export const document_title: NodeSpec = {
   group: '',
   allowSplitByTable: false,
   attrs: {
-    ...rdfaAttrs,
+    ...rdfaAttrSpec({ rdfaAware }),
     property: {
       default: 'eli:title',
     },
@@ -28,7 +29,7 @@ export const document_title: NodeSpec = {
       tag: 'h1,h2,h3,h4,h5',
       getAttrs(element: HTMLElement) {
         if (hasRDFaAttribute(element, 'property', ELI('title'))) {
-          return getRdfaAttrs(element);
+          return getRdfaAttrs(element, { rdfaAware });
         }
         return false;
       },

diff --git a/addon/plugins/roadsign-regulation-plugin/nodes.ts b/addon/plugins/roadsign-regulation-plugin/nodes.ts
@@ -1,4 +1,4 @@
-import { getRdfaAttrs, NodeSpec, rdfaAttrs } from '@lblod/ember-rdfa-editor';
+import { getRdfaAttrs, NodeSpec, rdfaAttrSpec } from '@lblod/ember-rdfa-editor';
 import {
   DCT,
   EXT,
@@ -10,11 +10,12 @@ import { hasRDFaAttribute } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/n
 const CONTENT_SELECTOR = `div[property~='${
   DCT('description').full
 }'],div[property~='${DCT('description').prefixed}']`;
+const rdfaAware = false;
 export const roadsign_regulation: NodeSpec = {
   content: 'block+',
   group: 'block',
   attrs: {
-    ...rdfaAttrs,
+    ...rdfaAttrSpec({ rdfaAware }),
     resourceUri: {},
     measureUri: {},
     zonality: {},
@@ -96,7 +97,7 @@ export const roadsign_regulation: NodeSpec = {
             measureUri,
             zonality,
             temporal,
-            ...getRdfaAttrs(node),
+            ...getRdfaAttrs(node, { rdfaAware }),
           };
         }
         return false;