diff --git a/frontend/src/components/ui/select-crawler-proxy.ts b/frontend/src/components/ui/select-crawler-proxy.ts index 0b94c26daa..12362a179b 100644 --- a/frontend/src/components/ui/select-crawler-proxy.ts +++ b/frontend/src/components/ui/select-crawler-proxy.ts @@ -27,12 +27,12 @@ export type SelectCrawlerProxyUpdateEvent = * Usage example: * ```ts * selectedcrawlerProxy = value} + * .proxyServers=${proxyServers} + * btrix-change=${({value}) => selectedcrawlerProxy = value} * > * ``` * - * @event on-change + * @fires btrix-change */ @customElement("btrix-select-crawler-proxy") @localized() @@ -55,8 +55,12 @@ export class SelectCrawlerProxy extends BtrixElement { @state() private defaultProxy?: Proxy; + public get value() { + return this.selectedProxy?.id || ""; + } + protected firstUpdated() { - void this.fetchOrgProxies(); + void this.initProxies(); } // credit: https://dev.to/jorik/country-code-to-flag-emoji-a21 private countryCodeToFlagEmoji(countryCode: String): String { @@ -68,10 +72,6 @@ export class SelectCrawlerProxy extends BtrixElement { } render() { - /*if (this.crawlerProxys && this.crawlerProxys.length < 2) { - return html``; - }*/ - return html` { - // Refetch to keep list up to date - void this.fetchOrgProxies(); - }} @sl-hide=${this.stopProp} @sl-after-hide=${this.stopProp} > @@ -138,7 +134,7 @@ export class SelectCrawlerProxy extends BtrixElement { } this.dispatchEvent( - new CustomEvent("on-change", { + new CustomEvent("btrix-change", { detail: { value: this.selectedProxy ? this.selectedProxy.id : null, }, @@ -146,50 +142,23 @@ export class SelectCrawlerProxy extends BtrixElement { ); } - private async fetchOrgProxies(): Promise { - try { - const defaultProxyId = this.defaultProxyId; - - if (!this.defaultProxy) { - this.defaultProxy = this.proxyServers.find( - ({ id }) => id === defaultProxyId, - ); - } - - if (this.proxyId && !this.selectedProxy?.id) { - this.selectedProxy = this.proxyServers.find( - ({ id }) => id === this.proxyId, - ); - } - - if (!this.selectedProxy) { - this.proxyId = null; - this.dispatchEvent( - new CustomEvent("on-change", { - detail: { - value: null, - }, - }), - ); - this.selectedProxy = this.proxyServers.find( - ({ id }) => id === this.proxyId, - ); - } - - this.dispatchEvent( - new CustomEvent("on-update", { - detail: { - show: this.proxyServers.length > 1, - }, - }), + private async initProxies(): Promise { + const defaultProxyId = this.defaultProxyId; + + if (!this.defaultProxy) { + this.defaultProxy = this.proxyServers.find( + ({ id }) => id === defaultProxyId, ); - } catch (e) { - this.notify.toast({ - message: msg("Sorry, couldn't retrieve proxies at this time."), - variant: "danger", - icon: "exclamation-octagon", - id: "proxy-retrieve-status", - }); + } + + if (this.proxyId && !this.selectedProxy) { + this.selectedProxy = this.proxyServers.find( + ({ id }) => id === this.proxyId, + ); + } + + if (!this.selectedProxy) { + this.proxyId = null; } } diff --git a/frontend/src/features/browser-profiles/new-browser-profile-dialog.ts b/frontend/src/features/browser-profiles/new-browser-profile-dialog.ts index a490cf4674..a399ab29e3 100644 --- a/frontend/src/features/browser-profiles/new-browser-profile-dialog.ts +++ b/frontend/src/features/browser-profiles/new-browser-profile-dialog.ts @@ -99,8 +99,8 @@ export class NewBrowserProfileDialog extends LiteElement { )} .proxyServers=${this.proxies.servers} .proxyId="${this.proxyId || ""}" - @on-change=${(e: SelectCrawlerProxyChangeEvent) => - (this.proxyId = e.detail.value!)} + @btrix-change=${(e: SelectCrawlerProxyChangeEvent) => + (this.proxyId = e.detail.value)} > ` diff --git a/frontend/src/features/crawl-workflows/workflow-editor.ts b/frontend/src/features/crawl-workflows/workflow-editor.ts index 7f6f081dda..6ac6f4bcda 100644 --- a/frontend/src/features/crawl-workflows/workflow-editor.ts +++ b/frontend/src/features/crawl-workflows/workflow-editor.ts @@ -1343,7 +1343,7 @@ https://archiveweb.page/images/${"logo.svg"}`} )} .proxyServers=${this.proxies.servers} .proxyId="${this.formState.proxyId || ""}" - @on-change=${(e: SelectCrawlerProxyChangeEvent) => + @btrix-change=${(e: SelectCrawlerProxyChangeEvent) => this.updateFormState({ proxyId: e.detail.value, })} diff --git a/frontend/src/pages/org/settings/components/crawling-defaults.ts b/frontend/src/pages/org/settings/components/crawling-defaults.ts index 62773204dc..bf4d5ef3e1 100644 --- a/frontend/src/pages/org/settings/components/crawling-defaults.ts +++ b/frontend/src/pages/org/settings/components/crawling-defaults.ts @@ -10,6 +10,7 @@ import { ifDefined } from "lit/directives/if-defined.js"; import { BtrixElement } from "@/classes/BtrixElement"; import type { LanguageSelect } from "@/components/ui/language-select"; +import type { SelectCrawlerProxy } from "@/components/ui/select-crawler-proxy"; import { proxiesContext, type ProxiesContext } from "@/context/org"; import type { QueueExclusionTable } from "@/features/crawl-workflows/queue-exclusion-table"; import { columns, type Cols } from "@/layouts/columns"; @@ -65,6 +66,9 @@ export class OrgSettingsCrawlWorkflows extends BtrixElement { @query("btrix-language-select") languageSelect?: LanguageSelect | null; + @query("btrix-select-crawler-proxy") + proxySelect?: SelectCrawlerProxy | null; + @query('sl-button[type="submit"]') submitButton?: SlButton | null; @@ -75,7 +79,6 @@ export class OrgSettingsCrawlWorkflows extends BtrixElement { } render() { - console.log("crawling defaults:", this.proxies); return html` ${this.renderWorkflowDefaults()} `; } @@ -305,7 +308,7 @@ export class OrgSettingsCrawlWorkflows extends BtrixElement { blockAds: values.blockAds === "on", profileid: values.profileid, crawlerChannel: values.crawlerChannel, - proxyId: values.proxyId, + proxyId: this.proxySelect?.value || undefined, userAgent: values.userAgent, lang: this.languageSelect?.value || undefined, exclude: this.exclusionTable?.exclusions?.filter((v) => v) || [],