-
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..d9bb5f3336 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';
@@ -25,35 +25,51 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement {
connectedCallback() {
super.connectedCallback();
- this._getIndexData();
+ this.#loadData();
}
- private async _getIndexData() {
+ async #loadData() {
+ this._indexData = await this.#getIndexData();
+
+ if (this._indexData?.healthStatus.status === HealthStatusModel.REBUILDING) {
+ this._buttonState = 'waiting';
+ this._continuousPolling();
+ } else {
+ this._loading = false;
+ }
+ }
+
+ async #getIndexData() {
const { data } = await tryExecuteAndNotify(
this,
IndexerService.getIndexerByIndexName({ indexName: this.indexName }),
);
- this._indexData = data;
+ return data;
+ }
- // TODO: Add continuous polling to update the status
- if (this._indexData?.healthStatus === HealthStatusModel.REBUILDING) {
- this._buttonState = 'waiting';
+ private async _continuousPolling() {
+ //Checking the server every 5 seconds to see if the index is still rebuilding.
+ while (this._buttonState === 'waiting') {
+ await new Promise((resolve) => setTimeout(resolve, 5000));
+ this._indexData = await this.#getIndexData();
+ if (this._indexData?.healthStatus.status !== HealthStatusModel.REBUILDING) {
+ this._buttonState = 'success';
+ }
}
-
- this._loading = false;
+ return;
}
private async _onRebuildHandler() {
await umbConfirmModal(this, {
- headline: `Rebuild ${this.indexName}`,
- content: html`
- This will cause the index to be rebuilt.
+ headline: `${this.localize.term('examineManagement_rebuildIndex')} ${this.indexName}`,
+ content: html`This will cause the index to be rebuilt.
Depending on how much content there is in your site this could take a while.
It is not recommended to rebuild an index during times of high website traffic or when editors are editing
- content.
- `,
+ content. `,
color: 'danger',
- confirmLabel: 'Rebuild',
+ confirmLabel: this.localize.term('examineManagement_rebuildIndex'),
});
this._rebuild();
@@ -68,9 +84,22 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement {
this._buttonState = 'failed';
return;
}
-
this._buttonState = 'success';
- await this._getIndexData();
+ await this.#loadData();
+ }
+
+ #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() {
@@ -79,43 +108,41 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement {
return html`
- Health Status
- The health status of the ${this.indexName} and if it can be read
+ 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;
+ // Do we want to show the search while rebuilding?
+ if (!this._indexData || this._indexData.healthStatus.status === HealthStatusModel.REBUILDING) return nothing;
return html``;
}
private renderPropertyList() {
if (!this._indexData) return nothing;
- return html`
- Lists the properties of the ${this.indexName}
+ return html`
+
+ Lists the properties of the ${this.indexName}
+
- documentCount
- ${this._indexData.documentCount}
+ DocumentCount
+ ${this._indexData.documentCount}
- fieldCount
- ${this._indexData.fieldCount}
+ FieldCount
+ ${this._indexData.fieldCount}
${this._indexData.providerProperties
? Object.entries(this._indexData.providerProperties).map((entry) => {
@@ -130,23 +157,26 @@ export class UmbDashboardExamineIndexElement extends UmbLitElement {
}
private renderTools() {
- return html`
- Tools to manage the ${this.indexName}
+ return html`
+ Tools to manage the ${this.indexName}
- Rebuild
-
+ label=${this.localize.term('examineManagement_rebuildIndex')}>
`;
}
static styles = [
UmbTextStyles,
css`
+ #health-status {
+ display: flex;
+ gap: var(--uui-size-6);
+ }
+
:host {
display: block;
}
@@ -190,13 +220,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..0adc0f2b11 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,19 +40,38 @@ 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`
-
+
- Manage Examine's indexes
- Allows you to view the details of each index and provides some tools for managing the indexes
+ Manage Examine's indexes
+ Allows you to view the details of each index and provides some tools for managing the indexes
${this.renderIndexersList()}
-
+
- Configured Searchers
- Shows properties and tools for any configured Searcher (i.e. such as a multi-index searcher)
+ Configured Searchers
+ Shows properties and tools for any configured Searcher (i.e. such as a multi-index searcher)
${this.renderSearchersList()}
@@ -66,16 +85,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..ab604b2ea6 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;
@@ -31,15 +33,27 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
@query('#search-input')
private _searchInput!: HTMLInputElement;
- private _onNameClick() {
- // TODO:
- alert('TODO: Open workspace for ' + this.searcherName);
- }
+ @state()
+ private _workspacePath = 'aa';
private _onKeyPress(e: KeyboardEvent) {
e.key == 'Enter' ? this._onSearch() : undefined;
}
+ #entityType = '';
+
+ constructor() {
+ super();
+ new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL)
+ .addAdditionalPath(':entityType')
+ .onSetup((routingInfo) => {
+ return { data: { entityType: routingInfo.entityType, preset: {} } };
+ })
+ .observeRouteBuilder((routeBuilder) => {
+ this._workspacePath = routeBuilder({ entityType: this.#entityType });
+ });
+ }
+
private async _onSearch() {
if (!this._searchInput.value.length) return;
this._searchLoading = true;
@@ -86,36 +100,48 @@ 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() {
return html`
-
- Search the ${this.searcherName} and view the results
+
+
+ Search the ${this.searcherName} and view the results
+
- Search
+
${this.renderSearchResults()}
@@ -128,28 +154,44 @@ 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;
if (!this._searchResults.length) {
- return html`No results found
`;
+ return html`${this.localize.term('examineManagement_noResults')}
`;
}
return html`
Score
- Id
- Name
- Fields
+ ${this.localize.term('general_id')}
+ ${this.localize.term('general_name')}
+ ${this.localize.term('examineManagement_fields')}
${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)}
@@ -157,9 +199,10 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
this.#onFieldViewClick(rowData)}>
- ${rowData.fields ? Object.keys(rowData.fields).length : ''} fields
+ ${rowData.fields ? Object.keys(rowData.fields).length : ''}
+ ${this.localize.term('examineManagement_fields')}
${rowData.fields ? this.renderBodyCells(rowData.fields) : ''}
@@ -185,7 +228,7 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
${field.name}
+ this.#removeEvent(item.alias)}>
`,
)}
`;
@@ -60,7 +60,7 @@ export class UmbInputWebhookEventsElement extends UmbLitElement {
render() {
return html`${this.#renderEvents()}
- `;
+ `;
}
static styles = [
@@ -73,7 +73,7 @@ export class UmbInputWebhookEventsElement extends UmbLitElement {
align-items: center;
}
- #add {
+ #choose {
grid-column: -1 / 1;
}
`,
diff --git a/src/Umbraco.Web.UI.Client/tsconfig.json b/src/Umbraco.Web.UI.Client/tsconfig.json
index 63d9866574..316fbbe6d5 100644
--- a/src/Umbraco.Web.UI.Client/tsconfig.json
+++ b/src/Umbraco.Web.UI.Client/tsconfig.json
@@ -1,5 +1,12 @@
-// Don't edit this file directly. It is generated by /devops/tsconfig/index.js
+/* -------------------------------------------------------------------------
+
+DON'T EDIT THIS FILE DIRECTLY. It is generated by /devops/tsconfig/index.js
+
+
+
+
+--------------------------------------------------------------------------- */
{
"compilerOptions": {
"module": "esnext",