@things-factory/figure-library 10.1.176 → 10.1.179

package/dist-client/viewparts/figure-package-import.d.ts

@@ -0,0 +1,24 @@
+import '@operato/input/ox-input-file.js';
+import { LitElement } from 'lit';
+export type ImportResult = {
+    problems: {
+        code: string;
+        path?: string;
+    }[];
+    outcomes: {
+        ref: string;
+        outcome: string;
+        code?: string;
+        differs?: string[];
+    }[];
+};
+declare const FigurePackageImport_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class FigurePackageImport extends FigurePackageImport_base {
+    static styles: import("lit").CSSResult;
+    private progress?;
+    private result?;
+    render(): import("lit-html").TemplateResult<1>;
+    private importFile;
+    private renderResult;
+}
+export {};

package/dist-client/viewparts/figure-package-import.js

@@ -0,0 +1,117 @@
+import { __decorate, __metadata } from "tslib";
+import '@operato/input/ox-input-file.js';
+import gql from 'graphql-tag';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import { client, uploadContext } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+const IMPORT = gql `
+  mutation ($file: Upload!) {
+    importFigurePackage(file: $file) {
+      problems {
+        code
+        path
+      }
+      outcomes {
+        ref
+        outcome
+        code
+        differs
+      }
+    }
+  }
+`;
+/*
+ * Bringing a figure package in (ADR-0114): the file is what this popup is about, so the picker is the drop box
+ * (page standard §7-1). It refuses a file of another type or over the server's limit before it goes, shows how far the
+ * upload got, and says what each figure of the package came to below it. Another package can be dropped after it.
+ * `imported` tells the catalog to read itself again.
+ */
+let FigurePackageImport = class FigurePackageImport extends localize(i18next)(LitElement) {
+    static { this.styles = css `
+    :host {
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+      padding: 16px;
+      font-size: var(--ui-t-body, 13px);
+    }
+    [result] {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+    }
+    [refused] {
+      color: var(--ui-crit, var(--md-sys-color-error));
+    }
+    [ref] {
+      font-family: var(--ui-mono, monospace);
+    }
+    p {
+      margin: 0;
+    }
+  `; }
+    render() {
+        return html `
+      <ox-input-file
+        accept=".figpkg,.zip"
+        hide-filelist
+        icon="upload_file"
+        .label=${i18next.t('figure-library.button.upload')}
+        .description=${i18next.t('figure-library.text.drop-package')}
+        .progress=${this.progress}
+        @change=${(e) => {
+            const file = e.detail?.[0];
+            if (file && this.progress === undefined)
+                this.importFile(file);
+        }}
+      ></ox-input-file>
+      ${this.result ? this.renderResult(this.result) : nothing}
+    `;
+    }
+    async importFile(file) {
+        this.result = undefined;
+        this.progress = 0;
+        let result;
+        try {
+            const response = await client.mutate({ mutation: IMPORT, variables: { file }, context: uploadContext(fraction => (this.progress = fraction)) });
+            if (response.errors?.length)
+                throw new Error(response.errors[0].message);
+            result = response.data.importFigurePackage;
+        }
+        catch (e) {
+            result = { problems: [{ code: e?.message ?? 'error' }], outcomes: [] };
+        }
+        finally {
+            this.progress = undefined;
+            this.renderRoot.querySelector('ox-input-file')?.reset();
+        }
+        this.result = result;
+        this.dispatchEvent(new CustomEvent('imported', { detail: result }));
+    }
+    renderResult(result) {
+        return html `<div result role="status">
+      ${result.problems.length
+            ? html `<p refused role="alert">${i18next.t('figure-library.text.package-refused', { code: result.problems.map(p => p.code).join(', ') })}</p>`
+            : result.outcomes.map(o => html `<div>
+              <span ref>${o.ref}</span> ·
+              <strong ?refused=${o.outcome === 'refused'}>${i18next.t(`figure-library.outcome.${o.outcome}`)}</strong>
+              ${o.differs?.length ? html `<div>${i18next.t('figure-library.text.differs', { fields: o.differs.join(', ') })}</div>` : nothing}
+              ${o.outcome === 'refused' && o.code ? html `<div>${o.code}</div>` : nothing}
+            </div>`)}
+    </div>`;
+    }
+};
+__decorate([
+    state(),
+    __metadata("design:type", Number)
+], FigurePackageImport.prototype, "progress", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], FigurePackageImport.prototype, "result", void 0);
+FigurePackageImport = __decorate([
+    customElement('figure-package-import')
+], FigurePackageImport);
+export { FigurePackageImport };
+//# sourceMappingURL=figure-package-import.js.map

package/dist-client/viewparts/figure-package-import.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"figure-package-import.js","sourceRoot":"","sources":["../../client/viewparts/figure-package-import.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\n\nimport { client, uploadContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\n\nconst IMPORT = gql`\n  mutation ($file: Upload!) {\n    importFigurePackage(file: $file) {\n      problems {\n        code\n        path\n      }\n      outcomes {\n        ref\n        outcome\n        code\n        differs\n      }\n    }\n  }\n`\n\nexport type ImportResult = {\n  problems: { code: string; path?: string }[]\n  outcomes: { ref: string; outcome: string; code?: string; differs?: string[] }[]\n}\n\n/*\n * Bringing a figure package in (ADR-0114): the file is what this popup is about, so the picker is the drop box\n * (page standard §7-1). It refuses a file of another type or over the server's limit before it goes, shows how far the\n * upload got, and says what each figure of the package came to below it. Another package can be dropped after it.\n * `imported` tells the catalog to read itself again.\n */\n@customElement('figure-package-import')\nexport class FigurePackageImport extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      gap: 12px;\n      padding: 16px;\n      font-size: var(--ui-t-body, 13px);\n    }\n    [result] {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n    [refused] {\n      color: var(--ui-crit, var(--md-sys-color-error));\n    }\n    [ref] {\n      font-family: var(--ui-mono, monospace);\n    }\n    p {\n      margin: 0;\n    }\n  `\n\n  @state() private progress?: number\n  @state() private result?: ImportResult\n\n  render() {\n    return html`\n      <ox-input-file\n        accept=\".figpkg,.zip\"\n        hide-filelist\n        icon=\"upload_file\"\n        .label=${i18next.t('figure-library.button.upload')}\n        .description=${i18next.t('figure-library.text.drop-package')}\n        .progress=${this.progress}\n        @change=${(e: CustomEvent) => {\n          const file = (e.detail as File[] | undefined)?.[0]\n          if (file && this.progress === undefined) this.importFile(file)\n        }}\n      ></ox-input-file>\n      ${this.result ? this.renderResult(this.result) : nothing}\n    `\n  }\n\n  private async importFile(file: File) {\n    this.result = undefined\n    this.progress = 0\n    let result: ImportResult\n    try {\n      const response = await client.mutate({ mutation: IMPORT, variables: { file }, context: uploadContext(fraction => (this.progress = fraction)) })\n      if (response.errors?.length) throw new Error(response.errors[0].message)\n      result = response.data.importFigurePackage\n    } catch (e: any) {\n      result = { problems: [{ code: e?.message ?? 'error' }], outcomes: [] }\n    } finally {\n      this.progress = undefined\n      this.renderRoot.querySelector<HTMLElement & { reset(): void }>('ox-input-file')?.reset()\n    }\n    this.result = result\n    this.dispatchEvent(new CustomEvent('imported', { detail: result }))\n  }\n\n  private renderResult(result: ImportResult) {\n    return html`<div result role=\"status\">\n      ${result.problems.length\n        ? html`<p refused role=\"alert\">${i18next.t('figure-library.text.package-refused', { code: result.problems.map(p => p.code).join(', ') })}</p>`\n        : result.outcomes.map(\n            o => html`<div>\n              <span ref>${o.ref}</span> ·\n              <strong ?refused=${o.outcome === 'refused'}>${i18next.t(`figure-library.outcome.${o.outcome}`)}</strong>\n              ${o.differs?.length ? html`<div>${i18next.t('figure-library.text.differs', { fields: o.differs.join(', ') })}</div>` : nothing}\n              ${o.outcome === 'refused' && o.code ? html`<div>${o.code}</div>` : nothing}\n            </div>`\n          )}\n    </div>`\n  }\n}\n"]}