@things-factory/announcement 10.1.256 → 10.1.258

package/dist-client/components/audience-picker.js

@@ -6,10 +6,11 @@ import { __decorate, __metadata } from "tslib";
 import '@material/web/icon/icon.js';
 import '@operato/input/ox-select.js';
 import '@operato/popup/ox-popup-list.js';
+import gql from 'graphql-tag';
 import { css, html, LitElement, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
+import { QueryController } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
-import { announcementApi } from '../utils/announcement-api.js';
 import { t } from '../utils/announcement-words.js';
 const ICON = { DOMAIN: 'domain', DEPARTMENT: 'account_tree', ROLE: 'badge', USER: 'person' };
 /** The framework chooser - a popup list with its search box on top. `change` hears only a value other than the one shown. */
@@ -40,7 +41,19 @@ let AudiencePicker = class AudiencePicker extends localize(i18next)(LitElement)
         this.value = [];
         this.disabled = false;
         this.text = '';
-        this.found = [];
+        /* The words searched for and the audience counted - each a moment after it stops changing. */
+        this.searched = '';
+        this.counted = [];
+        /* What may be chosen, the people the words find, and how many the audience names now (ADR-0190). */
+        this.choicesRead = new QueryController(this, gql `query { announcementAudienceChoices { domainId domainName departments { id name note } roles { id name note } } }`);
+        this.people = new QueryController(this, gql `query ($text: String!) { announcementPeople(text: $text) { id name note } }`, {
+            variables: () => (this.searched ? { text: this.searched } : undefined),
+            keepPrevious: true
+        });
+        this.sizeRead = new QueryController(this, gql `query ($audiences: [AnnouncementAudienceInput!]!) { announcementAudienceSize(audiences: $audiences) }`, {
+            variables: () => (this.counted.length ? { audiences: this.counted } : undefined),
+            keepPrevious: true
+        });
     }
     static { this.styles = css `
     :host {
@@ -110,14 +123,18 @@ let AudiencePicker = class AudiencePicker extends localize(i18next)(LitElement)
       color: var(--ui-muted, var(--md-sys-color-on-surface-variant));
     }
   `; }
-    async connectedCallback() {
-        super.connectedCallback();
-        try {
-            this.choices = await announcementApi.choices();
-        }
-        catch {
-            this.choices = { domainId: '', domainName: '', departments: [], roles: [] };
-        }
+    get choices() {
+        if (this.choicesRead.error)
+            return { domainId: '', domainName: '', departments: [], roles: [] };
+        return this.choicesRead.data?.announcementAudienceChoices;
+    }
+    get found() {
+        return (this.searched && !this.people.error && this.people.data?.announcementPeople) || [];
+    }
+    get size() {
+        if (!this.value.length)
+            return 0;
+        return this.sizeRead.error ? undefined : this.sizeRead.data?.announcementAudienceSize;
     }
     updated(changes) {
         if (changes.has('value'))
@@ -158,8 +175,9 @@ let AudiencePicker = class AudiencePicker extends localize(i18next)(LitElement)
       ${this.size === undefined ? nothing : html `<span class="size">${t('announcement.text.audience-size', { count: this.size })}</span>`}`;
     }
     give(target) {
+        clearTimeout(this.searching);
         this.text = '';
-        this.found = [];
+        this.searched = '';
         this.tell([...this.value, target]);
     }
     take(target) {
@@ -172,30 +190,16 @@ let AudiencePicker = class AudiencePicker extends localize(i18next)(LitElement)
     search(text) {
         this.text = text;
         clearTimeout(this.searching);
-        this.searching = setTimeout(async () => {
-            try {
-                this.found = text.trim() ? await announcementApi.people(text.trim()) : [];
-            }
-            catch {
-                this.found = [];
-            }
-        }, 250);
+        this.searching = setTimeout(() => (this.searched = text.trim()), 250);
     }
     /** How many the audience names now - asked a moment after it stops changing. */
     count() {
         clearTimeout(this.counting);
         if (!this.value.length) {
-            this.size = 0;
+            this.counted = [];
             return;
         }
-        this.counting = setTimeout(async () => {
-            try {
-                this.size = await announcementApi.audienceSize(this.value.map(({ scope, targetId }) => ({ scope, targetId })));
-            }
-            catch {
-                this.size = undefined;
-            }
-        }, 300);
+        this.counting = setTimeout(() => (this.counted = this.value.map(({ scope, targetId }) => ({ scope, targetId }))), 300);
     }
 };
 __decorate([
@@ -209,19 +213,15 @@ __decorate([
 __decorate([
     state(),
     __metadata("design:type", Object)
-], AudiencePicker.prototype, "choices", void 0);
+], AudiencePicker.prototype, "text", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], AudiencePicker.prototype, "text", void 0);
+], AudiencePicker.prototype, "searched", void 0);
 __decorate([
     state(),
     __metadata("design:type", Array)
-], AudiencePicker.prototype, "found", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Number)
-], AudiencePicker.prototype, "size", void 0);
+], AudiencePicker.prototype, "counted", void 0);
 AudiencePicker = __decorate([
     customElement('announcement-audience-picker')
 ], AudiencePicker);

package/dist-client/components/audience-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"audience-picker.js","sourceRoot":"","sources":["../../client/components/audience-picker.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Whom an announcement goes to - the whole domain, departments (each with those under it), roles and people\n * (ADR-0163 decision 2), with how many people that names now. Changes go up as `change` with the whole list.\n */\nimport '@material/web/icon/icon.js'\nimport '@operato/input/ox-select.js'\nimport '@operato/popup/ox-popup-list.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\n\nimport { announcementApi, type Audience } from '../utils/announcement-api.js'\nimport { t } from '../utils/announcement-words.js'\n\ntype Choices = Awaited<ReturnType<typeof announcementApi.choices>>\n\nconst ICON: Record<string, string> = { DOMAIN: 'domain', DEPARTMENT: 'account_tree', ROLE: 'badge', USER: 'person' }\n\n/** The framework chooser - a popup list with its search box on top. `change` hears only a value other than the one shown. */\nexport function chooser(options: { value: string; display: string }[], value: string, change: (value: string) => void, placeholder: string, label: string) {\n  const shown = options.find(option => option.value === value)?.display ?? placeholder\n  return html`<ox-select\n    .value=${value}\n    aria-label=${label}\n    @change=${(e: CustomEvent) => {\n      /*\n       * Answered by the callback. ox-select's change is composed: left to bubble, it reaches the picker's host with an\n       * id for detail, after the picker's own change with the list, and the editor took the id as its audiences\n       * (「e.audiences.map is not a function」 on saving, 2026-10-30).\n       */\n      e.stopPropagation()\n      const next = String(e.detail ?? '')\n      if (next !== value) change(next)\n    }}\n  >\n    <span slot=\"label\">${shown}</span>\n    <ox-popup-list align-left nowrap with-search>${options.map(option => html`<div option value=${option.value}>${option.display}</div>`)}</ox-popup-list>\n  </ox-select>`\n}\n\n@customElement('announcement-audience-picker')\nexport class AudiencePicker extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      gap: var(--spacing-medium, 8px);\n    }\n    .chosen {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px);\n      min-height: 28px;\n      align-items: center;\n    }\n    .chip {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      padding: 2px 4px 2px 8px;\n      border-radius: 999px;\n      background: var(--md-sys-color-secondary-container);\n      color: var(--md-sys-color-on-secondary-container);\n      font-size: var(--ui-t-body, 14px);\n    }\n    .chip md-icon {\n      --md-icon-size: 16px;\n    }\n    .chip button {\n      border: 0;\n      background: none;\n      cursor: pointer;\n      color: inherit;\n      display: inline-flex;\n      padding: 0;\n    }\n    .add {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px) var(--spacing-medium, 8px);\n      align-items: center;\n    }\n    .add ox-select {\n      min-width: 180px;\n    }\n    .add > button,\n    .found button {\n      border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n      background: none;\n      border-radius: var(--border-radius, 4px);\n      padding: 2px var(--spacing-medium, 8px);\n      cursor: pointer;\n      font: inherit;\n      color: inherit;\n    }\n    .people {\n      position: relative;\n    }\n    .found {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px);\n      margin-top: var(--spacing-small, 4px);\n    }\n    .size,\n    .none {\n      font-size: var(--ui-t-small, 12px);\n      color: var(--ui-muted, var(--md-sys-color-on-surface-variant));\n    }\n  `\n\n  @property({ attribute: false }) value: Audience[] = []\n  @property({ type: Boolean }) disabled = false\n  @state() private choices?: Choices\n  @state() private text = ''\n  @state() private found: { id: string; name: string; note?: string }[] = []\n  @state() private size?: number\n  private searching?: ReturnType<typeof setTimeout>\n  private counting?: ReturnType<typeof setTimeout>\n\n  async connectedCallback() {\n    super.connectedCallback()\n    try {\n      this.choices = await announcementApi.choices()\n    } catch {\n      this.choices = { domainId: '', domainName: '', departments: [], roles: [] }\n    }\n  }\n\n  updated(changes: Map<string, unknown>) {\n    if (changes.has('value')) this.count()\n  }\n\n  render() {\n    const choices = this.choices\n    const has = (scope: string, id: string) => this.value.some(one => one.scope === scope && one.targetId === id)\n    return html`<div class=\"chosen\">\n        ${this.value.length\n          ? this.value.map(\n              one => html`<span class=\"chip\"\n                ><md-icon>${ICON[one.scope] ?? 'label'}</md-icon>${one.targetName ?? one.targetId}${one.scope === 'DEPARTMENT' ? html`<small>${t('announcement.text.with-sub-departments')}</small>` : nothing}\n                ${this.disabled ? nothing : html`<button aria-label=${t('announcement.button.remove')} @click=${() => this.take(one)}><md-icon>close</md-icon></button>`}</span\n              >`\n            )\n          : html`<span class=\"none\">${t('announcement.text.no-audience')}</span>`}\n      </div>\n      ${this.disabled || !choices\n        ? nothing\n        : html`<div class=\"add\">\n              ${has('DOMAIN', choices.domainId) ? nothing : html`<button @click=${() => this.give({ scope: 'DOMAIN', targetId: choices.domainId, targetName: t('announcement.text.everyone-in', { name: choices.domainName }) })}>${t('announcement.text.everyone')}</button>`}\n              ${choices.departments.length\n                ? chooser(\n                    choices.departments.filter(one => !has('DEPARTMENT', one.id)).map(one => ({ value: one.id, display: one.note ? `${one.name} (${one.note})` : one.name })),\n                    '',\n                    id => this.give({ scope: 'DEPARTMENT', targetId: id, targetName: choices.departments.find(one => one.id === id)?.name }),\n                    t('announcement.text.add-department'),\n                    t('announcement.text.add-department')\n                  )\n                : nothing}\n              ${choices.roles.length\n                ? chooser(\n                    choices.roles.filter(one => !has('ROLE', one.id)).map(one => ({ value: one.id, display: one.name })),\n                    '',\n                    id => this.give({ scope: 'ROLE', targetId: id, targetName: choices.roles.find(one => one.id === id)?.name }),\n                    t('announcement.text.add-role'),\n                    t('announcement.text.add-role')\n                  )\n                : nothing}\n              <span class=\"people\">\n                <input type=\"search\" .value=${this.text} placeholder=${t('announcement.text.add-person')} @input=${(e: any) => this.search(e.target.value)} />\n              </span>\n            </div>\n            ${this.found.length\n              ? html`<div class=\"found\">\n                  ${this.found\n                    .filter(one => !has('USER', one.id))\n                    .map(one => html`<button @click=${() => this.give({ scope: 'USER', targetId: one.id, targetName: one.name })}>${one.name}${one.note && one.note !== one.name ? ` · ${one.note}` : ''}</button>`)}\n                </div>`\n              : nothing}`}\n      ${this.size === undefined ? nothing : html`<span class=\"size\">${t('announcement.text.audience-size', { count: this.size })}</span>`}`\n  }\n\n  private give(target: Audience) {\n    this.text = ''\n    this.found = []\n    this.tell([...this.value, target])\n  }\n\n  private take(target: Audience) {\n    this.tell(this.value.filter(one => !(one.scope === target.scope && one.targetId === target.targetId)))\n  }\n\n  private tell(value: Audience[]) {\n    this.value = value\n    this.dispatchEvent(new CustomEvent('change', { detail: value }))\n  }\n\n  private search(text: string) {\n    this.text = text\n    clearTimeout(this.searching)\n    this.searching = setTimeout(async () => {\n      try {\n        this.found = text.trim() ? await announcementApi.people(text.trim()) : []\n      } catch {\n        this.found = []\n      }\n    }, 250)\n  }\n\n  /** How many the audience names now - asked a moment after it stops changing. */\n  private count() {\n    clearTimeout(this.counting)\n    if (!this.value.length) {\n      this.size = 0\n      return\n    }\n    this.counting = setTimeout(async () => {\n      try {\n        this.size = await announcementApi.audienceSize(this.value.map(({ scope, targetId }) => ({ scope, targetId })))\n      } catch {\n        this.size = undefined\n      }\n    }, 300)\n  }\n}\n"]}
+{"version":3,"file":"audience-picker.js","sourceRoot":"","sources":["../../client/components/audience-picker.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Whom an announcement goes to - the whole domain, departments (each with those under it), roles and people\n * (ADR-0163 decision 2), with how many people that names now. Changes go up as `change` with the whole list.\n */\nimport '@material/web/icon/icon.js'\nimport '@operato/input/ox-select.js'\nimport '@operato/popup/ox-popup-list.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { QueryController } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\n\nimport { type Audience } from '../utils/announcement-api.js'\nimport { t } from '../utils/announcement-words.js'\n\ntype Choices = { domainId: string; domainName: string; departments: { id: string; name: string; note?: string }[]; roles: { id: string; name: string; note?: string }[] }\ntype Person = { id: string; name: string; note?: string }\n\nconst ICON: Record<string, string> = { DOMAIN: 'domain', DEPARTMENT: 'account_tree', ROLE: 'badge', USER: 'person' }\n\n/** The framework chooser - a popup list with its search box on top. `change` hears only a value other than the one shown. */\nexport function chooser(options: { value: string; display: string }[], value: string, change: (value: string) => void, placeholder: string, label: string) {\n  const shown = options.find(option => option.value === value)?.display ?? placeholder\n  return html`<ox-select\n    .value=${value}\n    aria-label=${label}\n    @change=${(e: CustomEvent) => {\n      /*\n       * Answered by the callback. ox-select's change is composed: left to bubble, it reaches the picker's host with an\n       * id for detail, after the picker's own change with the list, and the editor took the id as its audiences\n       * (「e.audiences.map is not a function」 on saving, 2026-10-30).\n       */\n      e.stopPropagation()\n      const next = String(e.detail ?? '')\n      if (next !== value) change(next)\n    }}\n  >\n    <span slot=\"label\">${shown}</span>\n    <ox-popup-list align-left nowrap with-search>${options.map(option => html`<div option value=${option.value}>${option.display}</div>`)}</ox-popup-list>\n  </ox-select>`\n}\n\n@customElement('announcement-audience-picker')\nexport class AudiencePicker extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: flex;\n      flex-direction: column;\n      gap: var(--spacing-medium, 8px);\n    }\n    .chosen {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px);\n      min-height: 28px;\n      align-items: center;\n    }\n    .chip {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      padding: 2px 4px 2px 8px;\n      border-radius: 999px;\n      background: var(--md-sys-color-secondary-container);\n      color: var(--md-sys-color-on-secondary-container);\n      font-size: var(--ui-t-body, 14px);\n    }\n    .chip md-icon {\n      --md-icon-size: 16px;\n    }\n    .chip button {\n      border: 0;\n      background: none;\n      cursor: pointer;\n      color: inherit;\n      display: inline-flex;\n      padding: 0;\n    }\n    .add {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px) var(--spacing-medium, 8px);\n      align-items: center;\n    }\n    .add ox-select {\n      min-width: 180px;\n    }\n    .add > button,\n    .found button {\n      border: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n      background: none;\n      border-radius: var(--border-radius, 4px);\n      padding: 2px var(--spacing-medium, 8px);\n      cursor: pointer;\n      font: inherit;\n      color: inherit;\n    }\n    .people {\n      position: relative;\n    }\n    .found {\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--spacing-small, 4px);\n      margin-top: var(--spacing-small, 4px);\n    }\n    .size,\n    .none {\n      font-size: var(--ui-t-small, 12px);\n      color: var(--ui-muted, var(--md-sys-color-on-surface-variant));\n    }\n  `\n\n  @property({ attribute: false }) value: Audience[] = []\n  @property({ type: Boolean }) disabled = false\n  @state() private text = ''\n  /* The words searched for and the audience counted - each a moment after it stops changing. */\n  @state() private searched = ''\n  @state() private counted: Audience[] = []\n  private searching?: ReturnType<typeof setTimeout>\n  private counting?: ReturnType<typeof setTimeout>\n\n  /* What may be chosen, the people the words find, and how many the audience names now (ADR-0190). */\n  private choicesRead = new QueryController(\n    this,\n    gql`query { announcementAudienceChoices { domainId domainName departments { id name note } roles { id name note } } }`\n  )\n\n  private people = new QueryController(this, gql`query ($text: String!) { announcementPeople(text: $text) { id name note } }`, {\n    variables: () => (this.searched ? { text: this.searched } : undefined),\n    keepPrevious: true\n  })\n\n  private sizeRead = new QueryController(this, gql`query ($audiences: [AnnouncementAudienceInput!]!) { announcementAudienceSize(audiences: $audiences) }`, {\n    variables: () => (this.counted.length ? { audiences: this.counted } : undefined),\n    keepPrevious: true\n  })\n\n  private get choices(): Choices | undefined {\n    if (this.choicesRead.error) return { domainId: '', domainName: '', departments: [], roles: [] }\n    return this.choicesRead.data?.announcementAudienceChoices\n  }\n\n  private get found(): Person[] {\n    return (this.searched && !this.people.error && this.people.data?.announcementPeople) || []\n  }\n\n  private get size(): number | undefined {\n    if (!this.value.length) return 0\n    return this.sizeRead.error ? undefined : this.sizeRead.data?.announcementAudienceSize\n  }\n\n  updated(changes: Map<string, unknown>) {\n    if (changes.has('value')) this.count()\n  }\n\n  render() {\n    const choices = this.choices\n    const has = (scope: string, id: string) => this.value.some(one => one.scope === scope && one.targetId === id)\n    return html`<div class=\"chosen\">\n        ${this.value.length\n          ? this.value.map(\n              one => html`<span class=\"chip\"\n                ><md-icon>${ICON[one.scope] ?? 'label'}</md-icon>${one.targetName ?? one.targetId}${one.scope === 'DEPARTMENT' ? html`<small>${t('announcement.text.with-sub-departments')}</small>` : nothing}\n                ${this.disabled ? nothing : html`<button aria-label=${t('announcement.button.remove')} @click=${() => this.take(one)}><md-icon>close</md-icon></button>`}</span\n              >`\n            )\n          : html`<span class=\"none\">${t('announcement.text.no-audience')}</span>`}\n      </div>\n      ${this.disabled || !choices\n        ? nothing\n        : html`<div class=\"add\">\n              ${has('DOMAIN', choices.domainId) ? nothing : html`<button @click=${() => this.give({ scope: 'DOMAIN', targetId: choices.domainId, targetName: t('announcement.text.everyone-in', { name: choices.domainName }) })}>${t('announcement.text.everyone')}</button>`}\n              ${choices.departments.length\n                ? chooser(\n                    choices.departments.filter(one => !has('DEPARTMENT', one.id)).map(one => ({ value: one.id, display: one.note ? `${one.name} (${one.note})` : one.name })),\n                    '',\n                    id => this.give({ scope: 'DEPARTMENT', targetId: id, targetName: choices.departments.find(one => one.id === id)?.name }),\n                    t('announcement.text.add-department'),\n                    t('announcement.text.add-department')\n                  )\n                : nothing}\n              ${choices.roles.length\n                ? chooser(\n                    choices.roles.filter(one => !has('ROLE', one.id)).map(one => ({ value: one.id, display: one.name })),\n                    '',\n                    id => this.give({ scope: 'ROLE', targetId: id, targetName: choices.roles.find(one => one.id === id)?.name }),\n                    t('announcement.text.add-role'),\n                    t('announcement.text.add-role')\n                  )\n                : nothing}\n              <span class=\"people\">\n                <input type=\"search\" .value=${this.text} placeholder=${t('announcement.text.add-person')} @input=${(e: any) => this.search(e.target.value)} />\n              </span>\n            </div>\n            ${this.found.length\n              ? html`<div class=\"found\">\n                  ${this.found\n                    .filter(one => !has('USER', one.id))\n                    .map(one => html`<button @click=${() => this.give({ scope: 'USER', targetId: one.id, targetName: one.name })}>${one.name}${one.note && one.note !== one.name ? ` · ${one.note}` : ''}</button>`)}\n                </div>`\n              : nothing}`}\n      ${this.size === undefined ? nothing : html`<span class=\"size\">${t('announcement.text.audience-size', { count: this.size })}</span>`}`\n  }\n\n  private give(target: Audience) {\n    clearTimeout(this.searching)\n    this.text = ''\n    this.searched = ''\n    this.tell([...this.value, target])\n  }\n\n  private take(target: Audience) {\n    this.tell(this.value.filter(one => !(one.scope === target.scope && one.targetId === target.targetId)))\n  }\n\n  private tell(value: Audience[]) {\n    this.value = value\n    this.dispatchEvent(new CustomEvent('change', { detail: value }))\n  }\n\n  private search(text: string) {\n    this.text = text\n    clearTimeout(this.searching)\n    this.searching = setTimeout(() => (this.searched = text.trim()), 250)\n  }\n\n  /** How many the audience names now - asked a moment after it stops changing. */\n  private count() {\n    clearTimeout(this.counting)\n    if (!this.value.length) {\n      this.counted = []\n      return\n    }\n    this.counting = setTimeout(() => (this.counted = this.value.map(({ scope, targetId }) => ({ scope, targetId }))), 300)\n  }\n}\n"]}

package/dist-client/pages/announcement-editor.d.ts

@@ -18,6 +18,10 @@ type Form = {
     sendEmail: boolean;
     links: AnnouncementLink[];
     audiences: Audience[];
+    /** Files picked to attach, attached ones to take off, and whether a changed one tells everyone again. */
+    added: File[];
+    removed: string[];
+    notifyAgain: boolean;
 };
 declare const AnnouncementEditor_base: (new (...args: any[]) => import("lit").LitElement) & typeof PageView;
 /**
@@ -27,17 +31,22 @@ declare const AnnouncementEditor_base: (new (...args: any[]) => import("lit").Li
  */
 export declare class AnnouncementEditor extends AnnouncementEditor_base {
     static styles: import("lit").CSSResult[];
-    announcement: AnnouncementItem | null;
-    form: Form;
-    files: FileRow[];
-    added: File[];
-    removed: string[];
-    notifyAgain: boolean;
+    /** What the address opens: an announcement by id, a new one copied `from` another, or a new one. */
+    private address?;
     preview: boolean;
     progress?: number;
-    loading: boolean;
-    error: unknown;
-    busy: boolean;
+    private record;
+    private draft;
+    private saves;
+    get announcement(): AnnouncementItem | null;
+    /** The form as it shows: each field's edit, else what was read (blank while it is read). */
+    get form(): Form;
+    /** The files attached so far - a copy starts with none. */
+    get files(): FileRow[];
+    /** A failed read, or an announcement the address names that is not there. */
+    get error(): unknown;
+    get loading(): boolean;
+    get busy(): boolean;
     get out(): boolean;
     get context(): {
         frame: string;
@@ -47,12 +56,13 @@ export declare class AnnouncementEditor extends AnnouncementEditor_base {
         title: string;
     };
     pageUpdated(changes: any, lifecycle: any): Promise<void>;
-    private reset;
-    private load;
     render(): import("lit-html").TemplateResult<1>;
     private pick;
     private input;
-    /** Keeps it, then sends it out when asked - a draft that cannot go out stays kept with the reason told. */
+    /**
+     * Keeps it, then sends it out when asked - a draft that cannot go out stays kept, opened as one. Failures are told by
+     * the GraphQL link.
+     */
     private save;
     private deleteDraft;
 }

package/dist-client/pages/announcement-editor.js

@@ -3,18 +3,20 @@ import '@material/web/icon/icon.js';
 import '@operato/input/ox-input-file.js';
 import '@operato/list-state/ox-page-state.js';
 import '../components/audience-picker.js';
+import gql from 'graphql-tag';
 import { css, html, nothing } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+import { MutationController, QueryController, uploadContext } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
 import { OxPrompt } from '@operato/popup/ox-prompt.js';
 import { notify } from '@operato/layout';
-import { navigate, PageView } from '@operato/shell';
+import { navigate, PageView, DraftController } from '@operato/shell';
 import { renderMarkdown } from '@things-factory/ai-assistant/dist-client/index.js';
 import { ButtonStyles, DocumentPageStyles, FormFieldStyles } from '@operato/styles';
 import { chooser } from '../components/audience-picker.js';
-import { announcementApi } from '../utils/announcement-api.js';
-import { CATEGORIES, categoryWord, IMPORTANCES, importanceWord, reasonOf, statusWord, t } from '../utils/announcement-words.js';
+import { FULL_FIELDS } from '../utils/announcement-api.js';
+import { CATEGORIES, categoryWord, IMPORTANCES, importanceWord, statusWord, t } from '../utils/announcement-words.js';
 const blank = () => ({
     title: '',
     body: '',
@@ -28,7 +30,10 @@ const blank = () => ({
     popup: false,
     sendEmail: false,
     links: [],
-    audiences: []
+    audiences: [],
+    added: [],
+    removed: [],
+    notifyAgain: false
 });
 /** `datetime-local` speaks the reader's own clock. */
 const pad = (n) => String(n).padStart(2, '0');
@@ -54,7 +59,10 @@ function formOf(one) {
         popup: one.popup,
         sendEmail: !!one.sendEmail,
         links: (one.links ?? []).map(link => ({ ...link })),
-        audiences: (one.audiences ?? []).map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName }))
+        audiences: (one.audiences ?? []).map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName })),
+        added: [],
+        removed: [],
+        notifyAgain: false
     };
 }
 /**
@@ -65,16 +73,39 @@ function formOf(one) {
 let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(PageView) {
     constructor() {
         super(...arguments);
-        this.announcement = null;
-        this.form = blank();
-        this.files = [];
-        this.added = [];
-        this.removed = [];
-        this.notifyAgain = false;
         this.preview = false;
-        this.loading = false;
-        this.error = null;
-        this.busy = false;
+        /* The announcement edited, or the one a new one is copied from (ADR-0190). */
+        this.record = new QueryController(this, gql(`query ($id: String!) { announcement(id: $id) { ${FULL_FIELDS} readCount acknowledgedCount } }`), {
+            variables: () => {
+                const id = this.address?.id || this.address?.from;
+                return id ? { id } : undefined;
+            }
+        });
+        /* What is typed over the announcement read - a copy starts without its days, a new one blank. */
+        this.draft = new DraftController(this, {
+            read: () => {
+                if (!this.address)
+                    return undefined;
+                if (!this.address.id && !this.address.from)
+                    return blank();
+                const one = this.record.data?.announcement;
+                if (!one)
+                    return undefined;
+                return this.address.from && !this.address.id ? { ...formOf(one), startsAt: '', endsAt: '' } : formOf(one);
+            },
+            key: () => this.address
+        });
+        /* A change reads the announcement again once it is done; one that goes out or away leaves the editor. */
+        this.saves = {
+            create: new MutationController(this, gql `mutation ($input: AnnouncementInput!, $attach: [Upload!]) { createAnnouncement(input: $input, attach: $attach) { id } }`),
+            update: new MutationController(this, gql `
+        mutation ($id: String!, $input: AnnouncementInput!, $attach: [Upload!], $remove: [String!], $notifyAgain: Boolean) {
+          updateAnnouncement(id: $id, input: $input, attach: $attach, remove: $remove, notifyAgain: $notifyAgain) { id status }
+        }
+      `, { refetch: () => [this.record] }),
+            publish: new MutationController(this, gql `mutation ($id: String!) { publishAnnouncement(id: $id) { id status startsAt } }`),
+            remove: new MutationController(this, gql `mutation ($id: String!) { deleteAnnouncement(id: $id) }`)
+        };
     }
     static { this.styles = [
         FormFieldStyles,
@@ -190,6 +221,29 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
       }
     `
     ]; }
+    get announcement() {
+        return (this.address?.id && this.record.data?.announcement) || null;
+    }
+    /** The form as it shows: each field's edit, else what was read (blank while it is read). */
+    get form() {
+        return Object.fromEntries(Object.entries(blank()).map(([name, given]) => [name, this.draft.value(name) ?? given]));
+    }
+    /** The files attached so far - a copy starts with none. */
+    get files() {
+        return this.announcement?.attachments ?? [];
+    }
+    /** A failed read, or an announcement the address names that is not there. */
+    get error() {
+        if (this.record.error)
+            return this.record.error;
+        return this.record.data && !this.record.data.announcement ? new Error(t('announcement.refusal.unknown-announcement')) : null;
+    }
+    get loading() {
+        return this.record.loading;
+    }
+    get busy() {
+        return Object.values(this.saves).some(save => save.pending);
+    }
     get out() {
         return this.announcement?.status === 'PUBLISHED';
     }
@@ -219,55 +273,21 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
         if (!this.active || !(changes.active || changes.params))
             return;
         const { id, from } = lifecycle?.params ?? {};
-        if (id) {
-            if (id !== this.announcement?.id)
-                await this.load(id, false);
-        }
-        else if (from) {
-            await this.load(from, true);
-        }
-        else {
-            this.announcement = null;
-            this.form = blank();
-            this.files = [];
-            this.reset();
-            this.updateContext();
-        }
-    }
-    reset() {
-        this.added = [];
-        this.removed = [];
-        this.notifyAgain = false;
+        const address = id ? { id } : from ? { from } : {};
+        if (JSON.stringify(address) === JSON.stringify(this.address))
+            return;
+        this.address = address;
         this.preview = false;
     }
-    async load(id, asCopy) {
-        this.loading = true;
-        this.error = null;
-        try {
-            const one = await announcementApi.one(id);
-            if (!one)
-                throw new Error(t('announcement.refusal.unknown-announcement'));
-            this.announcement = asCopy ? null : one;
-            this.form = asCopy ? { ...formOf(one), startsAt: '', endsAt: '' } : formOf(one);
-            this.files = asCopy ? [] : (one.attachments ?? []);
-            this.reset();
-        }
-        catch (error) {
-            this.error = error;
-        }
-        finally {
-            this.loading = false;
-            this.updateContext();
-        }
-    }
     render() {
         const form = this.form;
         const set = (patch) => {
-            this.form = { ...form, ...patch };
+            for (const [name, value] of Object.entries(patch))
+                this.draft.set(name, value);
             this.updateContext();
         };
         const editable = !this.busy && (!this.announcement || !!this.announcement.editable);
-        return html `<ox-page-state .loading=${this.loading} .error=${this.error} @retry=${() => this.announcement && this.load(this.announcement.id, false)}>
+        return html `<ox-page-state .loading=${this.loading} .error=${this.error} @retry=${() => this.record.refetch()}>
       <div class="page">
         <section class="page-section">
           <header class="page-section-header"><h3>${t('announcement.text.section-what')}</h3></header>
@@ -343,17 +363,17 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
         <section class="page-section">
           <header class="page-section-header"><h3>${t('announcement.field.attachments')}</h3></header>
           <ul class="files">
-            ${this.files.map(file => html `<li class=${this.removed.includes(file.id) ? 'removed' : ''}>
+            ${this.files.map(file => html `<li class=${form.removed.includes(file.id) ? 'removed' : ''}>
                 <md-icon>attach_file</md-icon>${file.name}
                 ${editable
-            ? this.removed.includes(file.id)
-                ? html `<button @click=${() => (this.removed = this.removed.filter(id => id !== file.id))}><md-icon>undo</md-icon></button>`
-                : html `<button aria-label=${t('announcement.button.remove')} @click=${() => (this.removed = [...this.removed, file.id])}><md-icon>close</md-icon></button>`
+            ? form.removed.includes(file.id)
+                ? html `<button @click=${() => set({ removed: form.removed.filter(id => id !== file.id) })}><md-icon>undo</md-icon></button>`
+                : html `<button aria-label=${t('announcement.button.remove')} @click=${() => set({ removed: [...form.removed, file.id] })}><md-icon>close</md-icon></button>`
             : nothing}
               </li>`)}
-            ${this.added.map((file, index) => html `<li>
+            ${form.added.map((file, index) => html `<li>
                 <md-icon>upload_file</md-icon>${file.name}
-                <button aria-label=${t('announcement.button.remove')} @click=${() => (this.added = this.added.filter((_, i) => i !== index))}><md-icon>close</md-icon></button>
+                <button aria-label=${t('announcement.button.remove')} @click=${() => set({ added: form.added.filter((_, i) => i !== index) })}><md-icon>close</md-icon></button>
               </li>`)}
           </ul>
           ${editable ? html `<ox-input-file quiet hide-filelist multiple icon="attach_file" .progress=${this.progress} @change=${(e) => this.pick(e)}></ox-input-file>` : nothing}
@@ -388,7 +408,7 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
 
         ${this.out
             ? html `<section class="page-section">
-              <label class="check"><input type="checkbox" .checked=${this.notifyAgain} @change=${(e) => (this.notifyAgain = e.target.checked)} />${t('announcement.text.notify-again')}</label>
+              <label class="check"><input type="checkbox" .checked=${form.notifyAgain} @change=${(e) => set({ notifyAgain: e.target.checked })} />${t('announcement.text.notify-again')}</label>
               <span class="hint">${t('announcement.text.new-version', { version: (this.announcement?.version ?? 1) + 1 })}</span>
             </section>`
             : nothing}
@@ -401,7 +421,7 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
         if (!picked.length)
             return;
         e.target.reset?.();
-        this.added = [...this.added, ...picked];
+        this.draft.set('added', [...this.form.added, ...picked]);
     }
     input() {
         const form = this.form;
@@ -421,37 +441,39 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
             audiences: form.audiences.map(({ scope, targetId, targetName }) => ({ scope, targetId, targetName: targetName ?? undefined }))
         };
     }
-    /** Keeps it, then sends it out when asked - a draft that cannot go out stays kept with the reason told. */
+    /**
+     * Keeps it, then sends it out when asked - a draft that cannot go out stays kept, opened as one. Failures are told by
+     * the GraphQL link.
+     */
     async save(publish) {
-        this.busy = true;
+        if (this.busy)
+            return;
+        const id = this.announcement?.id;
+        const { added, removed, notifyAgain } = this.form;
+        const context = added.length ? uploadContext(fraction => (this.progress = fraction)) : undefined;
+        const saving = this.draft.submit(() => id
+            ? this.saves.update.run({ id, input: this.input(), attach: added, remove: removed, notifyAgain }, { context })
+            : this.saves.create.run({ input: this.input(), attach: added }, { context }));
+        /* The actions wait while it is out. */
+        this.updateContext();
+        const saved = await saving;
+        this.progress = undefined;
         this.updateContext();
-        const uploading = (fraction) => (this.progress = fraction);
-        try {
-            let id = this.announcement?.id;
-            if (id)
-                await announcementApi.update(id, this.input(), this.added, this.removed, this.notifyAgain, uploading);
-            else
-                id = (await announcementApi.create(this.input(), this.added, uploading)).id;
-            if (publish) {
-                const sent = await announcementApi.publish(id);
-                notify({ message: sent.status === 'SCHEDULED' ? t('announcement.text.scheduled-done') : t('announcement.text.published-done') });
-                navigate(`announcement-view?id=${id}`);
+        if (!saved)
+            return;
+        const kept = id ?? saved.createAnnouncement.id;
+        if (publish) {
+            const sent = await this.saves.publish.run({ id: kept });
+            if (sent) {
+                notify({ message: sent.publishAnnouncement.status === 'SCHEDULED' ? t('announcement.text.scheduled-done') : t('announcement.text.published-done') });
+                navigate(`announcement-view?id=${kept}`);
                 return;
             }
-            notify({ message: t('announcement.text.saved') });
-            if (this.announcement?.id === id)
-                await this.load(id, false);
-            else
-                navigate(`announcement-editor?id=${id}`);
-        }
-        catch (error) {
-            notify({ level: 'error', message: reasonOf(error) });
-        }
-        finally {
-            this.progress = undefined;
-            this.busy = false;
-            this.updateContext();
         }
+        else
+            notify({ message: t('announcement.text.saved') });
+        if (!id)
+            navigate(`announcement-editor?id=${kept}`);
     }
     async deleteDraft() {
         const sure = await OxPrompt.open({
@@ -462,40 +484,16 @@ let AnnouncementEditor = class AnnouncementEditor extends localize(i18next)(Page
         });
         if (!sure)
             return;
-        try {
-            await announcementApi.remove(this.announcement.id);
-            notify({ message: t('announcement.text.deleted') });
-            navigate('announcement-manage-list');
-        }
-        catch (error) {
-            notify({ level: 'error', message: reasonOf(error) });
-        }
+        if (!(await this.saves.remove.run({ id: this.announcement.id })))
+            return;
+        notify({ message: t('announcement.text.deleted') });
+        navigate('announcement-manage-list');
     }
 };
 __decorate([
     state(),
     __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "announcement", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "form", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], AnnouncementEditor.prototype, "files", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], AnnouncementEditor.prototype, "added", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], AnnouncementEditor.prototype, "removed", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "notifyAgain", void 0);
+], AnnouncementEditor.prototype, "address", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
@@ -504,18 +502,6 @@ __decorate([
     state(),
     __metadata("design:type", Number)
 ], AnnouncementEditor.prototype, "progress", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "loading", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "error", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], AnnouncementEditor.prototype, "busy", void 0);
 AnnouncementEditor = __decorate([
     customElement('announcement-editor')
 ], AnnouncementEditor);