@lblod/ember-rdfa-editor-lblod-plugins 0.4.1 → 1.0.0-alpha.2

package/addon/plugins/roadsign-regulation-plugin/utils/includeInstructions.ts

@@ -0,0 +1,16 @@
+import Instruction from '@lblod/ember-rdfa-editor-lblod-plugins/models/instruction';
+
+export default function includeInstructions(
+  html: string,
+  instructions: Instruction[],
+  annotated: boolean
+) {
+  let finalHtml = html;
+  for (const instruction of instructions) {
+    finalHtml = finalHtml.replaceAll(
+      `\${${instruction.name ?? ''}}`,
+      annotated ? instruction.annotatedTemplate : instruction.template
+    );
+  }
+  return finalHtml;
+}

package/addon/plugins/standard-template-plugin/index.ts

@@ -0,0 +1,6 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+
+export const standardTemplateWidget: WidgetSpec = {
+  desiredLocation: 'insertSidebar',
+  componentName: 'standard-template-plugin/card',
+};

package/addon/plugins/standard-template-plugin/utils/instantiate-uuids.ts

@@ -0,0 +1,48 @@
+import memoize from '@lblod/ember-rdfa-editor-lblod-plugins/utils/memoize';
+import { v4 as uuidv4 } from 'uuid';
+
+/**
+ * Given a template string, we instantiate uuids by matching
+ * ${generateUuid()} pattern in the string and evaluating generateUuid()
+ *
+ * Note: the general approach is similar to converting a string to a template literal, but since
+ * this approach does not work in IE, we had to fall back to plain regex matching.
+ *
+ * @method instantiateUuids
+ * @param {String} templateString
+ *
+ * @return {String} template string with instantiated uuids
+ *
+ * @private
+ */
+
+export default function instantiateUuids(templateString: string) {
+  const generateBoundUuid = memoize(uuidv4) as (...args: unknown[]) => string;
+
+  const determineFunction = (string: string) => {
+    switch (string) {
+      case 'generateUuid':
+        return uuidv4;
+      case 'generateBoundUuid':
+        return generateBoundUuid;
+      default:
+        throw new Error(`Could not convert ${string} to function`);
+    }
+  };
+  return templateString.replace(
+    /\$\{(generateUuid|generateBoundUuid)\(([^()]*)\)\}/g,
+    (string) => {
+      const match = /\$\{(generateUuid|generateBoundUuid)\(([^()]*)\)\}/.exec(
+        string
+      );
+      if (match) {
+        const functionName = match[1];
+        const functionArgs = match[2];
+        const func = determineFunction(functionName);
+        return functionArgs ? func(functionArgs) : func();
+      } else {
+        return string;
+      }
+    }
+  );
+}

package/addon/plugins/table-of-contents-plugin/index.ts

@@ -0,0 +1,14 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+import { TableOfContentsConfig } from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/table-of-contents-plugin/utils/constants';
+
+export function tableOfContentsWidget(
+  config?: TableOfContentsConfig
+): WidgetSpec {
+  return {
+    componentName: 'table-of-contents-plugin/card',
+    desiredLocation: 'sidebar',
+    widgetArgs: {
+      config,
+    },
+  };
+}

package/addon/plugins/table-of-contents-plugin/nodes/index.ts

@@ -0,0 +1 @@
+export { table_of_contents, tableOfContentsView } from './table-of-contents';

package/addon/plugins/table-of-contents-plugin/nodes/table-of-contents.ts

@@ -0,0 +1,53 @@
+import { optionMapOr } from '@lblod/ember-rdfa-editor/utils/option';
+import {
+  createEmberNodeSpec,
+  createEmberNodeView,
+  EmberNodeConfig,
+} from '@lblod/ember-rdfa-editor/utils/ember-node';
+import {
+  TableOfContentsConfig,
+  TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/plugins/table-of-contents-plugin/utils/constants';
+
+export const emberNodeConfig: EmberNodeConfig = {
+  name: 'table-of-contents',
+  componentPath: 'table-of-contents-plugin/ember-nodes/table-of-contents',
+  inline: false,
+  group: 'table_of_contents',
+  atom: true,
+  attrs: {
+    config: {
+      default: TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+      serialize: (node) => {
+        return JSON.stringify(node.attrs['config']);
+      },
+    },
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (
+          element.dataset['emberNode'] === 'table-of-contents' ||
+          // Ensure backwards compatibility
+          element.dataset['inlineComponent'] ===
+            'inline-components/table-of-contents' ||
+          (element.classList.contains('inline-component') &&
+            element.classList.contains('inline-components/table-of-contents'))
+        ) {
+          return {
+            config: optionMapOr(
+              TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+              JSON.parse,
+              element.getAttribute('config')
+            ) as TableOfContentsConfig,
+          };
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const table_of_contents = createEmberNodeSpec(emberNodeConfig);
+export const tableOfContentsView = createEmberNodeView(emberNodeConfig);

package/addon/plugins/table-of-contents-plugin/utils/constants.ts

@@ -0,0 +1,17 @@
+export type TableOfContentsConfig = {
+  sectionPredicate: string[];
+  value:
+    | string
+    | {
+        predicate: string;
+      };
+}[];
+
+export const TABLE_OF_CONTENTS_DEFAULT_CONFIG: TableOfContentsConfig = [
+  {
+    sectionPredicate: ['https://say.data.gift/ns/hasPart', 'say:hasPart'],
+    value: {
+      predicate: 'https://say.data.gift/ns/heading',
+    },
+  },
+];

package/addon/plugins/template-variable-plugin/index.ts

@@ -0,0 +1,6 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+
+export const templateVariableWidget: WidgetSpec = {
+  componentName: 'template-variable-plugin/template-variable-card',
+  desiredLocation: 'sidebar',
+};

package/addon/plugins/template-variable-plugin/utils/constants.ts

@@ -0,0 +1,2 @@
+export const MULTI_SELECT_CODELIST_TYPE =
+  'http://lblod.data.gift/concepts/57C93E12-A02C-4D4B-8B95-666B6701286C';

package/addon/plugins/template-variable-plugin/utils/fetch-data.ts

@@ -0,0 +1,62 @@
+import {
+  executeQuery,
+  QueryResult,
+} from '@lblod/ember-rdfa-editor-lblod-plugins/utils/sparql-helpers';
+
+export type CodeListOptions = {
+  type: string;
+  options: CodeListOption[];
+};
+
+export type CodeListOption = {
+  value?: string;
+  label?: string;
+};
+
+function generateCodeListOptionsQuery(codelistUri: string): string {
+  const codeListOptionsQuery = `
+    PREFIX lblodMobilitiet: <http://data.lblod.info/vocabularies/mobiliteit/>
+    PREFIX dct: <http://purl.org/dc/terms/>
+    PREFIX skos: <http://www.w3.org/2004/02/skos/core#>
+    PREFIX schema: <http://schema.org/>
+    SELECT DISTINCT * WHERE { 
+      <${codelistUri}> a lblodMobilitiet:Codelist.
+      ?codelistOptions skos:inScheme <${codelistUri}>.
+      ?codelistOptions skos:prefLabel ?label.
+      OPTIONAL {
+        ?codelistOptions schema:position ?position .
+      }
+      OPTIONAL {
+        <${codelistUri}> dct:type ?type.
+      }
+    }
+    ORDER BY (!BOUND(?position)) ASC(?position)
+  `;
+  return codeListOptionsQuery;
+}
+
+export async function fetchCodeListOptions(
+  endpoint: string,
+  codelistUri: string
+): Promise<CodeListOptions> {
+  const codelistsOptionsQueryResult = await executeQuery(
+    endpoint,
+    generateCodeListOptionsQuery(codelistUri)
+  );
+  const options = parseCodelistOptions(codelistsOptionsQueryResult);
+  return {
+    type:
+      (codelistsOptionsQueryResult.results.bindings[0] &&
+        codelistsOptionsQueryResult.results.bindings[0]['type']?.value) ||
+      '',
+    options,
+  };
+}
+
+function parseCodelistOptions(queryResult: QueryResult): CodeListOption[] {
+  const bindings = queryResult.results.bindings;
+  return bindings.map((binding) => ({
+    value: binding['label']?.value,
+    label: binding['label']?.value,
+  }));
+}

package/addon/services/{import-rdfa-snippet.js → import-rdfa-snippet.ts}

@@ -1,25 +1,32 @@
 import Service from '@ember/service';
-import { A } from '@ember/array';
 import ContextScanner from '@lblod/marawa/rdfa-context-scanner';
+import RdfaBlock from '@lblod/marawa/rdfa-block';
+import { tracked } from 'tracked-built-ins';
 
+type RequestParams = {
+  source: string;
+  uri?: string;
+  omitCredentials: boolean | string;
+  mock: boolean | string;
+};
 /*
  * @module editor-import-snippet-plugin
  * @class ImportRdfaSnippet
  * @constructor
  */
-class RdfaSnippet {
-  constructor(source, type, content, blocks) {
-    this.source = source;
-    this.content = content;
-    this.blocks = blocks;
-    this.type = type;
-  }
-
-  get resourceTypeString() {
-    return (this.resourceTypes || []).join(', ');
-  }
+export class RdfaSnippet {
+  constructor(
+    readonly source: string,
+    readonly type: string,
+    readonly content: string,
+    readonly blocks: RdfaBlock[]
+  ) {}
 }
 
+type Error = {
+  source: string;
+  details: string;
+};
 /**
  * Service responsible for fetching and storing a snippet
  *
@@ -33,14 +40,17 @@ class RdfaSnippet {
  * @extends EmberService
  */
 export default class ImportRdfaSnippet extends Service {
-  errors;
+  @tracked errors: Error[];
 
-  snippets;
+  @tracked snippets: RdfaSnippet[];
+
+  contextScanner: ContextScanner;
 
   constructor() {
+    // eslint-disable-next-line prefer-rest-params
     super(...arguments);
-    this.snippets = A();
-    this.errors = A();
+    this.snippets = tracked([]);
+    this.errors = tracked([]);
     this.contextScanner = new ContextScanner();
   }
 
@@ -51,7 +61,7 @@ export default class ImportRdfaSnippet extends Service {
    * @return {String}
    * @public
    */
-  async downloadSnippet(params) {
+  async downloadSnippet(params: RequestParams) {
     const data = await this.getSnippet(params);
     if (data) await this.processSnippet(params, data);
   }
@@ -59,11 +69,10 @@ export default class ImportRdfaSnippet extends Service {
   /**
    * Remove a snippet from the store, typically after using it
    * @method removeSnippet
-   * @param {RdfaSnippet} snippet
    * @return void
    * @public
    */
-  removeSnippet(snippet) {
+  removeSnippet(snippet: RdfaSnippet) {
     const index = this.snippets.indexOf(snippet);
     if (index >= 0) {
       this.snippets.splice(index, 1);
@@ -76,7 +85,7 @@ export default class ImportRdfaSnippet extends Service {
    * @params {String} type
    * @return {Array} array of RdfaSnippets
    */
-  snippetsForType(type) {
+  snippetsForType(type: string) {
     return this.snippets.filter((snippet) => snippet.type === type);
   }
 
@@ -88,7 +97,7 @@ export default class ImportRdfaSnippet extends Service {
    * @result {Response} result from ember fetch call
    * @private
    */
-  async getSnippet(params) {
+  async getSnippet(params: RequestParams): Promise<Response | null> {
     let data = null;
     try {
       const credentials = params.omitCredentials ? 'omit' : 'include';
@@ -98,15 +107,15 @@ export default class ImportRdfaSnippet extends Service {
       });
 
       if (!data) {
-        this.errors.pushObject({
+        this.errors.push({
           source: params.source,
-          details: `No data found for ${params.uri}`,
+          details: `No data found for ${params.uri ?? ''}`,
         });
       }
     } catch (err) {
-      this.errors.pushObject({
+      this.errors.push({
         source: params.source,
-        details: `Error fetching data ${params.uri}: ${err}`,
+        details: `Error fetching data ${params.uri ?? ''}: ${err as string}`,
       });
     }
     return data;
@@ -117,7 +126,7 @@ export default class ImportRdfaSnippet extends Service {
    * currently just a very basic check if a type exists in the snippet.
    * @method determineType
    */
-  determineType(params, snippet, rdfaBlocks) {
+  determineType(rdfaBlocks: RdfaBlock[]): string {
     const triples = rdfaBlocks
       .map((block) => block.context)
       .reduce((prevValue, next) => [...prevValue, ...next])
@@ -140,23 +149,21 @@ export default class ImportRdfaSnippet extends Service {
   /**
    * Processes and stores snippet
    * @method processSnippet
-   * @param {Object} { source }
-   * @param {Object} { text } (result from ember fetch call)
    * @private
    */
-  async processSnippet(params, data) {
+  async processSnippet(params: RequestParams, data: Response) {
     try {
       const snippet = await data.text();
       const snippetElements = this.htmlToElements(snippet);
       const rdfaBlocks = snippetElements
         .map((e) => this.contextScanner.analyse(e))
         .reduce((acc, blocks) => [...acc, ...blocks], []);
-      const type = this.determineType(params, snippet, rdfaBlocks);
+      const type = this.determineType(rdfaBlocks);
       this.storeSnippet(params.source, type, snippet, rdfaBlocks);
-    } catch (err) {
-      this.errors.pushObject({
+    } catch (err: unknown) {
+      this.errors.push({
         source: params.source,
-        details: `Error fetching data ${params.uri}: ${err}`,
+        details: `Error fetching data ${params.uri ?? ''}: ${err as string}`,
       });
     }
   }
@@ -168,7 +175,7 @@ export default class ImportRdfaSnippet extends Service {
    * @return {Object}
    * @private
    */
-  htmlToElements(html) {
+  htmlToElements(html: string): Element[] {
     const template = document.createElement('template');
     template.innerHTML = html;
     return [...template.content.children];
@@ -182,7 +189,12 @@ export default class ImportRdfaSnippet extends Service {
    * @param {Array} block array of richnodes representing the content of the snippet
    * @private
    */
-  storeSnippet(source, type, content, blocks) {
-    this.snippets.pushObject(new RdfaSnippet(source, type, content, blocks));
+  storeSnippet(
+    source: string,
+    type: string,
+    content: string,
+    blocks: RdfaBlock[]
+  ): void {
+    this.snippets.push(new RdfaSnippet(source, type, content, blocks));
   }
 }