Nightly Build / build (push) Successful in 7m51s
An eye next to the paperclip shares what the user has open with their next
message: the page, the folder being browsed, the file open in the viewer and
any highlighted passage (line numbers where a source view exists), plus which
entity a detail page is about. The bag is client-authored {label, value} pairs
in English — the backend only clamps (chars, never bytes), neutralizes the
harness tag and renders one <system-extra> block per message, deduped
consecutively so it appears exactly when the view changed. On by default,
per-device toggle, hover/tap to preview, a chip on every sent message;
docs/view-context.md for users, an updated harness.md clause for the model.
101 lines
3.1 KiB
JavaScript
101 lines
3.1 KiB
JavaScript
import { html, nothing } from 'lit';
|
|
import { LightElement } from '../../lib/base.js';
|
|
import { setSlice, clearSlice } from '../../lib/view-context.js';
|
|
import { RunningTasksSection } from './running.js';
|
|
import { CronJobsSection } from './cron.js';
|
|
import { ScheduledTasksSection } from './scheduled.js';
|
|
import { TaskHistorySection } from './history.js';
|
|
|
|
const SECTIONS = ['running', 'cron', 'scheduled', 'history'];
|
|
|
|
/// The view-context slice this page owns (see `lib/view-context.js`).
|
|
const VIEW_SLICE = 'entity@tasks';
|
|
|
|
export class TasksPage extends LightElement {
|
|
static properties = {
|
|
_open: { state: true },
|
|
_section: { state: true },
|
|
};
|
|
|
|
constructor() {
|
|
super();
|
|
this._open = false;
|
|
this._section = 'running';
|
|
}
|
|
|
|
connectedCallback() {
|
|
super.connectedCallback();
|
|
window.addEventListener('llm-page-change', (e) => {
|
|
const open = e.detail.page === 'tasks';
|
|
this._open = open;
|
|
this.style.display = open ? 'flex' : 'none';
|
|
if (open) {
|
|
const sec = this._sectionFromHash();
|
|
this._section = sec;
|
|
this._loadSection(sec);
|
|
this._publishViewContext();
|
|
if (!location.hash.includes('/')) {
|
|
history.replaceState({ page: 'tasks', section: sec }, '', '#tasks/' + sec);
|
|
}
|
|
} else {
|
|
clearSlice(VIEW_SLICE);
|
|
}
|
|
});
|
|
window.addEventListener('tasks-section-change', (e) => {
|
|
if (!this._open) return;
|
|
const sec = e.detail.section;
|
|
this._section = sec;
|
|
this._loadSection(sec);
|
|
this._publishViewContext();
|
|
});
|
|
}
|
|
|
|
disconnectedCallback() {
|
|
clearSlice(VIEW_SLICE);
|
|
super.disconnectedCallback();
|
|
}
|
|
|
|
// The entity slice: which of the four sections is showing.
|
|
_publishViewContext() {
|
|
setSlice(VIEW_SLICE, [{ label: 'Open section', value: this._section }]);
|
|
}
|
|
|
|
_sectionFromHash() {
|
|
const parts = location.hash.slice(1).split('/');
|
|
if (parts[0] === 'tasks' && parts[1]) {
|
|
return SECTIONS.includes(parts[1]) ? parts[1] : 'running';
|
|
}
|
|
return 'running';
|
|
}
|
|
|
|
_loadSection(sec) {
|
|
this.updateComplete.then(() => {
|
|
const el = this.querySelector(`[data-section="${sec}"]`);
|
|
if (el?.load) el.load();
|
|
});
|
|
}
|
|
|
|
render() {
|
|
if (!this._open) return nothing;
|
|
return html`
|
|
${this._section === 'running'
|
|
? html`<task-running-section data-section="running"></task-running-section>`
|
|
: nothing}
|
|
${this._section === 'cron'
|
|
? html`<task-cron-jobs-section data-section="cron"></task-cron-jobs-section>`
|
|
: nothing}
|
|
${this._section === 'scheduled'
|
|
? html`<task-scheduled-section data-section="scheduled"></task-scheduled-section>`
|
|
: nothing}
|
|
${this._section === 'history'
|
|
? html`<task-history-section data-section="history"></task-history-section>`
|
|
: nothing}
|
|
`;
|
|
}
|
|
}
|
|
|
|
customElements.define('task-running-section', RunningTasksSection);
|
|
customElements.define('task-cron-jobs-section', CronJobsSection);
|
|
customElements.define('task-scheduled-section', ScheduledTasksSection);
|
|
customElements.define('task-history-section', TaskHistorySection);
|