@umbraco-cms/backoffice 16.3.4 → 17.0.0-rc1

package/dist-cms/packages/core/search/examine-management-dashboard/views/section-view-examine-searchers.js

@@ -0,0 +1,355 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UMB_EXAMINE_FIELDS_SETTINGS_MODAL, UMB_EXAMINE_FIELDS_VIEWER_MODAL } from '../modal/constants.js';
+import { UmbTextStyles } from '../../../style/index.js';
+import { css, html, nothing, customElement, state, query, property } from '../../../../../external/lit/index.js';
+import { umbOpenModal } from '../../../modal/index.js';
+import { UMB_WORKSPACE_MODAL } from '../../../workspace/index.js';
+import { UmbModalRouteRegistrationController } from '../../../router/index.js';
+import { SearcherService } from '../../../backend-api/index.js';
+import { UmbLitElement, umbFocus } from '../../../lit-element/index.js';
+import { tryExecute } from '../../../resources/index.js';
+import { UmbPaginationManager } from '../../../utils/index.js';
+let UmbDashboardExamineSearcherElement = class UmbDashboardExamineSearcherElement extends UmbLitElement {
+    #paginationManager;
+    _onKeyPress(e) {
+        if (e.key == 'Enter') {
+            this._onSearch();
+        }
+    }
+    #entityType;
+    constructor() {
+        super();
+        this._searchLoading = false;
+        this._workspacePath = 'aa';
+        this._totalPages = 1;
+        this._currentPage = 1;
+        this._totalNumberOfResults = 0;
+        this.#paginationManager = new UmbPaginationManager();
+        this.#entityType = '';
+        this.#paginationManager.setPageSize(100);
+        this.observe(this.#paginationManager.currentPage, (number) => (this._currentPage = number));
+        this.observe(this.#paginationManager.totalPages, (number) => (this._totalPages = number));
+        new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL)
+            .addAdditionalPath(':entityType')
+            .onSetup((routingInfo) => {
+            return { data: { entityType: routingInfo.entityType, preset: {} } };
+        })
+            .observeRouteBuilder((routeBuilder) => {
+            this._workspacePath = routeBuilder({ entityType: this.#entityType });
+        });
+    }
+    async _onSearch() {
+        if (!this._searchInput.value.length)
+            return;
+        this._searchLoading = true;
+        const { data } = await tryExecute(this, SearcherService.getSearcherBySearcherNameQuery({
+            path: { searcherName: this.searcherName },
+            query: {
+                term: this._searchInput.value,
+                take: this.#paginationManager.getPageSize(),
+                skip: this.#paginationManager.getSkip(),
+            },
+        }));
+        this._searchResults = data?.items ?? [];
+        this.#paginationManager.setTotalItems(data.total);
+        this._totalNumberOfResults = data.total;
+        this._updateFieldFilter();
+        this._searchLoading = false;
+    }
+    _updateFieldFilter() {
+        this._searchResults?.map((doc) => {
+            const document = doc.fields?.filter((field) => {
+                return field.name?.toUpperCase() !== 'NODENAME';
+            });
+            if (document) {
+                const newFieldNames = document.map((field) => {
+                    return field.name ?? '';
+                });
+                // TODO: I don't get this code, not sure what the purpose is, it seems like a mistake: [NL]
+                this._exposedFields = this._exposedFields
+                    ? this._exposedFields.filter((field) => {
+                        return { name: field.name, exposed: field.exposed };
+                    })
+                    : newFieldNames?.map((name) => {
+                        return { name, exposed: false };
+                    });
+            }
+        });
+    }
+    async #onFieldFilterClick() {
+        const value = await umbOpenModal(this, UMB_EXAMINE_FIELDS_SETTINGS_MODAL, {
+            value: { fields: this._exposedFields ?? [] },
+        }).catch(() => undefined);
+        this._exposedFields = value?.fields;
+    }
+    async #onFieldViewClick(rowData) {
+        await umbOpenModal(this, UMB_EXAMINE_FIELDS_VIEWER_MODAL, {
+            modal: {
+                type: 'sidebar',
+                size: 'medium',
+            },
+            data: { searchResult: rowData, name: this.#getSearchResultNodeName(rowData) },
+        }).catch(() => undefined);
+    }
+    render() {
+        return html `
+			<uui-box headline=${this.localize.term('general_search')}>
+				<p>
+					<umb-localize key="examineManagement_searchDescription"
+						>Search the ${this.searcherName} and view the results</umb-localize
+					>
+				</p>
+				<div class="flex">
+					<uui-input
+						type="search"
+						id="search-input"
+						placeholder=${this.localize.term('placeholders_filter')}
+						label=${this.localize.term('placeholders_filter')}
+						@keypress=${this._onKeyPress}
+						${umbFocus()}>
+					</uui-input>
+					<uui-button
+						color="positive"
+						look="primary"
+						label=${this.localize.term('general_search')}
+						@click="${this._onSearch}"></uui-button>
+				</div>
+				${this.#renderSearchResults()}
+			</uui-box>
+		`;
+    }
+    // Find the field named 'nodeName' and return its value if it exists in the fields array
+    #getSearchResultNodeName(searchResult) {
+        const nodeNameField = searchResult.fields?.find((field) => field.name?.toUpperCase() === 'NODENAME');
+        return nodeNameField?.values?.join(', ') ?? '';
+    }
+    #getEntityTypeFromIndexType(indexType) {
+        switch (indexType) {
+            case 'content':
+                return 'document';
+            default:
+                return indexType;
+        }
+    }
+    #onPageChange(event) {
+        this.#paginationManager.setCurrentPageNumber(event.target?.current);
+        this._onSearch();
+    }
+    #renderSearchResults() {
+        if (this._searchLoading)
+            return html `<uui-loader></uui-loader>`;
+        if (!this._searchResults)
+            return nothing;
+        if (!this._searchResults.length) {
+            return html `<p>${this.localize.term('examineManagement_noResults')}</p>`;
+        }
+        return html `
+			<div>
+				${this.localize.term('examineManagement_searchResultsFound', this.#paginationManager.getDisplayStart(), this.#paginationManager.getDisplayEnd(), this._totalNumberOfResults, this._currentPage, this._totalPages)}
+			</div>
+			<div class="table-container">
+				<uui-scroll-container>
+					<uui-table class="search">
+						<uui-table-head>
+							<uui-table-head-cell style="width:0">Score</uui-table-head-cell>
+							<uui-table-head-cell style="width:0">${this.localize.term('general_id')}</uui-table-head-cell>
+							<uui-table-head-cell>${this.localize.term('general_name')}</uui-table-head-cell>
+							<uui-table-head-cell>${this.localize.term('general_fields')}</uui-table-head-cell>
+							${this.renderHeadCells()}
+						</uui-table-head>
+						${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 `<uui-table-row>
+								<uui-table-cell> ${rowData.score} </uui-table-cell>
+								<uui-table-cell> ${rowData.id} </uui-table-cell>
+								<uui-table-cell>
+									<uui-button
+										look="secondary"
+										label=${this.localize.term('actions_editContent')}
+										href=${this._workspacePath + this.#entityType + '/edit/' + unique}>
+										${this.#getSearchResultNodeName(rowData)}
+									</uui-button>
+								</uui-table-cell>
+								<uui-table-cell>
+									<uui-button
+										class="bright"
+										look="secondary"
+										label=${this.localize.term('examineManagement_fieldValues')}
+										@click=${() => this.#onFieldViewClick(rowData)}>
+										${rowData.fields ? Object.keys(rowData.fields).length : ''}
+										${this.localize.term('examineManagement_fields')}
+									</uui-button>
+								</uui-table-cell>
+								${rowData.fields ? this.renderBodyCells(rowData.fields) : ''}
+							</uui-table-row>`;
+        })}
+					</uui-table>
+				</uui-scroll-container>
+				<button class="field-adder" @click="${this.#onFieldFilterClick}">
+					<uui-icon-registry-essential>
+						<uui-tag look="secondary">
+							<uui-icon name="add"></uui-icon>
+						</uui-tag>
+					</uui-icon-registry-essential>
+				</button>
+			</div>
+			<uui-pagination
+				.total=${this._totalPages}
+				.current=${this._currentPage}
+				firstlabel=${this.localize.term('general_first')}
+				previouslabel=${this.localize.term('general_previous')}
+				nextlabel=${this.localize.term('general_next')}
+				lastlabel=${this.localize.term('general_last')}
+				@change=${this.#onPageChange}></uui-pagination>
+		`;
+    }
+    renderHeadCells() {
+        return html `${this._exposedFields?.map((field) => {
+            return field.exposed
+                ? html `<uui-table-head-cell class="exposed-field">
+						<div class="exposed-field-container">
+							<span>${field.name}</span>
+							<uui-button
+								look="secondary"
+								label="${this.localize.term('actions_remove')} ${field.name}"
+								compact
+								@click="${() => {
+                    this._exposedFields = this._exposedFields?.map((f) => {
+                        return f.name === field.name ? { name: f.name, exposed: false } : f;
+                    });
+                }}"
+								>x</uui-button
+							>
+						</div>
+					</uui-table-head-cell>`
+                : html ``;
+        })}`;
+    }
+    renderBodyCells(cellData) {
+        return html `${this._exposedFields?.map((slot) => {
+            return cellData.map((field) => {
+                return slot.exposed && field.name == slot.name
+                    ? html `<uui-table-cell clip-text>${field.values}</uui-table-cell>`
+                    : html ``;
+            });
+        })}`;
+    }
+    static { this.styles = [
+        UmbTextStyles,
+        css `
+			:host {
+				display: block;
+			}
+
+			uui-box p {
+				margin-top: 0;
+			}
+
+			div.flex {
+				display: flex;
+			}
+			div.flex > uui-button {
+				padding-left: var(--uui-size-space-4);
+				height: 0;
+			}
+
+			uui-input {
+				width: 100%;
+				margin-bottom: var(--uui-size-space-5);
+			}
+
+			uui-table-head-cell {
+				text-transform: capitalize;
+			}
+
+			uui-table-row:last-child uui-table-cell {
+				padding-bottom: 0;
+			}
+
+			uui-table-cell {
+				min-width: 100px;
+			}
+
+			button.bright {
+				font-style: italic;
+				color: var(--uui-color-positive-emphasis);
+			}
+
+			.field-adder {
+				line-height: 0;
+				cursor: pointer;
+				vertical-align: top;
+				background: transparent;
+				border: none;
+			}
+
+			.table-container uui-scroll-container {
+				padding-bottom: var(--uui-size-space-4);
+				max-width: 100%;
+				overflow-x: scroll;
+				flex: 1;
+			}
+
+			.table-container {
+				display: flex;
+				align-items: flex-start;
+			}
+			uui-tag {
+				margin-block: var(--uui-size-5, 15px);
+			}
+
+			.exposed-field uui-button {
+				align-items: center;
+				font-weight: normal;
+				font-size: 10px;
+				height: 10px;
+				width: 10px;
+				margin-top: -5px;
+			}
+
+			.exposed-field-container {
+				display: flex;
+				justify-content: space-between;
+			}
+		`,
+    ]; }
+};
+__decorate([
+    property()
+], UmbDashboardExamineSearcherElement.prototype, "searcherName", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_searchResults", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_exposedFields", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_searchLoading", void 0);
+__decorate([
+    query('#search-input')
+], UmbDashboardExamineSearcherElement.prototype, "_searchInput", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_workspacePath", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_totalPages", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_currentPage", void 0);
+__decorate([
+    state()
+], UmbDashboardExamineSearcherElement.prototype, "_totalNumberOfResults", void 0);
+UmbDashboardExamineSearcherElement = __decorate([
+    customElement('umb-dashboard-examine-searcher')
+], UmbDashboardExamineSearcherElement);
+export { UmbDashboardExamineSearcherElement };
+export default UmbDashboardExamineSearcherElement;

package/dist-cms/packages/core/search/extensions/search-provider.extension.d.ts

@@ -0,0 +1,20 @@
+import type { UmbSearchProvider, UmbSearchResultItemModel } from '../types.js';
+import type { ManifestApi } from '../../../../libs/extension-api/index.js';
+/**
+ * Represents an search provider that can be used to search.
+ */
+export interface ManifestSearchProvider extends ManifestApi<UmbSearchProvider<UmbSearchResultItemModel>> {
+    type: 'searchProvider';
+    meta?: MetaSearchProvider;
+}
+export interface MetaSearchProvider {
+    /**
+     * The label of the provider that is shown to the user.
+     */
+    label?: string;
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbSearchProvider: ManifestSearchProvider;
+    }
+}

package/dist-cms/packages/core/search/extensions/search-provider.extension.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/extensions/search-result-item.extension.d.ts

@@ -0,0 +1,13 @@
+import type { ManifestElement } from '../../../../libs/extension-api/index.js';
+/**
+ * Represents a search result element.
+ */
+export interface ManifestSearchResultItem extends ManifestElement {
+    type: 'searchResultItem';
+    forEntityTypes: Array<string>;
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbSearchResultItem: ManifestSearchResultItem;
+    }
+}

package/dist-cms/packages/core/search/extensions/search-result-item.extension.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/extensions/types.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/global-search/global-search-base.d.ts

@@ -0,0 +1,11 @@
+import type { ManifestGlobalSearch, UmbGlobalSearchApi, UmbSearchProvider, UmbSearchRequestArgs } from '../types.js';
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+export declare abstract class UmbGlobalSearchBase<SearchProviderType extends UmbSearchProvider = UmbSearchProvider> extends UmbControllerBase implements UmbGlobalSearchApi {
+    #private;
+    protected _manifest?: ManifestGlobalSearch;
+    protected _searchProvider?: SearchProviderType;
+    protected _init: Promise<void>;
+    set manifest(manifest: ManifestGlobalSearch | undefined);
+    get manifest(): ManifestGlobalSearch | undefined;
+    search(args: UmbSearchRequestArgs): Promise<import("../../repository/types.js").UmbRepositoryResponse<import("../../repository/types.js").UmbPagedModel<import("../types.js").UmbSearchResultItemModel>>>;
+}

package/dist-cms/packages/core/search/global-search/global-search-base.js

@@ -0,0 +1,49 @@
+import { UmbExtensionApiInitializer } from '../../../../libs/extension-api/index.js';
+import { umbExtensionsRegistry } from '../../extension-registry/index.js';
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+export class UmbGlobalSearchBase extends UmbControllerBase {
+    constructor() {
+        super(...arguments);
+        this.#initialized = false;
+        this._init = new Promise((resolve) => {
+            if (this.#initialized) {
+                resolve();
+            }
+            else {
+                this.#initResolver = resolve;
+            }
+        });
+    }
+    #initResolver;
+    #initialized;
+    #checkIfInitialized() {
+        if (this._searchProvider) {
+            this.#initialized = true;
+            this.#initResolver?.();
+        }
+    }
+    set manifest(manifest) {
+        if (this._manifest === manifest)
+            return;
+        this._manifest = manifest;
+        this.#observeSearchProvider(this._manifest?.meta.searchProviderAlias);
+    }
+    get manifest() {
+        return this._manifest;
+    }
+    #observeSearchProvider(alias) {
+        if (!alias)
+            throw new Error('Search provider alias is required');
+        new UmbExtensionApiInitializer(this, umbExtensionsRegistry, alias, [this], (permitted, ctrl) => {
+            this._searchProvider = permitted ? ctrl.api : undefined;
+            this.#checkIfInitialized();
+        });
+    }
+    async search(args) {
+        await this._init;
+        if (!this._searchProvider) {
+            throw new Error('Search provider is not available');
+        }
+        return await this._searchProvider.search({ query: args.query });
+    }
+}

package/dist-cms/packages/core/search/global-search/global-search.extension.d.ts

@@ -0,0 +1,15 @@
+import type { UmbGlobalSearchApi } from './types.js';
+import type { ManifestWithDynamicConditions, ManifestApi } from '../../../../libs/extension-api/index.js';
+export interface ManifestGlobalSearch extends ManifestApi<UmbGlobalSearchApi>, ManifestWithDynamicConditions<UmbExtensionConditionConfig> {
+    type: 'globalSearch';
+    meta: MetaGlobalSearch;
+}
+export interface MetaGlobalSearch {
+    label: string;
+    searchProviderAlias: string;
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbGlobalSearch: ManifestGlobalSearch;
+    }
+}

package/dist-cms/packages/core/search/global-search/global-search.extension.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/global-search/types.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/manifests.d.ts

@@ -0,0 +1 @@
+export declare const manifests: Array<UmbExtensionManifest>;

package/dist-cms/packages/core/search/manifests.js

@@ -0,0 +1,43 @@
+import { manifests as examineManifests } from './examine-management-dashboard/manifests.js';
+import { UMB_SECTION_ALIAS_CONDITION_ALIAS } from '../section/index.js';
+export const manifests = [
+    {
+        type: 'headerApp',
+        alias: 'Umb.HeaderApp.Search',
+        name: 'Header App Search',
+        element: () => import('./umb-search-header-app.element.js'),
+        weight: 900,
+        meta: {
+            label: 'Search',
+            icon: 'search',
+            pathname: 'search',
+        },
+    },
+    {
+        type: 'modal',
+        alias: 'Umb.Modal.Search',
+        name: 'Search Modal',
+        element: () => import('./search-modal/search-modal.element.js'),
+    },
+    {
+        type: 'dashboard',
+        alias: 'Umb.Dashboard.ExamineManagement',
+        name: 'Examine Management Dashboard',
+        element: () => import('./examine-management-dashboard/dashboard-examine-management.element.js'),
+        weight: 400,
+        meta: {
+            label: '#dashboardTabs_settingsExamine',
+            pathname: 'examine-management',
+        },
+        conditions: [
+            {
+                alias: UMB_SECTION_ALIAS_CONDITION_ALIAS,
+                /* TODO: kept as a magic string to avoid illegal import outside of core
+                    Move dashboard implementation out of core
+                */
+                match: 'Umb.Section.Settings',
+            },
+        ],
+    },
+    ...examineManifests,
+];

package/dist-cms/packages/core/search/search-data-source.interface.d.ts

@@ -0,0 +1,9 @@
+import type { UmbSearchRequestArgs, UmbSearchResultItemModel } from './types.js';
+import type { UmbControllerHost } from '../../../libs/controller-api/index.js';
+import type { UmbDataSourceResponse, UmbPagedModel } from '../repository/index.js';
+export interface UmbSearchDataSourceConstructor<SearchResultItemType extends UmbSearchResultItemModel> {
+    new (host: UmbControllerHost): UmbSearchDataSource<SearchResultItemType>;
+}
+export interface UmbSearchDataSource<SearchResultItemType extends UmbSearchResultItemModel, RequestArgsType extends UmbSearchRequestArgs = UmbSearchRequestArgs> {
+    search(args: RequestArgsType): Promise<UmbDataSourceResponse<UmbPagedModel<SearchResultItemType>>>;
+}

package/dist-cms/packages/core/search/search-data-source.interface.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/search/search-modal/search-modal.element.d.ts

@@ -0,0 +1,25 @@
+import { UmbLitElement } from '../../lit-element/index.js';
+import type { UmbModalContext } from '../../modal/index.js';
+import '../search-result/search-result-item.element.js';
+export declare class UmbSearchModalElement extends UmbLitElement {
+    #private;
+    private _inputFakeCursor;
+    private _input;
+    modalContext?: UmbModalContext;
+    private _search;
+    private _searchResults;
+    private _globalSearchers;
+    private _currentGlobalSearcher?;
+    private _loading;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+export default UmbSearchModalElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-search-modal': UmbSearchModalElement;
+    }
+}