From a48d0279a4ef1af5e4f7be44860f1dbed5dad825 Mon Sep 17 00:00:00 2001 From: sua yoo Date: Wed, 1 Oct 2025 12:36:52 -0700 Subject: [PATCH 1/3] add query --- .../archived-items/item-metadata-editor.ts | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/frontend/src/features/archived-items/item-metadata-editor.ts b/frontend/src/features/archived-items/item-metadata-editor.ts index d719dbee37..33f51e5c8a 100644 --- a/frontend/src/features/archived-items/item-metadata-editor.ts +++ b/frontend/src/features/archived-items/item-metadata-editor.ts @@ -1,8 +1,9 @@ import { localized, msg } from "@lit/localize"; +import type { SlTextarea } from "@shoelace-style/shoelace"; import { serialize } from "@shoelace-style/shoelace/dist/utilities/form.js"; import Fuse from "fuse.js"; import { html } from "lit"; -import { customElement, property, state } from "lit/decorators.js"; +import { customElement, property, query, state } from "lit/decorators.js"; import { BtrixElement } from "@/classes/BtrixElement"; import type { @@ -10,7 +11,10 @@ import type { Tags, TagsChangeEvent, } from "@/components/ui/tag-input"; -import { type CollectionsChangeEvent } from "@/features/collections/collections-add"; +import type { + CollectionsAdd, + CollectionsChangeEvent, +} from "@/features/collections/collections-add"; import type { ArchivedItem } from "@/types/crawler"; import { type WorkflowTag, type WorkflowTags } from "@/types/workflow"; import { maxLengthValidator } from "@/utils/form"; @@ -56,6 +60,12 @@ export class CrawlMetadataEditor extends BtrixElement { @state() private collectionsToSave: string[] = []; + @query("#description-input") + public readonly descriptionInput?: SlTextarea | null; + + @query("#collection-input") + public readonly collectionInput?: CollectionsAdd | null; + // For fuzzy search: private readonly fuse = new Fuse([], { keys: ["tag"], @@ -109,6 +119,7 @@ export class CrawlMetadataEditor extends BtrixElement { ` : ``}
Date: Wed, 1 Oct 2025 12:42:21 -0700 Subject: [PATCH 2/3] focus[ --- .../archived-item-detail.ts | 35 ++++++++++++++----- 1 file changed, 27 insertions(+), 8 deletions(-) diff --git a/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts b/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts index ffd0981c71..5e88f83448 100644 --- a/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts +++ b/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts @@ -10,6 +10,7 @@ import capitalize from "lodash/fp/capitalize"; import { BtrixElement } from "@/classes/BtrixElement"; import { type Dialog } from "@/components/ui/dialog"; import { ClipboardController } from "@/controllers/clipboard"; +import type { CrawlMetadataEditor } from "@/features/archived-items/item-metadata-editor"; import { pageBack, pageNav, type Breadcrumb } from "@/layouts/pageHeader"; import { WorkflowTab } from "@/routes"; import type { APIPaginatedList } from "@/types/api"; @@ -116,6 +117,9 @@ export class ArchivedItemDetail extends BtrixElement { @query("#cancelQARunDialog") private readonly cancelQARunDialog?: Dialog | null; + @query("btrix-item-metadata-editor") + private readonly editDialog?: CrawlMetadataEditor | null; + private readonly tabLabels: Omit< Record, "watch" | "exclusions" @@ -421,7 +425,7 @@ export class ArchivedItemDetail extends BtrixElement { this.openMetadataEditor("metadata")} label=${msg("Edit Archived Item")} > `, @@ -441,7 +445,7 @@ export class ArchivedItemDetail extends BtrixElement { this.openMetadataEditor("collections")} label=${msg("Edit Archived Item")} > `, @@ -669,11 +673,7 @@ export class ArchivedItemDetail extends BtrixElement { ${when( this.isCrawler, () => html` - { - this.openMetadataEditor(); - }} - > + ${msg("Edit Archived Item")} @@ -1319,7 +1319,26 @@ export class ArchivedItemDetail extends BtrixElement { } } - private openMetadataEditor() { + private openMetadataEditor(section?: "metadata" | "collections") { + if (section) { + this.editDialog?.addEventListener( + "sl-after-show", + () => { + switch (section) { + case "metadata": + this.editDialog?.descriptionInput?.focus(); + break; + case "collections": + this.editDialog?.collectionInput?.focus(); + break; + default: + break; + } + }, + { once: true }, + ); + } + this.openDialogName = "metadata"; } From afc4fcfe716ba0c8f0a2d34a07882fc090fb8228 Mon Sep 17 00:00:00 2001 From: sua yoo Date: Wed, 1 Oct 2025 12:45:38 -0700 Subject: [PATCH 3/3] fix focus --- frontend/src/features/collections/collections-add.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/frontend/src/features/collections/collections-add.ts b/frontend/src/features/collections/collections-add.ts index bf3850ec80..dd5d265805 100644 --- a/frontend/src/features/collections/collections-add.ts +++ b/frontend/src/features/collections/collections-add.ts @@ -55,7 +55,7 @@ export class CollectionsAdd extends BtrixElement { @state() private collectionIds: string[] = []; - @query("sl-input") + @query("#search-input") private readonly input?: SlInput | null; @query("btrix-combobox") @@ -82,6 +82,11 @@ export class CollectionsAdd extends BtrixElement { args: () => [this.searchByValue, this.hasSearchStr] as const, }); + public focus() { + // Move focus to search input + this.input?.focus(); + } + connectedCallback() { if (this.initialCollections) { this.collectionIds = this.initialCollections; @@ -152,6 +157,7 @@ export class CollectionsAdd extends BtrixElement { }} >