@things-factory/ai-assistant 10.1.213 → 10.1.215

package/client/components/assistant-dock.ts

@@ -521,14 +521,17 @@ export class AssistantDock extends localize(i18next)(LitElement) {
       if (!userId) throw new Error(t('no-user', 'your sign-in could not be read. sign in again.'))
 
       await this.controller.open(this.target(userId, anchor))
-      await this.takeAsk()
     } catch (error) {
       if (ticket === this.revision) this.failure = (error as Error).message
     } finally {
       if (ticket === this.revision) {
         this.loading = false
-        /* No conversation can stand here - an ask waiting for one is answered now, not sent later somewhere else. */
-        if (this.anchor && !isAnchor(this.anchor)) void this.takeAsk()
+        /*
+         * The ask waiting is taken once the opening is done - takeAsk passes while loading, so taking it inside the
+         * opening left it waiting for good: a card's 「AI로 고치기」 reopened this screen's conversation and was never sent
+         * (2026-10-25). With no conversation possible here, it is answered now, not sent later somewhere else.
+         */
+        if (this.anchor) void this.takeAsk()
         /* What was being written on this subject before the page moved away comes back here. */
         void this.restoreDraft()
       }

package/client/components/assistant-selection-bar.test.ts

@@ -0,0 +1,42 @@
+/*
+ * 「AI와 작업」 over a list (ox-assistant-selection-bar) - one bar for every application's lists. What it is held to here is
+ * its source and its words; its behaviour on a real grid is held by the applications' browser tests (operato-office
+ * test/browser/page-ai-input.test.js).
+ */
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+
+const bare = readFileSync(join(__dirname, 'assistant-selection-bar.ts'), 'utf-8').replace(/\/\*[\s\S]*?\*\//g, '')
+
+describe('the selection bar', () => {
+  it('★ counts every way a grid picks - a row, the header\'s select-all, a new page of rows', () => {
+    expect(bare).toMatch(/GRID_EVENTS = \['select-record-change', 'select-all-change', 'list-adopted'\]/)
+  })
+
+  it('★ asks for its grid when it needs it - a page finds its grid only after its first render', () => {
+    expect(bare).toMatch(/gridOf\?: \(\) => SelectionGrid \| undefined/)
+    expect(bare).not.toMatch(/@property\(\{ attribute: false \}\) grist/)
+  })
+
+  it('★ hands the rows as keys of the list, to this screen\'s conversation, sent at once', () => {
+    expect(bare).toMatch(/selection: \{ title: this\.name, list: this\.list, records: selectedRecords\(rows, \{ axis: this\.axis, labelOf: this\.labelOf \}\) \}/)
+    expect(bare).toMatch(/ask: request\?\.trim\(\) \|\| i18next\.t\('ai-assistant\.selection\.ask'/)
+    expect(bare).not.toMatch(/draft|continueCurrent|transcript/)
+  })
+
+  it('keeps the words unless the request was sent', () => {
+    expect(bare).toMatch(/if \(outcome\?\.sent && this\.request === request\) this\.request = ''/)
+  })
+
+  it('every word it shows reads in every language', () => {
+    const keys = [...new Set([...bare.matchAll(/'(ai-assistant\.selection\.[\w-]+)'/g)].map(([, key]) => key))]
+    expect(keys.length).toBe(7)
+    for (const locale of ['en', 'ko', 'ja', 'zh', 'ms', 'es']) {
+      const words = JSON.parse(readFileSync(join(__dirname, `../../translations/${locale}.json`), 'utf-8'))
+      for (const key of keys) expect([locale, key, typeof words[key]]).toEqual([locale, key, 'string'])
+      expect(words['ai-assistant.selection.ask']).toMatch(/\{n\}/)
+      expect(words['ai-assistant.selection.ask']).toMatch(/\{title\}/)
+      expect(words['ai-assistant.selection.count']).toMatch(/\{n\}/)
+    }
+  })
+})

package/client/components/assistant-selection-bar.ts

@@ -0,0 +1,129 @@
+import { css, html, LitElement, nothing } from 'lit'
+import { customElement, property, state } from 'lit/decorators.js'
+
+import { i18next } from '@operato/i18n'
+import { notify } from '@operato/layout'
+import { ButtonStyles, FormFieldStyles } from '@operato/styles'
+
+import { askAssistant } from '../utils/assistant-ask.js'
+import { selectedRecords } from '../utils/assistant-selection.js'
+
+/** What a grid says when its picks or its rows change - a row's picker, the header's select-all, a new page of rows. */
+const GRID_EVENTS = ['select-record-change', 'select-all-change', 'list-adopted']
+
+/** The part of a grid (data-grist `ox-grist`) the bar reads. */
+export interface SelectionGrid extends HTMLElement {
+  selected?: any[]
+  updateComplete?: Promise<unknown>
+}
+
+/**
+ * 「AI와 작업」 over a list - one bar for every application's lists (design/ai/shared-dock.md §2-11-1). While rows are
+ * picked it shows how many, what the list itself does with them, and a request sent to this screen's conversation with
+ * the rows as the selection. Begun on the Office ledgers; the user, 2026-10-25: 「'AI와 작업' 기능을 사용하려면, 그리드
+ * 선택기능이 필요한데, 주요 리스트 화면에서 선택기능이 없는 경우가 꽤 있다」, and it is to serve plant, warehouse and twin.
+ *
+ * A screen gives the grid (asked for when needed - a page finds its grid only after its first render), the list as the
+ * person knows it, the list query and its axis (the last part of the list's read key, so a row goes as `<axis>:<uuid>`),
+ * and, if it likes, its own actions and words for a row. The grid shows `SELECTION_ROW_PICKER`.
+ */
+@customElement('ox-assistant-selection-bar')
+export class OxAssistantSelectionBar extends LitElement {
+  static styles = [
+    ButtonStyles,
+    FormFieldStyles,
+    css`
+      :host { display:block; }
+      .selection-work { display:flex; flex-wrap:wrap; align-items:center; gap:var(--spacing-medium); padding:var(--spacing-medium) var(--spacing-large); border-bottom:1px solid var(--ui-line); background:var(--ui-panel); }
+      .scope { font-size:var(--ui-t-body); font-weight:600; white-space:nowrap; }
+      form { display:flex; flex:1 1 320px; min-width:0; gap:var(--spacing-small); }
+      input { flex:1; min-width:0; width:100%; }
+      .tools { display:flex; flex-wrap:wrap; gap:var(--spacing-small); }
+    `
+  ]
+
+  /** The grid whose picked rows these are, asked for when needed. */
+  @property({ attribute: false }) gridOf?: () => SelectionGrid | undefined
+  /** The list as the person knows it (「계약 대장」). */
+  @property() name = ''
+  /** The list query the rows came from (`contracts`) - one the assistant reads. */
+  @property() list = ''
+  /** The last part of that list's read key (`office.contract` → `contract`): each row goes as `<axis>:<uuid>`. */
+  @property() axis = ''
+  /** What the list itself does with the picked rows, before 「AI와 작업」. */
+  @property({ attribute: false }) actions: { title: string; action: () => any }[] = []
+  /** A row in the person's words, when the code and name do not say it (`selectionLabel`). */
+  @property({ attribute: false }) labelOf?: (row: any) => string
+
+  @state() count = 0
+  @state() request = ''
+
+  private get grid() {
+    return this.gridOf?.()
+  }
+
+  /* The grid's own events reach the page's root (bubbling, composed); the bar counts those that come from its grid. */
+  private root?: Node
+  private recount = async (event?: Event) => {
+    const grid = this.grid
+    if (event && (!grid || !event.composedPath().includes(grid))) return
+    await grid?.updateComplete
+    this.count = grid?.selected?.length ?? 0
+  }
+
+  connectedCallback() {
+    super.connectedCallback()
+    this.root = this.getRootNode()
+    for (const event of GRID_EVENTS) this.root.addEventListener(event, this.recount)
+    void this.recount()
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback()
+    for (const event of GRID_EVENTS) this.root?.removeEventListener(event, this.recount)
+    this.root = undefined
+  }
+
+  willUpdate(changes: Map<string, unknown>) {
+    if (changes.has('gridOf')) void this.recount()
+  }
+
+  /*
+   * A screen request (design/ai/shared-dock.md §2-11-1, the user: 「"AI와 작업" 기능이 unstable 하다 … 새로운 세션을 여는지,
+   * 기존 세션을 활용하는지 등등을 명확하게 하라」): it goes to this screen's conversation with the rows picked now, in
+   * screen order, and is sent at once - what was written on the bar, or the set request. The bar is cleared only when it
+   * was sent; otherwise the dock has said why and the words stay to press again.
+   */
+  async ask(request: string = this.request) {
+    const rows = this.grid?.selected ?? []
+    if (!rows.length) {
+      notify({ message: i18next.t('ai-assistant.selection.pick-rows'), level: 'info' })
+      return
+    }
+    if (rows.some(row => !row.id || row.__dirty__)) {
+      notify({ message: i18next.t('ai-assistant.selection.save-first'), level: 'warn' })
+      return
+    }
+    const outcome = await askAssistant({
+      selection: { title: this.name, list: this.list, records: selectedRecords(rows, { axis: this.axis, labelOf: this.labelOf }) },
+      ask: request?.trim() || i18next.t('ai-assistant.selection.ask', { n: rows.length, title: this.name })
+    })
+    if (outcome?.sent && this.request === request) this.request = ''
+  }
+
+  render() {
+    return this.count
+      ? html`<div class="selection-work" role="region" aria-label=${i18next.t('ai-assistant.selection.region')}>
+          <span class="scope" role="status">${i18next.t('ai-assistant.selection.count', { n: this.count })}</span>
+          ${this.actions.length
+            ? html`<div class="tools">${this.actions.map(action => html`<button quiet small @click=${action.action}>${action.title}</button>`)}</div>`
+            : nothing}
+          <form @submit=${(event: Event) => { event.preventDefault(); this.ask() }}>
+            <input aria-label=${i18next.t('ai-assistant.selection.request')} placeholder=${i18next.t('ai-assistant.selection.request')}
+              .value=${this.request} @input=${(event: any) => (this.request = event.target.value)} />
+            <button quiet small type="submit">${i18next.t('ai-assistant.selection.work-with-ai')}</button>
+          </form>
+        </div>`
+      : nothing
+  }
+}

package/client/components/assistant-session-manager.ts

@@ -10,15 +10,24 @@ import { OxPopupMenu } from '@operato/popup/ox-popup-menu.js'
 
 import {
   assistantSessionAdmin,
+  bulkActions,
   sessionActions,
   type AssistantSessionAdmin,
   type AssistantSessionEntry,
   type AssistantSessionFilters,
+  type DeletedSessionEntry,
+  type SessionKeeping,
   type SessionVisibility
 } from '../utils/assistant-session-admin.js'
 
 const PAGE = 30
 
+/**
+ * What the list shows (shared-dock.md §2-7): the live ones, the live and the archived, the ones of mine it suggests
+ * clearing (picked already, so one press clears them), or the ones I deleted that can still come back.
+ */
+type SessionView = 'list' | 'archived' | 'cleanup' | 'deleted'
+
 
 const t = (key: string, defaultValue: string, options: Record<string, unknown> = {}) =>
   i18next.t(`ai-assistant.session.${key}`, { defaultValue, ...options })
@@ -46,6 +55,10 @@ const t = (key: string, defaultValue: string, options: Record<string, unknown> =
  * ── Asking before what cannot be undone ─────────────────────────────────────────
  * Delete, and opening a private conversation to the domain, ask on the row itself - [Cancel][OK].
  * Making it private, hiding and renaming do not: each can be undone from the same row.
+ *
+ * ── Many at once (2026-10-25, the user: 「멀티셀렉트로 한번에 지울 수 있게」) ──────────
+ * Each row has a box; the picked ones are deleted, left or hidden together, each by its own row's hints
+ * (`bulkActions`), with one question. A deleted one is kept for `deletedDays` and comes back from 「Deleted」.
  */
 @customElement('ox-assistant-session-manager')
 export class AssistantSessionManager extends LitElement {
@@ -295,6 +308,38 @@ export class AssistantSessionManager extends LitElement {
     .hiddenfilter md-icon {
       --md-icon-size: 16px;
     }
+
+    .pick { margin: 0; cursor: pointer; }
+    /* The box is small; the space around it picks too - a press beside it must not open the conversation. */
+    .pick-area { flex: none; display: inline-flex; align-items: center; align-self: stretch; padding: 0 8px; margin: -7px -8px -7px -10px; padding-left: 10px; cursor: pointer; }
+    .pickbar {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: 4px 10px;
+      padding: 6px 10px;
+      border-bottom: 1px solid var(--md-sys-color-outline-variant);
+      font-size: 11px;
+      color: var(--md-sys-color-on-surface-variant);
+    }
+    .pickbar label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
+    .pickbar .act,
+    .suggest,
+    .note .open-link,
+    .restore {
+      border: 0;
+      background: none;
+      padding: 0;
+      color: var(--md-sys-color-primary);
+      font: inherit;
+      cursor: pointer;
+    }
+    .pickbar .act:disabled { color: var(--md-sys-color-on-surface-variant); cursor: default; }
+    .pickbar .act.danger { color: var(--md-sys-color-error); }
+    .pickbar .unpick { margin-left: auto; }
+    .suggest { display: block; width: 100%; padding: 8px 10px; text-align: start; font-size: 12px; border-bottom: 1px solid var(--md-sys-color-outline-variant); }
+    .restore { flex: none; font-size: 12px; }
+    .row.deleted { cursor: default; }
   `
 
   /** The anchor whose conversations are listed - the same one the dock's session controller opened. */
@@ -319,6 +364,18 @@ export class AssistantSessionManager extends LitElement {
   @state() private loading = false
   @state() private error = ''
   @state() private renamingId = ''
+  @state() private view: SessionView = 'list'
+  @state() private archivedCount = 0
+  @state() private cleanupCount = 0
+  @state() private keeping: SessionKeeping = { deletedDays: null, archiveDays: null }
+  @state() private deleted: DeletedSessionEntry[] = []
+  /** The rows picked for doing at once - ids, kept across a reload for the rows still listed. */
+  @state() private picked: string[] = []
+  @state() private busy = false
+  /** What was just done, said once - and the conversation brought back, to open it from here. */
+  @state() private notice: { text: string; open?: { sessionId: string; kind?: string } } | null = null
+  /** The suggestions arrive picked - set when the view turns to them, spent by the first read. */
+  private pickAllOnRead = false
 
   /*
    * The search and the filters stand open together, always (2026-10-12) - a filter behind a "Filters" button is one
@@ -326,7 +383,7 @@ export class AssistantSessionManager extends LitElement {
    * to choose.
    */
   private get filtering() {
-    return !!this.search.trim() || this.whose !== 'all' || this.visibility !== 'all' || this.includeHidden || this.unreadOnly
+    return !!this.search.trim() || this.whose !== 'all' || this.visibility !== 'all' || this.includeHidden || this.unreadOnly || this.view !== 'list'
   }
 
   private clearFilters() {
@@ -336,6 +393,7 @@ export class AssistantSessionManager extends LitElement {
       this.whose = 'all'
       this.visibility = 'all'
       this.includeHidden = this.unreadOnly = false
+      this.view = 'list'
     })
   }
 
@@ -354,6 +412,17 @@ export class AssistantSessionManager extends LitElement {
     this.loading = true
     this.error = ''
     try {
+      if (this.view === 'deleted') {
+        /* The deleted ones are few (kept for deletedDays) - the search narrows them by name here. */
+        const word = this.search.trim().toLowerCase()
+        const deleted = (await this.admin.deleted(this.anchorType, this.anchorId)).filter(one => !word || (one.name ?? '').toLowerCase().includes(word))
+        if (generation !== this.generation) return
+        this.deleted = deleted
+        this.entries = []
+        this.total = deleted.length
+        this.keepPicked(deleted.map(one => one.id))
+        return
+      }
       /*
        * Paging reads again from the start rather than appending - live activity reorders the list, and
        * appending a later page to an earlier order duplicates and drops rows.
@@ -367,7 +436,9 @@ export class AssistantSessionManager extends LitElement {
           whose: this.whose,
           visibility: this.visibility,
           includeHidden: this.includeHidden,
-          unreadOnly: this.unreadOnly
+          unreadOnly: this.unreadOnly,
+          includeArchived: this.view === 'archived',
+          cleanupOnly: this.view === 'cleanup'
         },
         limit: this.pageSize,
         offset: 0
@@ -376,6 +447,10 @@ export class AssistantSessionManager extends LitElement {
       this.entries = page.entries
       this.total = page.total
       this.hiddenCount = page.hiddenCount
+      this.archivedCount = page.archivedCount
+      this.cleanupCount = page.cleanupCount
+      this.keeping = page.keeping
+      this.keepPicked(page.entries.map(entry => entry.id))
     } catch (error) {
       if (generation !== this.generation) return
       this.entries = []
@@ -386,6 +461,27 @@ export class AssistantSessionManager extends LitElement {
     }
   }
 
+  /** After a read: the suggestions arrive all picked; otherwise only the picked rows still listed stay picked. */
+  private keepPicked(listed: string[]) {
+    if (this.pickAllOnRead) {
+      this.pickAllOnRead = false
+      this.picked = listed
+    } else this.picked = this.picked.filter(id => listed.includes(id))
+  }
+
+  private setView(view: SessionView) {
+    this.refilter(() => {
+      this.view = view
+      this.picked = []
+      this.notice = null
+      this.pickAllOnRead = view === 'cleanup'
+    })
+  }
+
+  private togglePick(id: string, on: boolean) {
+    this.picked = on ? [...new Set([...this.picked, id])] : this.picked.filter(one => one !== id)
+  }
+
   protected updated(changed: PropertyValues) {
     if (changed.has('anchorType') || changed.has('anchorId') || changed.has('admin') || changed.has('kind')) void this.reload()
 
@@ -437,6 +533,7 @@ export class AssistantSessionManager extends LitElement {
   /** Runs one door, then reads the list again - on success and on failure alike, so the row shows the truth. */
   private async act(entry: AssistantSessionEntry, change: string, run: () => Promise<boolean>, refused: string) {
     this.renamingId = ''
+    this.notice = null
     try {
       if (!(await run())) this.error = refused
       else this.emit('assistant-session-changed', { sessionId: entry.id, change })
@@ -473,6 +570,75 @@ export class AssistantSessionManager extends LitElement {
     void this.act(entry, 'removed', () => this.admin.remove(entry.id), t('remove-refused', 'this conversation could not be deleted.'))
   }
 
+  /**
+   * Runs one door for each picked row, then reads the list again. Every success is told to the host like a row's own
+   * change, so it moves off an open conversation that went; every refusal is said by name.
+   */
+  private async runMany(ids: string[], change: string, run: (id: string) => Promise<boolean>, done: (count: number) => string) {
+    if (!ids.length || this.busy) return
+    this.busy = true
+    this.error = ''
+    this.notice = null
+    const names = new Map([...this.entries.map(entry => [entry.id, entry.name] as const), ...this.deleted.map(one => [one.id, one.name] as const)])
+    const refused: string[] = []
+    let count = 0
+    for (const id of ids) {
+      try {
+        if (await run(id)) {
+          count++
+          this.emit('assistant-session-changed', { sessionId: id, change })
+        } else refused.push(names.get(id) || t('untitled', 'Untitled conversation'))
+      } catch (error) {
+        refused.push(`${names.get(id) || t('untitled', 'Untitled conversation')} (${(error as Error).message})`)
+      }
+    }
+    this.picked = []
+    this.busy = false
+    const error = refused.length ? t('some-refused', 'Not done for {count}: {names}', { count: refused.length, names: refused.join(', ') }) : ''
+    await this.reload()
+    if (count) this.notice = { text: done(count) }
+    if (error) this.error = error
+  }
+
+  /** The sentence that says a deleted conversation can still come back - from 「Deleted」, for as long as it is kept. */
+  private keptFor(): string {
+    return this.keeping.deletedDays
+      ? t('kept-for', 'You can bring it back from Deleted for {days} days.', { days: this.keeping.deletedDays })
+      : t('kept', 'You can bring it back from Deleted.')
+  }
+
+  private async askRemoveMany(ids: string[]) {
+    const ok = await this.ask(
+      t('remove', 'Delete'),
+      `${t('confirm-remove-many', 'Delete {count} conversations? They disappear for every participant.', { count: ids.length })} ${this.keptFor()}`,
+      t('remove', 'Delete')
+    )
+    if (ok) void this.runMany(ids, 'removed', id => this.admin.remove(id), count => t('removed-many', '{count} deleted.', { count }))
+  }
+
+  private async askLeaveMany(ids: string[]) {
+    const ok = await this.ask(
+      t('leave', 'Leave'),
+      t('confirm-leave-many', 'Leave {count} conversations? They stop coming to your list, and a group or private one is read again only when its owner brings you back.', { count: ids.length }),
+      t('leave', 'Leave')
+    )
+    if (ok) void this.runMany(ids, 'left', id => this.admin.leave(id), count => t('left-many', 'Left {count}.', { count }))
+  }
+
+  private hideMany(ids: string[]) {
+    void this.runMany(ids, 'hidden', id => this.admin.hide(id, true), count => t('hidden-many', '{count} hidden from your list.', { count }))
+  }
+
+  private restoreMany(ids: string[]) {
+    void this.runMany(ids, 'restored', id => this.admin.restore(id), count => t('restored-many', '{count} brought back.', { count }))
+  }
+
+  private async restoreOne(one: DeletedSessionEntry) {
+    const name = one.name || t('untitled', 'Untitled conversation')
+    await this.runMany([one.id], 'restored', id => this.admin.restore(id), () => t('restored', '"{name}" is back.', { name }))
+    if (this.notice) this.notice = { ...this.notice, open: { sessionId: one.id, kind: one.kind } }
+  }
+
   /* ── drawing ─────────────────────────────────────────────────────────────────────── */
 
   render(): TemplateResult {
@@ -490,7 +656,7 @@ export class AssistantSessionManager extends LitElement {
         <button class="new" @click=${() => this.emit('assistant-session-reset')}>+ ${t('new', 'New conversation')}</button>
       </div>
       <div class="filters">
-        <select aria-label=${t('filter-whose', 'Whose')} .value=${this.whose}
+        ${this.view === 'deleted' ? nothing : html`<select aria-label=${t('filter-whose', 'Whose')} .value=${this.whose}
           @change=${(e: Event) => this.refilter(() => (this.whose = (e.target as HTMLSelectElement).value as any))}>
           <option value="all">${t('filter-all', 'All')}</option>
           <option value="mine">${t('filter-mine', 'Started by me')}</option>
@@ -502,32 +668,115 @@ export class AssistantSessionManager extends LitElement {
           <option value="open">${t('filter-open', 'Public')}</option>
           <option value="group">${t('filter-group', 'Group')}</option>
           <option value="private">${t('filter-private', 'Private')}</option>
+        </select>`}
+        <select aria-label=${t('filter-view', 'Show')} .value=${this.view}
+          @change=${(e: Event) => this.setView((e.target as HTMLSelectElement).value as SessionView)}>
+          <option value="list">${t('view-list', 'Active')}</option>
+          <option value="archived">${t('view-archived', 'Including archived')}</option>
+          <option value="cleanup">${t('view-cleanup', 'Suggested to clear')}</option>
+          <option value="deleted">${t('view-deleted', 'Deleted')}</option>
         </select>
-        <label><input type="checkbox" .checked=${this.unreadOnly}
+        ${this.view === 'deleted' ? nothing : html`<label><input type="checkbox" .checked=${this.unreadOnly}
           @change=${(e: Event) => this.refilter(() => (this.unreadOnly = (e.target as HTMLInputElement).checked))} />${t('filter-unread', 'Unread')}</label>
         <label><input type="checkbox" .checked=${this.includeHidden}
-          @change=${(e: Event) => this.refilter(() => (this.includeHidden = (e.target as HTMLInputElement).checked))} />${t('filter-hidden', 'Including hidden')}</label>
+          @change=${(e: Event) => this.refilter(() => (this.includeHidden = (e.target as HTMLInputElement).checked))} />${t('filter-hidden', 'Including hidden')}</label>`}
         ${this.filtering ? html`<button class="clear" @click=${() => this.clearFilters()}>${t('reset-filters', 'Clear search and filters')}</button>` : nothing}
       </div>
+      ${this.renderPickBar()}
       <div class="list">
         ${this.error ? html`<div class="note" role="alert">${this.error}</div>` : nothing}
+        ${this.notice
+          ? html`<div class="note" role="status">${this.notice.text}${this.notice.open
+              ? html` <button class="open-link" @click=${() => this.emit('assistant-session-select', this.notice!.open)}>${t('open', 'Open')}</button>`
+              : nothing}</div>`
+          : nothing}
         ${this.loading ? html`<div class="note" role="status">${t('loading', 'Loading conversations…')}</div>` : nothing}
-        ${shown === 0 && !this.loading && !this.error
-          ? html`<div class="empty" role="status">${this.filtering ? t('filtered-empty', 'No conversations match these filters here.') : t('scope-empty', 'No conversations yet.')}</div>`
-          : this.entries.map(entry => this.renderRow(entry))}
-        ${shown < this.total
+        ${this.view === 'list' && this.cleanupCount > 0 && !this.search.trim()
+          ? html`<button class="suggest" @click=${() => this.setView('cleanup')}>${t('cleanup-suggest', '{count} of yours look ready to clear - see them', { count: this.cleanupCount })}</button>`
+          : nothing}
+        ${this.view === 'deleted'
+          ? this.deleted.length === 0 && !this.loading && !this.error
+            ? html`<div class="empty" role="status">${t('deleted-empty', 'Nothing you deleted here is kept.')}</div>`
+            : this.deleted.map(one => this.renderDeletedRow(one))
+          : shown === 0 && !this.loading && !this.error
+            ? html`<div class="empty" role="status">${this.view === 'cleanup'
+                ? t('cleanup-empty', 'Nothing of yours to clear here.')
+                : this.filtering ? t('filtered-empty', 'No conversations match these filters here.') : t('scope-empty', 'No conversations yet.')}</div>`
+            : this.entries.map(entry => this.renderRow(entry))}
+        ${this.view !== 'deleted' && shown < this.total
           ? html`<button class="more" @click=${() => this.loadMore()}>${t('load-more', 'Show more ({rest})', { rest: this.total - shown })}</button>`
           : nothing}
       </div>
       <!-- A hidden conversation must not be forgotten: say how many, and one press shows them. -->
-      ${this.hiddenCount > 0 && !this.includeHidden
+      ${this.hiddenCount > 0 && !this.includeHidden && (this.view === 'list' || this.view === 'archived')
         ? html`<button class="hiddenfilter" @click=${() => this.refilter(() => (this.includeHidden = true))}>
             <md-icon>visibility_off</md-icon>${t('hidden-count', '{count} hidden', { count: this.hiddenCount })}
           </button>`
         : nothing}
+      ${this.archivedCount > 0 && this.view === 'list'
+        ? html`<button class="hiddenfilter" @click=${() => this.setView('archived')}>
+            <md-icon>inventory_2</md-icon>${t('archived-count', '{count} archived - no activity for {days} days', { count: this.archivedCount, days: this.keeping.archiveDays ?? '' })}
+          </button>`
+        : nothing}
     `
   }
 
+  /** The box over the list: pick all, and what the picked ones can have done to them together. */
+  private renderPickBar() {
+    const rows: { id: string }[] = this.view === 'deleted' ? this.deleted : this.entries
+    if (!rows.length) return nothing
+    const picked = this.picked.length
+    const all = picked === rows.length
+    const toggleAll = (on: boolean) => (this.picked = on ? rows.map(row => row.id) : [])
+    const label = picked ? t('picked', '{count} picked', { count: picked }) : t('pick-all', 'Pick all')
+    if (this.view === 'deleted') {
+      return html`<div class="pickbar">
+        <label><input type="checkbox" .checked=${all} .indeterminate=${picked > 0 && !all} @change=${(e: Event) => toggleAll((e.target as HTMLInputElement).checked)} />${label}</label>
+        ${picked
+          ? html`<button class="act" ?disabled=${this.busy} @click=${() => this.restoreMany(this.picked)}>${t('restore-many', 'Bring back {count}', { count: picked })}</button>
+              <button class="act unpick" @click=${() => (this.picked = [])}>${t('unpick', 'Clear the pick')}</button>`
+          : nothing}
+      </div>`
+    }
+    const can = bulkActions(this.entries.filter(entry => this.picked.includes(entry.id)))
+    return html`<div class="pickbar">
+      <label><input type="checkbox" .checked=${all} .indeterminate=${picked > 0 && !all} @change=${(e: Event) => toggleAll((e.target as HTMLInputElement).checked)} />${label}</label>
+      ${picked
+        ? html`${can.remove.length
+              ? html`<button class="act danger" ?disabled=${this.busy} @click=${() => this.askRemoveMany(can.remove)}>${t('remove-many', 'Delete {count}', { count: can.remove.length })}</button>`
+              : nothing}
+            ${can.leave.length
+              ? html`<button class="act" ?disabled=${this.busy} @click=${() => this.askLeaveMany(can.leave)}>${t('leave-many', 'Leave {count}', { count: can.leave.length })}</button>`
+              : nothing}
+            ${can.hide.length
+              ? html`<button class="act" ?disabled=${this.busy} @click=${() => this.hideMany(can.hide)}>${t('hide-many', 'Hide {count}', { count: can.hide.length })}</button>`
+              : nothing}
+            <button class="act unpick" @click=${() => (this.picked = [])}>${t('unpick', 'Clear the pick')}</button>`
+        : nothing}
+    </div>`
+  }
+
+  private renderDeletedRow(one: DeletedSessionEntry): TemplateResult {
+    const name = one.name || t('untitled', 'Untitled conversation')
+    const day = (at?: string) => (at && Number.isFinite(Date.parse(at)) ? new Intl.DateTimeFormat(i18next.language || 'en', { month: 'short', day: 'numeric' }).format(new Date(at)) : '')
+    return html`<div class="row deleted">
+      <label class="pick-area"><input type="checkbox" class="pick" aria-label=${t('pick', 'Pick {name}', { name })} .checked=${this.picked.includes(one.id)}
+        @change=${(e: Event) => this.togglePick(one.id, (e.target as HTMLInputElement).checked)} /></label>
+      <div class="open-row">
+        <div class="title">${name}</div>
+        <span class="meta">${t('deleted-on', 'Deleted {date}', { date: day(one.deletedAt) })}${one.purgesAt ? html` · ${t('purges-on', 'emptied {date}', { date: day(one.purgesAt) })}` : nothing}</span>
+      </div>
+      <button class="restore" ?disabled=${this.busy} @click=${() => this.restoreOne(one)}>${t('restore', 'Bring back')}</button>
+    </div>`
+  }
+
+  /** Why a row is where it is: archived, or suggested for clearing. */
+  private renderState(entry: AssistantSessionEntry) {
+    if (entry.cleanupReason === 'empty') return html` · ${t('reason-empty', 'Never asked anything')}`
+    if (entry.cleanupReason === 'inactive') return html` · ${t('reason-inactive', 'No activity for {days} days', { days: entry.idleDays ?? '' })}`
+    return entry.archived ? html` · ${t('archived', 'Archived')}` : nothing
+  }
+
   private renderRow(entry: AssistantSessionEntry): TemplateResult {
     const name = entry.name || t('untitled', 'Untitled conversation')
     const actions = sessionActions(entry)
@@ -552,11 +801,13 @@ export class AssistantSessionManager extends LitElement {
     return html`<div
       class="row ${entry.unread ? 'unread' : ''} ${entry.hidden ? 'hidden' : ''} ${entry.id === this.sessionId ? 'current' : ''} ${isOpen ? 'open-audience' : ''}"
     >
+      <label class="pick-area"><input type="checkbox" class="pick" aria-label=${t('pick', 'Pick {name}', { name })} .checked=${this.picked.includes(entry.id)}
+        @change=${(e: Event) => this.togglePick(entry.id, (e.target as HTMLInputElement).checked)} /></label>
       <span class="dot"></span>
       <button class="open-row" aria-current=${entry.id === this.sessionId ? 'true' : 'false'} @click=${() => this.emit('assistant-session-select', { sessionId: entry.id, kind: entry.kind })}>
         <div class="title">${name}</div>
         <div class="prev">${entry.lastMessagePreview || ''}</div>
-        <span class="meta">${this.renderAudience(entry.visibility)}${entry.lastMessageAt && Number.isFinite(Date.parse(entry.lastMessageAt)) ? html` · <time datetime=${entry.lastMessageAt}>${new Intl.DateTimeFormat(i18next.language || 'en', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }).format(new Date(entry.lastMessageAt))}</time>` : nothing}${entry.mine ? html` · ${t('filter-mine', 'Started by me')}` : nothing}</span>
+        <span class="meta">${this.renderAudience(entry.visibility)}${entry.lastMessageAt && Number.isFinite(Date.parse(entry.lastMessageAt)) ? html` · <time datetime=${entry.lastMessageAt}>${new Intl.DateTimeFormat(i18next.language || 'en', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }).format(new Date(entry.lastMessageAt))}</time>` : nothing}${entry.mine ? html` · ${t('filter-mine', 'Started by me')}` : nothing}${this.renderState(entry)}</span>
       </button>
       <button
         class="more-menu"
@@ -613,7 +864,7 @@ export class AssistantSessionManager extends LitElement {
   private async askRemove(entry: AssistantSessionEntry, name: string) {
     const ok = await this.ask(
       t('remove', 'Delete'),
-      t('confirm-remove', 'Delete "{name}"? It disappears for every participant and cannot be brought back.', { name }),
+      `${t('confirm-remove', 'Delete "{name}"? It disappears for every participant.', { name })} ${this.keptFor()}`,
       t('remove', 'Delete')
     )
     if (ok) this._removeSession(entry)

package/client/index.ts

@@ -24,6 +24,8 @@ export * from './utils/assistant-proposals.js'
 export * from './components/workspace-view.js'
 export * from './utils/assistant-ask.js'
 export * from './utils/assistant-selection.js'
+/* 「AI와 작업」 over a list - every application's lists hand their picked rows by it (shared-dock §2-11-1). */
+export * from './components/assistant-selection-bar.js'
 export * from './utils/assistant-activity.js'
 export * from './utils/assistant-request-context.js'
 export * from './utils/assistant-capability.js'