Skip to content

Commit a4e4d07

Browse files
SuaYooSuaYoo
authored
fix: Various dedupe UI fixes (#3203)
1 parent 9c842d0 commit a4e4d07

File tree

8 files changed

+232
-127
lines changed

8 files changed

+232
-127
lines changed

‎frontend/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@
8080
"pretty-ms": "^7.0.1",
8181
"query-string": "^8.1.0",
8282
"regex-colorizer": "^1.0.2",
83-
"replaywebpage": "^2.2.4",
83+
"replaywebpage": "^2.4.3",
8484
"slugify": "^1.6.6",
8585
"style-loader": "^3.3.0",
8686
"tabbable": "^6.2.0",

‎frontend/src/features/admin/org-features-dialog.ts‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,12 +88,18 @@ export class OrgFeatureFlags extends BtrixElement {
8888
method: "POST",
8989
body: JSON.stringify({ [name]: value }),
9090
});
91+
92+
this.notify.toast({
93+
message: `${value ? msg("Feature turned on") : msg("Feature turned off")}: ${name}`,
94+
variant: "success",
95+
id: "flag-update-status",
96+
});
9197
} catch (e) {
9298
console.error("Failed to update feature flag", { name, value, error: e });
9399
this.notify.toast({
94100
message: msg(str`Failed to update feature flag ${name}`),
95101
variant: "danger",
96-
id: "flag-update-error",
102+
id: "flag-update-status",
97103
});
98104
}
99105
this.dispatchEvent(

‎frontend/src/features/collections/collection-workflow-list.ts‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@ import { customElement, property, queryAll, state } from "lit/decorators.js";
55
import { ifDefined } from "lit/directives/if-defined.js";
66
import { repeat } from "lit/directives/repeat.js";
77
import { until } from "lit/directives/until.js";
8+
import { when } from "lit/directives/when.js";
89
import queryString from "query-string";
910

1011
import { BtrixElement } from "@/classes/BtrixElement";
12+
import { dedupeStatusIcon } from "@/features/archived-items/templates/dedupe-status-icon";
1113
import type { CollectionWorkflowListSettingChangeEvent } from "@/features/collections/collection-workflow-list/settings";
1214
import type {
1315
APIPaginatedList,
@@ -228,19 +230,15 @@ export class CollectionWorkflowList extends BtrixElement {
228230
>
229231
<div class="flex-1 overflow-hidden">${this.renderName(workflow)}</div>
230232
<div
231-
class="flex-none whitespace-nowrap text-neutral-500 md:text-right"
233+
class="flex flex-none items-center gap-3 whitespace-nowrap text-neutral-500 md:text-right"
232234
>
233235
${until(
234-
countAsync.then(({ total, selected }) =>
235-
total === 1
236-
? msg(
237-
str`${this.localize.number(selected)} / ${this.localize.number(total)} crawl`,
238-
)
239-
: total
240-
? msg(
241-
str`${this.localize.number(selected)} / ${this.localize.number(total)} crawls`,
242-
)
243-
: msg("0 crawls"),
236+
countAsync.then(
237+
({ total, selected }) =>
238+
html`${total
239+
? `${this.localize.number(selected)} / ${this.localize.number(total)}`
240+
: 0}
241+
${pluralOf("crawls", total)}`,
244242
),
245243
)}
246244
</div>
@@ -282,7 +280,10 @@ export class CollectionWorkflowList extends BtrixElement {
282280
data-crawl-id=${crawl.id}
283281
>
284282
<div class="grid flex-1 grid-cols-5 items-center">
285-
<div class="col-span-3 md:col-span-1">
283+
<div class="col-span-4 flex items-center gap-2 md:col-span-2">
284+
${when(this.featureFlags.has("dedupeEnabled"), () =>
285+
dedupeStatusIcon(crawl),
286+
)}
286287
<btrix-format-date
287288
.date=${crawl.finished}
288289
month="2-digit"
@@ -292,21 +293,20 @@ export class CollectionWorkflowList extends BtrixElement {
292293
minute="2-digit"
293294
></btrix-format-date>
294295
</div>
295-
<div class="col-span-2 md:col-span-1">
296-
<btrix-crawl-status state=${crawl.state}></btrix-crawl-status>
297-
</div>
298-
<div class="col-span-3 md:col-span-1">
296+
<div class="col-span-1 md:col-span-1">
299297
${this.localize.bytes(crawl.fileSize || 0, {
300298
unitDisplay: "narrow",
301299
})}
302300
</div>
303-
<div class="col-span-2 md:col-span-1">
301+
<div class="col-span-5 md:col-span-1">
304302
${pageCount === 1
305303
? msg(str`${this.localize.number(pageCount)} page`)
306304
: msg(str`${this.localize.number(pageCount)} pages`)}
307305
</div>
308-
<div class="col-span-5 truncate md:col-span-1">
309-
${msg(str`Started by ${crawl.userName}`)}
306+
<div class="col-span-35md:col-span-1">
307+
<btrix-qa-review-status
308+
status=${ifDefined(crawl.reviewStatus)}
309+
></btrix-qa-review-status>
310310
</div>
311311
</div>
312312
</sl-tree-item>

‎frontend/src/features/collections/collection-workflow-list/settings.ts‎

Lines changed: 63 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import type { SlSwitch } from "@shoelace-style/shoelace";
33
import clsx from "clsx";
44
import { html, type PropertyValues } from "lit";
55
import { customElement, property, state } from "lit/decorators.js";
6+
import { when } from "lit/directives/when.js";
67

78
import { BtrixElement } from "@/classes/BtrixElement";
89
import type { BtrixChangeEvent } from "@/events/btrix-change";
@@ -62,76 +63,93 @@ export class CollectionWorkflowListSettings extends BtrixElement {
6263
)}
6364
>
6465
<div class="flex grow basis-0 transition-all">
65-
<sl-switch
66-
class="mx-[2px] inline-block"
67-
size="small"
68-
?checked=${this.autoAdd}
69-
?disabled=${!this.workflowId}
70-
@sl-change=${(e: CustomEvent) => {
71-
e.stopPropagation();
72-
73-
this.autoAdd = (e.target as SlSwitch).checked;
74-
75-
this.dispatchEvent(
76-
new CustomEvent<
77-
CollectionWorkflowListSettingChangeEvent["detail"]
78-
>("btrix-change", {
79-
detail: {
80-
value: {
81-
autoAdd: this.autoAdd,
82-
},
83-
},
84-
}),
85-
);
86-
}}
87-
>
88-
<span class="text-neutral-500">${msg("Auto-Add")}</span>
89-
</sl-switch>
90-
</div>
91-
<div
92-
class=${clsx(
93-
tw`basis-0 overflow-hidden transition-all`,
94-
this.autoAdd ? tw`grow` : tw`shrink`,
95-
this.collapse && tw`w-0`,
96-
)}
97-
>
9866
<btrix-popover
99-
content=${msg(
100-
"This workflow is using another collection to dedupe.",
101-
)}
67+
content="${msg(
68+
"This workflow is using another collection as its deduplication source.",
69+
)} ${msg(
70+
"Auto-adding new crawls to this collection may result in missing content.",
71+
)}"
10272
?disabled=${!disableDedupe}
73+
placement="left"
10374
hoist
10475
>
10576
<sl-switch
10677
class="mx-[2px] inline-block"
10778
size="small"
108-
?checked=${Boolean(
109-
this.dedupeCollId && this.dedupeCollId === this.collectionId,
110-
)}
111-
?disabled=${!this.workflowId || disableDedupe}
112-
@click=${(e: MouseEvent) => {
113-
e.stopPropagation();
114-
}}
79+
?checked=${this.autoAdd}
80+
?disabled=${!this.workflowId}
11581
@sl-change=${(e: CustomEvent) => {
11682
e.stopPropagation();
83+
84+
this.autoAdd = (e.target as SlSwitch).checked;
85+
11786
this.dispatchEvent(
11887
new CustomEvent<
11988
CollectionWorkflowListSettingChangeEvent["detail"]
12089
>("btrix-change", {
12190
detail: {
12291
value: {
12392
autoAdd: this.autoAdd,
124-
dedupe: (e.target as SlSwitch).checked,
12593
},
12694
},
12795
}),
12896
);
12997
}}
13098
>
131-
<span class="text-neutral-500">${msg("Dedupe")}</span>
99+
<span class="text-neutral-500">${msg("Auto-Add")}</span>
132100
</sl-switch>
133101
</btrix-popover>
134102
</div>
103+
${when(
104+
this.featureFlags.has("dedupeEnabled"),
105+
() =>
106+
html`<div
107+
class=${clsx(
108+
tw`basis-0 overflow-hidden transition-all`,
109+
this.autoAdd ? tw`grow` : tw`shrink`,
110+
this.collapse && tw`w-0`,
111+
)}
112+
>
113+
<btrix-popover
114+
content=${msg(
115+
"This workflow is using another collection as its deduplication source.",
116+
)}
117+
?disabled=${!disableDedupe}
118+
placement="bottom-end"
119+
hoist
120+
>
121+
<sl-switch
122+
class="mx-[2px] inline-block"
123+
size="small"
124+
?checked=${Boolean(
125+
this.dedupeCollId &&
126+
this.dedupeCollId === this.collectionId,
127+
)}
128+
?disabled=${!this.workflowId || disableDedupe}
129+
@click=${(e: MouseEvent) => {
130+
e.stopPropagation();
131+
}}
132+
@sl-change=${(e: CustomEvent) => {
133+
e.stopPropagation();
134+
this.dispatchEvent(
135+
new CustomEvent<
136+
CollectionWorkflowListSettingChangeEvent["detail"]
137+
>("btrix-change", {
138+
detail: {
139+
value: {
140+
autoAdd: this.autoAdd,
141+
dedupe: (e.target as SlSwitch).checked,
142+
},
143+
},
144+
}),
145+
);
146+
}}
147+
>
148+
<span class="text-neutral-500">${msg("Dedupe")}</span>
149+
</sl-switch>
150+
</btrix-popover>
151+
</div>`,
152+
)}
135153
</div>
136154
`;
137155
}

‎frontend/src/pages/org/collection-detail/collection-detail.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -637,7 +637,7 @@ export class CollectionDetail extends BtrixElement {
637637
private refreshReplay() {
638638
if (this.replayEmbed) {
639639
try {
640-
this.replayEmbed.fullReload();
640+
void this.replayEmbed.fullReload();
641641
} catch (e) {
642642
console.warn("Full reload not available in RWP");
643643
}
@@ -1234,7 +1234,7 @@ export class CollectionDetail extends BtrixElement {
12341234
this.isRwpLoaded = true;
12351235
}
12361236
if (this.rwpDoFullReload && this.replayEmbed) {
1237-
this.replayEmbed.fullReload();
1237+
void this.replayEmbed.fullReload();
12381238
this.rwpDoFullReload = false;
12391239
}
12401240
}}
@@ -1515,6 +1515,7 @@ export class CollectionDetail extends BtrixElement {
15151515
method: "POST",
15161516
},
15171517
);
1518+
this.refreshReplay();
15181519
await this.fetchCollection();
15191520

15201521
this.notify.toast({
@@ -1546,6 +1547,7 @@ export class CollectionDetail extends BtrixElement {
15461547
body: JSON.stringify(params),
15471548
},
15481549
);
1550+
this.refreshReplay();
15491551
await this.fetchCollection();
15501552

15511553
this.notify.toast({

‎frontend/src/pages/org/settings/components/deduplication.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import { indexAvailable } from "@/utils/dedupe";
2626
import { isNotEqual } from "@/utils/is-not-equal";
2727
import { pluralOf } from "@/utils/pluralize";
2828

29+
const POLL_INTERVAL_SECONDS = 30;
2930
const INITIAL_PAGE_SIZE = 10;
3031

3132
type DedupeSource = RequireExactlyOne<Collection, "indexStats">;
@@ -70,6 +71,24 @@ export class OrgSettingsDeduplication extends BtrixElement {
7071
args: () => [this.pagination] as const,
7172
});
7273

74+
private readonly pollTask = new Task(this, {
75+
task: async ([sources]) => {
76+
if (!sources) return;
77+
78+
window.clearTimeout(this.pollTask.value);
79+
80+
return window.setTimeout(() => {
81+
void this.sources.run();
82+
}, POLL_INTERVAL_SECONDS * 1000);
83+
},
84+
args: () => [this.sources.value] as const,
85+
});
86+
87+
disconnectedCallback(): void {
88+
super.disconnectedCallback();
89+
window.clearTimeout(this.pollTask.value);
90+
}
91+
7392
render() {
7493
return html`
7594
${this.sources.render({
@@ -291,6 +310,8 @@ export class OrgSettingsDeduplication extends BtrixElement {
291310
method: "POST",
292311
},
293312
);
313+
314+
window.clearTimeout(this.pollTask.value);
294315
await this.sources.run();
295316

296317
this.notify.toast({
@@ -325,6 +346,8 @@ export class OrgSettingsDeduplication extends BtrixElement {
325346
body: JSON.stringify(params),
326347
},
327348
);
349+
350+
window.clearTimeout(this.pollTask.value);
328351
await this.sources.run();
329352

330353
this.notify.toast({

‎frontend/src/pages/org/settings/settings.ts‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -220,18 +220,18 @@ export class OrgSettings extends BtrixElement {
220220
})}
221221
<btrix-org-settings-crawling-defaults></btrix-org-settings-crawling-defaults>
222222
</btrix-tab-group-panel>
223-
${when(
224-
this.featureFlags.has("dedupeEnabled"),
225-
() => html`
226-
<btrix-tab-group-panel name="deduplication">
223+
<btrix-tab-group-panel name="deduplication">
224+
${when(
225+
this.featureFlags.has("dedupeEnabled"),
226+
() => html`
227227
${this.renderPanelHeader({
228228
title: msg("Deduplication Sources"),
229229
beta: true,
230230
})}
231231
<btrix-org-settings-deduplication></btrix-org-settings-deduplication>
232-
</btrix-tab-group-panel>
233-
`,
234-
)}
232+
`,
233+
)}
234+
</btrix-tab-group-panel>
235235
</btrix-tab-group>`;
236236
}
237237

0 commit comments

Comments
 (0)