From ca4f7f382a351479e58285404e27a5ff81c4cdd0 Mon Sep 17 00:00:00 2001 From: sua yoo Date: Wed, 27 May 2026 13:59:15 -0700 Subject: [PATCH 1/3] add icon --- .../item-dependency-list.ts | 47 ++++++++++++++----- 1 file changed, 34 insertions(+), 13 deletions(-) diff --git a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts index 35f78f38cb..225ef14115 100644 --- a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts +++ b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts @@ -1,8 +1,9 @@ -import { localized, msg } from "@lit/localize"; +import { localized, msg, str } from "@lit/localize"; import { html, nothing, unsafeCSS } from "lit"; import { customElement, property } from "lit/decorators.js"; import { ifDefined } from "lit/directives/if-defined.js"; import { repeat } from "lit/directives/repeat.js"; +import { when } from "lit/directives/when.js"; import { collectionStatusIcon } from "../templates/collection-status-icon"; @@ -105,6 +106,25 @@ export class ItemDependencyList extends BtrixElement { minute: "2-digit", }); + const missingDeps = (ids: string[]) => { + const dependencies_count = this.localize.number(ids.length); + const plural_of_dependencies = pluralOf("dependencies", ids.length); + + return html` + + `; + }; + return html` ${collectionStatusIcon({ item, collectionId })} @@ -121,6 +141,7 @@ export class ItemDependencyList extends BtrixElement { + ${when(item.missingRequiresCrawls, missingDeps)} - ${ - numDependencies - ? html` - ${dedupeIcon({ - hasDependencies: true, - hasDependents: !!item.requiredByCrawls.length, - })} - ${this.localize.number(numDependencies)} - ${pluralOf("dependencies", numDependencies)} - ` - : nothing - } + ${ + numDependencies + ? html` + ${dedupeIcon({ + hasDependencies: true, + hasDependents: !!item.requiredByCrawls.length, + })} + ${this.localize.number(numDependencies)} + ${pluralOf("dependencies", numDependencies)} + ` + : nothing + } From 468a70a44f7e2262687cf93debdd5a263f0b674c Mon Sep 17 00:00:00 2001 From: sua yoo Date: Tue, 6 Oct 2026 12:15:20 -0700 Subject: [PATCH 2/3] fix pluralization --- .../item-dependency-list.ts | 41 +++++++++++++++---- frontend/src/plurals/dependencies.ts | 35 ++++++++++++++++ 2 files changed, 68 insertions(+), 8 deletions(-) create mode 100644 frontend/src/plurals/dependencies.ts diff --git a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts index 225ef14115..cadf231539 100644 --- a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts +++ b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts @@ -13,10 +13,11 @@ import { BtrixElement } from "@/classes/BtrixElement"; import { dedupeIcon } from "@/features/collections/templates/dedupe-icon"; import { dedupeStatusText } from "@/features/collections/templates/dedupe-status-text"; import type { ArchivedItemSectionName } from "@/pages/org/archived-item-detail/archived-item-detail"; +import { pluralOfDependencies } from "@/plurals/dependencies"; import { OrgTab, WorkflowTab } from "@/routes"; import type { ArchivedItem } from "@/types/crawler"; import { isCrawl, renderName } from "@/utils/crawler"; -import { pluralOf } from "@/utils/pluralize"; +import { pluralize } from "@/utils/pluralize"; const styles = unsafeCSS(stylesheet); @@ -106,14 +107,39 @@ export class ItemDependencyList extends BtrixElement { minute: "2-digit", }); + console.log(item); + const missingDeps = (ids: string[]) => { - const dependencies_count = this.localize.number(ids.length); - const plural_of_dependencies = pluralOf("dependencies", ids.length); + const count = this.localize.number(ids.length); + const content = pluralize(ids.length, { + zero: msg("Includes 0 missing dependencies", { + desc: "plural form of 'Includes X missing dependencies' for zero dependencies", + id: "includes_x_missing_dependencies.plural.zero", + }), + one: msg("Includes 1 missing dependency", { + desc: "plural form of 'Includes X missing dependencies' for one dependency", + id: "includes_x_missing_dependencies.plural.one", + }), + two: msg("Includes 2 missing dependencies", { + desc: "plural form of 'Includes X missing dependencies' for two dependencies", + id: "includes_x_missing_dependencies.plural.two", + }), + few: msg(str`Includes ${count} missing dependencies`, { + desc: "plural form of 'Includes X missing dependencies' for few dependencies", + id: "includes_x_missing_dependencies.plural.few", + }), + many: msg(str`Includes ${count} missing dependencies`, { + desc: "plural form of 'Includes X missing dependencies' for many dependencies", + id: "includes_x_missing_dependencies.plural.many", + }), + other: msg(str`Includes ${count} missing dependencies`, { + desc: "plural form of 'Includes X missing dependencies' for other dependencies", + id: "includes_x_missing_dependencies.plural.other", + }), + }); return html` @@ -156,8 +182,7 @@ export class ItemDependencyList extends BtrixElement { hasDependencies: true, hasDependents: !!item.requiredByCrawls.length, })} - ${this.localize.number(numDependencies)} - ${pluralOf("dependencies", numDependencies)} + ${pluralOfDependencies(numDependencies)} ` : nothing } diff --git a/frontend/src/plurals/dependencies.ts b/frontend/src/plurals/dependencies.ts new file mode 100644 index 0000000000..0226850049 --- /dev/null +++ b/frontend/src/plurals/dependencies.ts @@ -0,0 +1,35 @@ +import { msg, str } from "@lit/localize"; + +import localize from "@/utils/localize"; +import { pluralize } from "@/utils/pluralize"; +import { cached } from "@/utils/weakCache"; + +export const pluralOfDependencies = cached((number: number) => { + const count = localize.number(number, { notation: "compact" }); + return pluralize(number, { + zero: msg("0 dependencies", { + desc: "plural form of 'X dependencies' for zero dependencies", + id: "x_dependencies.plural.zero", + }), + one: msg("1 dependency", { + desc: "plural form of 'X dependencies' for one dependency", + id: "x_dependencies.plural.one", + }), + two: msg("2 dependencies", { + desc: "plural form of 'X dependencies' for two dependencies", + id: "x_dependencies.plural.two", + }), + few: msg(str`${count} dependencies`, { + desc: "plural form of 'X dependencies' for few dependencies", + id: "x_dependencies.plural.few", + }), + many: msg(str`${count} dependencies`, { + desc: "plural form of 'X dependencies' for many dependencies", + id: "x_dependencies.plural.many", + }), + other: msg(str`${count} dependencies`, { + desc: "plural form of 'X dependencies' for other dependencies", + id: "x_dependencies.plural.other", + }), + }); +}); From aa2e114b703cfae2ef5c6627029a56de5f3a9de5 Mon Sep 17 00:00:00 2001 From: sua yoo Date: Tue, 6 Oct 2026 12:28:12 -0700 Subject: [PATCH 3/3] add endpoint --- .../item-dependency-list.ts | 24 +++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts index cadf231539..5f64f3ad69 100644 --- a/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts +++ b/frontend/src/features/archived-items/item-dependency-list/item-dependency-list.ts @@ -1,4 +1,5 @@ import { localized, msg, str } from "@lit/localize"; +import { Task } from "@lit/task"; import { html, nothing, unsafeCSS } from "lit"; import { customElement, property } from "lit/decorators.js"; import { ifDefined } from "lit/directives/if-defined.js"; @@ -15,6 +16,7 @@ import { dedupeStatusText } from "@/features/collections/templates/dedupe-status import type { ArchivedItemSectionName } from "@/pages/org/archived-item-detail/archived-item-detail"; import { pluralOfDependencies } from "@/plurals/dependencies"; import { OrgTab, WorkflowTab } from "@/routes"; +import { type APIPaginatedList } from "@/types/api"; import type { ArchivedItem } from "@/types/crawler"; import { isCrawl, renderName } from "@/utils/crawler"; import { pluralize } from "@/utils/pluralize"; @@ -39,6 +41,16 @@ export class ItemDependencyList extends BtrixElement { ArchivedItem | undefined >(); + private readonly missingDependenciesTask = new Task(this, { + task: async ([collectionId], { signal }) => { + return this.api.fetch>( + `/orgs/${this.orgId}/${collectionId}/dedupeIndex/missingDependencies`, + { signal }, + ); + }, + args: () => [this.collectionId] as const, + }); + disconnectedCallback(): void { this.timerIds.forEach(window.clearTimeout); super.disconnectedCallback(); @@ -107,11 +119,9 @@ export class ItemDependencyList extends BtrixElement { minute: "2-digit", }); - console.log(item); - - const missingDeps = (ids: string[]) => { - const count = this.localize.number(ids.length); - const content = pluralize(ids.length, { + const missingDeps = (total: number) => { + const count = this.localize.number(total); + const tooltip = pluralize(total, { zero: msg("Includes 0 missing dependencies", { desc: "plural form of 'Includes X missing dependencies' for zero dependencies", id: "includes_x_missing_dependencies.plural.zero", @@ -139,7 +149,7 @@ export class ItemDependencyList extends BtrixElement { }); return html` @@ -167,7 +177,7 @@ export class ItemDependencyList extends BtrixElement { - ${when(item.missingRequiresCrawls, missingDeps)} + ${when(this.missingDependenciesTask.value?.total, missingDeps)}