From f349b5bda7db0ebf5b9bc955b352e42f0d371b2f Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Tue, 7 May 2024 16:41:52 +0200 Subject: [PATCH] Bugfix: Examine Management Dashboard Status+Modals --- .../src/external/backend-api/src/models.ts | 17 ++-- .../src/external/backend-api/src/services.ts | 18 ++--- .../src/packages/core/modal/token/index.ts | 1 - .../examine-management-dashboard/index.ts | 1 + .../examine-management-dashboard/manifests.ts | 5 ++ .../examine-fields-settings-modal.element.ts | 73 +++++++++++++++++ .../examine-fields-settings-modal.token.ts | 6 +- .../modal/fields-settings/index.ts | 2 + .../examine-fields-viewer-modal.element.ts} | 40 +++++---- .../examine-fields-viewer-modal.token.ts | 19 +++++ .../modal/fields-viewer/index.ts | 2 + .../modal/index.ts | 2 + .../modal/manifests.ts | 18 +++++ .../fields-settings-modal.element.ts | 81 ------------------- .../views/section-view-examine-indexers.ts | 44 +++++----- .../views/section-view-examine-overview.ts | 24 +++--- .../views/section-view-examine-searchers.ts | 58 ++++++++++--- .../src/packages/search/manifests.ts | 10 +-- 18 files changed, 253 insertions(+), 168 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/index.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/manifests.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.element.ts rename src/Umbraco.Web.UI.Client/src/packages/{core/modal/token => search/examine-management-dashboard/modal/fields-settings}/examine-fields-settings-modal.token.ts (73%) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/index.ts rename src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/{views/modal-views/fields-viewer.element.ts => modal/fields-viewer/examine-fields-viewer-modal.element.ts} (60%) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.token.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/index.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/index.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/manifests.ts delete mode 100644 src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings-modal.element.ts diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models.ts index 9b65a819dc..da4e84c5d8 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/models.ts @@ -979,6 +979,11 @@ export enum HealthStatusModel { REBUILDING = 'Rebuilding' } +export type HealthStatusResponseModel = { + status: HealthStatusModel +message?: string | null + }; + export type HelpPageResponseModel = { name?: string | null description?: string | null @@ -993,7 +998,7 @@ parent?: ReferenceByIdModel | null export type IndexResponseModel = { name: string -healthStatus: HealthStatusModel +healthStatus: HealthStatusResponseModel canRebuild: boolean searcherName: string documentCount: number @@ -5236,15 +5241,15 @@ PostWebhook: { GetWebhookById: { id: string + }; +DeleteWebhookById: { + id: string + }; PutWebhookById: { id: string requestBody?: UpdateWebhookRequestModel - }; -DeleteWebhookById: { - id: string - }; GetWebhookEvents: { skip?: number @@ -5259,8 +5264,8 @@ take?: number ,GetWebhook: PagedWebhookResponseModel ,PostWebhook: string ,GetWebhookById: WebhookResponseModel - ,PutWebhookById: string ,DeleteWebhookById: string + ,PutWebhookById: string ,GetWebhookEvents: PagedWebhookEventModel } diff --git a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services.ts b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services.ts index 503eeca574..84d88c42c7 100644 --- a/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services.ts +++ b/src/Umbraco.Web.UI.Client/src/external/backend-api/src/services.ts @@ -9022,20 +9022,17 @@ take * @returns string Success * @throws ApiError */ - public static putWebhookById(data: WebhookData['payloads']['PutWebhookById']): CancelablePromise { + public static deleteWebhookById(data: WebhookData['payloads']['DeleteWebhookById']): CancelablePromise { const { - id, -requestBody + id } = data; return __request(OpenAPI, { - method: 'PUT', + method: 'DELETE', url: '/umbraco/management/api/v1/webhook/{id}', path: { id }, - body: requestBody, - mediaType: 'application/json', responseHeader: 'Umb-Notifications', errors: { 400: `Bad Request`, @@ -9050,17 +9047,20 @@ requestBody * @returns string Success * @throws ApiError */ - public static deleteWebhookById(data: WebhookData['payloads']['DeleteWebhookById']): CancelablePromise { + public static putWebhookById(data: WebhookData['payloads']['PutWebhookById']): CancelablePromise { const { - id + id, +requestBody } = data; return __request(OpenAPI, { - method: 'DELETE', + method: 'PUT', url: '/umbraco/management/api/v1/webhook/{id}', path: { id }, + body: requestBody, + mediaType: 'application/json', responseHeader: 'Umb-Notifications', errors: { 400: `Bad Request`, diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/index.ts b/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/index.ts index b6c574f8f0..4da1b3c794 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/index.ts @@ -4,7 +4,6 @@ export * from './confirm-modal.token.js'; export * from './debug-modal.token.js'; export * from './embedded-media-modal.token.js'; export * from './entity-user-permission-settings-modal.token.js'; -export * from './examine-fields-settings-modal.token.js'; export * from './icon-picker-modal.token.js'; export * from './item-picker-modal.token.js'; export * from './link-picker-modal.token.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/index.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/index.ts new file mode 100644 index 0000000000..28d9f38fba --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/index.ts @@ -0,0 +1 @@ +export * from './modal/index.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/manifests.ts new file mode 100644 index 0000000000..bf0b12484e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/manifests.ts @@ -0,0 +1,5 @@ +import { manifests as modalManifests } from './modal/manifests.js'; + +import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; + +export const manifests: Array = [...modalManifests]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.element.ts new file mode 100644 index 0000000000..485891ac1b --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.element.ts @@ -0,0 +1,73 @@ +import type { + UmbExamineFieldsSettingsModalData, + UmbExamineFieldsSettingsModalValue, + FieldSettingsType, +} from './examine-fields-settings-modal.token.js'; +import { html, css, customElement } from '@umbraco-cms/backoffice/external/lit'; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; +import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; + +@customElement('umb-examine-fields-settings-modal') +export class UmbExamineFieldsSettingsModalElement extends UmbModalBaseElement< + UmbExamineFieldsSettingsModalData, + UmbExamineFieldsSettingsModalValue +> { + render() { + return html` + ${this.#renderFields()} +
+ Close +
+ `; + } + + #setExposed(fieldSetting: FieldSettingsType) { + const newField: FieldSettingsType = { ...fieldSetting, exposed: !fieldSetting.exposed }; + + const updatedFields = + this.modalContext?.getValue().fields.map((field) => { + if (field.name === fieldSetting.name) return newField; + else return field; + }) ?? []; + + this.modalContext?.updateValue({ fields: updatedFields }); + } + + #renderFields() { + if (!this.value.fields.length) return; + return html` + ${Object.values(this.value.fields).map((field) => { + return html` +
`; + })} + `; + } + + static styles = [ + UmbTextStyles, + css` + :host { + display: relative; + } + + uui-scroll-container { + overflow-y: scroll; + max-height: 100%; + min-height: 0; + flex: 1; + } + `, + ]; +} + +export default UmbExamineFieldsSettingsModalElement; + +declare global { + interface HTMLElementTagNameMap { + 'umb-examine-fields-settings-modal': UmbExamineFieldsSettingsModalElement; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/examine-fields-settings-modal.token.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.token.ts similarity index 73% rename from src/Umbraco.Web.UI.Client/src/packages/core/modal/token/examine-fields-settings-modal.token.ts rename to src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.token.ts index ccf52d6a9d..8dedcff245 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/modal/token/examine-fields-settings-modal.token.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/examine-fields-settings-modal.token.ts @@ -1,8 +1,8 @@ -import { UmbModalToken } from './modal-token.js'; +import { UmbModalToken } from '@umbraco-cms/backoffice/modal'; export type UmbExamineFieldsSettingsModalData = never; -type FieldSettingsType = { +export type FieldSettingsType = { name: string; exposed: boolean; }; @@ -14,7 +14,7 @@ export type UmbExamineFieldsSettingsModalValue = { export const UMB_EXAMINE_FIELDS_SETTINGS_MODAL = new UmbModalToken< UmbExamineFieldsSettingsModalData, UmbExamineFieldsSettingsModalValue ->('Umb.Modal.ExamineFieldsSettings', { +>('Umb.Modal.Examine.FieldsSettings', { modal: { type: 'sidebar', size: 'small', diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/index.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/index.ts new file mode 100644 index 0000000000..6ca0fb4eb2 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-settings/index.ts @@ -0,0 +1,2 @@ +export * from './examine-fields-settings-modal.element.js'; +export * from './examine-fields-settings-modal.token.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-viewer.element.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.element.ts similarity index 60% rename from src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-viewer.element.ts rename to src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.element.ts index 66fa6a5d0f..af597bf466 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-viewer.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.element.ts @@ -1,11 +1,15 @@ +import type { + UmbExamineFieldsViewerModalData, + UmbExamineFieldsViewerModalValue, +} from './examine-fields-viewer-modal.token.js'; import { html, css, nothing, customElement } from '@umbraco-cms/backoffice/external/lit'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal'; -import type { SearchResultResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; -@customElement('umb-modal-element-fields-viewer') -export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< - SearchResultResponseModel & { name: string } +@customElement('umb-examine-fields-viewer-modal') +export class UmbExamineFieldsViewerModalElement extends UmbModalBaseElement< + UmbExamineFieldsViewerModalData, + UmbExamineFieldsViewerModalValue > { private _handleClose() { this.modalContext?.reject(); @@ -15,7 +19,7 @@ export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< if (!this.data) return nothing; return html` - + @@ -23,7 +27,7 @@ export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< Field Value - ${Object.values(this.data.fields ?? []).map((cell) => { + ${Object.values(this.data.searchResult.fields ?? []).map((cell) => { return html` ${cell.name} ${cell.values?.join(', ')} @@ -32,10 +36,13 @@ export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< -
- Close +
+
- + `; } @@ -45,11 +52,6 @@ export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< :host { display: relative; } - uui-dialog-layout { - display: flex; - flex-direction: column; - height: 100%; - } span { display: block; @@ -57,22 +59,18 @@ export class UmbModalElementFieldsViewerElement extends UmbModalBaseElement< } uui-scroll-container { - line-height: 0; overflow-y: scroll; max-height: 100%; min-height: 0; } - div { - margin-top: var(--uui-size-space-5); - display: flex; - flex-direction: row-reverse; - } `, ]; } +export default UmbExamineFieldsViewerModalElement; + declare global { interface HTMLElementTagNameMap { - 'umb-modal-element-fields-viewer': UmbModalElementFieldsViewerElement; + 'umb-examine-fields-viewer-modal': UmbExamineFieldsViewerModalElement; } } diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.token.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.token.ts new file mode 100644 index 0000000000..c0bea59bfe --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/examine-fields-viewer-modal.token.ts @@ -0,0 +1,19 @@ +import type { SearchResultResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; +import { UmbModalToken } from '@umbraco-cms/backoffice/modal'; + +export type UmbExamineFieldsViewerModalData = { + name: string; + searchResult: SearchResultResponseModel; +}; + +export type UmbExamineFieldsViewerModalValue = never; + +export const UMB_EXAMINE_FIELDS_VIEWER_MODAL = new UmbModalToken< + UmbExamineFieldsViewerModalData, + UmbExamineFieldsViewerModalValue +>('Umb.Modal.Examine.FieldsViewer', { + modal: { + type: 'sidebar', + size: 'small', + }, +}); diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/index.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/index.ts new file mode 100644 index 0000000000..de13abcf42 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/fields-viewer/index.ts @@ -0,0 +1,2 @@ +export * from './examine-fields-viewer-modal.element.js'; +export * from './examine-fields-viewer-modal.token.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/index.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/index.ts new file mode 100644 index 0000000000..6ade5af6a6 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/index.ts @@ -0,0 +1,2 @@ +export * from './fields-settings/index.js'; +export * from './fields-viewer/index.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/manifests.ts new file mode 100644 index 0000000000..42a6b8aa5c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/modal/manifests.ts @@ -0,0 +1,18 @@ +import type { ManifestModal, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; + +const modals: Array = [ + { + type: 'modal', + alias: 'Umb.Modal.Examine.FieldsSettings', + name: 'Examine Field Settings Modal', + js: () => import('./fields-settings/examine-fields-settings-modal.element.js'), + }, + { + type: 'modal', + alias: 'Umb.Modal.Examine.FieldsViewer', + name: 'Examine Field Viewer Modal', + js: () => import('./fields-viewer/examine-fields-viewer-modal.element.js'), + }, +]; + +export const manifests: Array = [...modals]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings-modal.element.ts deleted file mode 100644 index 0e9570875d..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/modal-views/fields-settings-modal.element.ts +++ /dev/null @@ -1,81 +0,0 @@ -import { html, css, customElement } from '@umbraco-cms/backoffice/external/lit'; -import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; -import type { - UmbExamineFieldsSettingsModalValue, - UmbExamineFieldsSettingsModalData} from '@umbraco-cms/backoffice/modal'; -import { - UmbModalBaseElement, -} from '@umbraco-cms/backoffice/modal'; - -@customElement('umb-examine-fields-settings-modal') -export default class UmbExamineFieldsSettingsModalElement extends UmbModalBaseElement< - UmbExamineFieldsSettingsModalData, - UmbExamineFieldsSettingsModalValue -> { - render() { - if (this.value.fields) { - return html` - - - - ${Object.values(this.value.fields).map((field, index) => { - return html` -
`; - })} - - -
- Close -
- - `; - } else { - return ''; - } - } - - static styles = [ - UmbTextStyles, - css` - :host { - display: relative; - } - - uui-dialog-layout { - display: flex; - flex-direction: column; - height: 100%; - background-color: var(--uui-color-surface); - box-shadow: var(--uui-shadow-depth-1, 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)); - border-radius: var(--uui-border-radius); - padding: var(--uui-size-space-5); - box-sizing: border-box; - } - - uui-scroll-container { - overflow-y: scroll; - max-height: 100%; - min-height: 0; - flex: 1; - } - - div { - margin-top: var(--uui-size-space-5); - display: flex; - flex-direction: row-reverse; - } - `, - ]; -} - -declare global { - interface HTMLElementTagNameMap { - 'umb-examine-fields-settings-modal': UmbExamineFieldsSettingsModalElement; - } -} diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts index 9d86f91654..429f2dd5f5 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-indexers.ts @@ -1,7 +1,7 @@ import type { UUIButtonState } from '@umbraco-cms/backoffice/external/uui'; import { css, html, nothing, customElement, property, state } from '@umbraco-cms/backoffice/external/lit'; import { umbConfirmModal } from '@umbraco-cms/backoffice/modal'; -import type { IndexResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; +import type { HealthStatusResponseModel, IndexResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; import { HealthStatusModel, IndexerService } from '@umbraco-cms/backoffice/external/backend-api'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources'; @@ -36,7 +36,7 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { this._indexData = data; // TODO: Add continuous polling to update the status - if (this._indexData?.healthStatus === HealthStatusModel.REBUILDING) { + if (this._indexData?.healthStatus.status === HealthStatusModel.REBUILDING) { this._buttonState = 'waiting'; } @@ -73,6 +73,20 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { await this._getIndexData(); } + #renderHealthStatus(healthStatus: HealthStatusResponseModel) { + const msg = healthStatus.message ? healthStatus.message : healthStatus.status; + switch (healthStatus.status) { + case HealthStatusModel.HEALTHY: + return html`${msg}`; + case HealthStatusModel.UNHEALTHY: + return html`${msg}`; + case HealthStatusModel.REBUILDING: + return html`${msg}`; + default: + return; + } + } + render() { if (!this._indexData || this._loading) return html` `; @@ -82,24 +96,14 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { Health Status
The health status of the ${this.indexName} and if it can be read

-
- - ${ - this._indexData.healthStatus === HealthStatusModel.UNHEALTHY - ? html`` - : html`` - } - - - ${this._indexData.healthStatus} -
+
${this.#renderHealthStatus(this._indexData.healthStatus)}
${this.renderIndexSearch()} ${this.renderPropertyList()} ${this.renderTools()} `; } private renderIndexSearch() { - if (!this._indexData || this._indexData.healthStatus !== HealthStatusModel.HEALTHY) return nothing; + if (!this._indexData || this._indexData.healthStatus.status !== HealthStatusModel.HEALTHY) return nothing; return html``; } @@ -147,6 +151,11 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { static styles = [ UmbTextStyles, css` + #health-status { + display: flex; + gap: var(--uui-size-6); + } + :host { display: block; } @@ -190,13 +199,6 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement { padding-right: var(--uui-size-space-5); } - .positive { - color: var(--uui-color-positive); - } - .danger { - color: var(--uui-color-danger); - } - button { background: none; border: none; diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts index c14200b221..a118f9afea 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-overview.ts @@ -40,6 +40,19 @@ export class UmbDashboardExamineOverviewElement extends UmbLitElement { this._loadingSearchers = false; } + #renderStatus(status: HealthStatusModel) { + switch (status) { + case HealthStatusModel.HEALTHY: + return html``; + case HealthStatusModel.UNHEALTHY: + return html``; + case HealthStatusModel.REBUILDING: + return html``; + default: + return; + } + } + render() { return html` @@ -66,16 +79,7 @@ export class UmbDashboardExamineOverviewElement extends UmbLitElement { ${this._indexers.map((index) => { return html` - - - ${ - index.healthStatus === HealthStatusModel.UNHEALTHY - ? html`` - : html`` - } - - - + ${this.#renderStatus(index.healthStatus.status)} ${index.name} diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts index a37110ec08..9f02b931ea 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts @@ -1,14 +1,16 @@ +import { UMB_EXAMINE_FIELDS_SETTINGS_MODAL, UMB_EXAMINE_FIELDS_VIEWER_MODAL } from '../modal/index.js'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { css, html, nothing, customElement, state, query, property } from '@umbraco-cms/backoffice/external/lit'; -import { UMB_MODAL_MANAGER_CONTEXT, UMB_EXAMINE_FIELDS_SETTINGS_MODAL } from '@umbraco-cms/backoffice/modal'; +import { + UMB_MODAL_MANAGER_CONTEXT, + UMB_WORKSPACE_MODAL, + UmbModalRouteRegistrationController, +} from '@umbraco-cms/backoffice/modal'; import type { SearchResultResponseModel, FieldPresentationModel } from '@umbraco-cms/backoffice/external/backend-api'; import { SearcherService } from '@umbraco-cms/backoffice/external/backend-api'; import { UmbLitElement, umbFocus } from '@umbraco-cms/backoffice/lit-element'; import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources'; -import './modal-views/fields-viewer.element.js'; -import './modal-views/fields-settings-modal.element.js'; - interface ExposedSearchResultField { name: string; exposed: boolean; @@ -36,10 +38,26 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement { alert('TODO: Open workspace for ' + this.searcherName); } + #entityType = ''; + + @state() + private _workspacePath = ''; + private _onKeyPress(e: KeyboardEvent) { e.key == 'Enter' ? this._onSearch() : undefined; } + constructor() { + super(); + new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL) + .onSetup(() => { + return { data: { entityType: this.#entityType, preset: {} } }; + }) + .observeRouteBuilder((routeBuilder) => { + this._workspacePath = routeBuilder({}); + }); + } + private async _onSearch() { if (!this._searchInput.value.length) return; this._searchLoading = true; @@ -86,20 +104,24 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement { const modalContext = modalManager.open(this, UMB_EXAMINE_FIELDS_SETTINGS_MODAL, { value: { fields: this._exposedFields ?? [] }, }); - modalContext?.onSubmit().then((value) => { - this._exposedFields = value.fields; - }); + await modalContext.onSubmit().catch(() => undefined); + + const value = modalContext.getValue(); + + this._exposedFields = value?.fields; } async #onFieldViewClick(rowData: SearchResultResponseModel) { const modalManager = await this.getContext(UMB_MODAL_MANAGER_CONTEXT); - modalManager.open(this, 'umb-modal-element-fields-viewer', { + + const modalContext = modalManager.open(this, UMB_EXAMINE_FIELDS_VIEWER_MODAL, { modal: { type: 'sidebar', size: 'medium', }, - data: { ...rowData, name: this.getSearchResultNodeName(rowData) }, + data: { searchResult: rowData, name: this.getSearchResultNodeName(rowData) }, }); + await modalContext.onSubmit().catch(() => undefined); } render() { @@ -128,6 +150,15 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement { return nodeNameField?.values?.join(', ') ?? ''; } + #getEntityTypeFromIndexType(indexType: string) { + switch (indexType) { + case 'content': + return 'document'; + default: + return indexType; + } + } + private renderSearchResults() { if (this._searchLoading) return html``; if (!this._searchResults) return nothing; @@ -145,11 +176,18 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement { ${this.renderHeadCells()} ${this._searchResults?.map((rowData) => { + const indexType = rowData.fields?.find((field) => field.name === '__IndexType')?.values?.join(', ') ?? ''; + this.#entityType = this.#getEntityTypeFromIndexType(indexType); + const unique = rowData.fields?.find((field) => field.name === '__Key')?.values?.join(', ') ?? ''; + return html` ${rowData.score} ${rowData.id} - + ${this.getSearchResultNodeName(rowData)} diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/search/manifests.ts index 74f7473793..e8b0df49f2 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/search/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/search/manifests.ts @@ -1,5 +1,8 @@ +import { manifests as examineManifests } from './examine-management-dashboard/manifests.js'; import type { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; +import './examine-management-dashboard/index.js'; + export const manifests: Array = [ { type: 'headerApp', @@ -37,10 +40,5 @@ export const manifests: Array = [ }, ], }, - { - type: 'modal', - alias: 'Umb.Modal.ExamineFieldsSettings', - name: 'Examine Field Settings Modal', - js: () => import('./examine-management-dashboard/views/modal-views/fields-settings-modal.element.js'), - }, + ...examineManifests, ];