umbraco-search-provider

import type { ManifestSearchProvider } from '@umbraco-cms/backoffice/extension-registry';
 
const manifest: ManifestSearchProvider = {
  type: 'searchProvider',
  alias: 'My.SearchProvider',
  name: 'My Search Provider',
  api: () => import('./my-search-provider.js'),
  meta: {
    label: 'My Items',
  },
};
 
export const manifests = [manifest];

import type { UmbSearchProvider, UmbSearchResultItemModel, UmbSearchRequestArgs } from '@umbraco-cms/backoffice/search';
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api';
 
export class MySearchProvider extends UmbControllerBase implements UmbSearchProvider {
  constructor(host: UmbControllerHost) {
    super(host);
  }
 
  async search(args: UmbSearchRequestArgs) {
    const { query } = args;
 
    // Fetch results from your data source
    const results = await this.#fetchResults(query);
 
    return {
      data: {
        items: results,
        total: results.length,
      },
    };
  }
 
  async #fetchResults(query: string): Promise<UmbSearchResultItemModel[]> {
    // Your search logic here - API call, local filtering, etc.
    const response = await fetch(`/api/my-items/search?q=${encodeURIComponent(query)}`);
    const data = await response.json();
 
    return data.items.map((item: any) => ({
      entityType: 'my-entity',
      unique: item.id,
      name: item.name,
      icon: 'icon-document',
      href: `/section/my-section/workspace/my-workspace/edit/${item.id}`,
    }));
  }
}
 
export default MySearchProvider;

// Each result must conform to UmbSearchResultItemModel
interface UmbSearchResultItemModel {
  entityType: string;    // Entity type identifier
  unique: string;        // Unique ID
  name: string;          // Display name
  icon?: string | null;  // Icon to display
  href: string;          // URL to navigate when clicked
}

import type { UmbSearchProvider, UmbSearchResultItemModel, UmbSearchRequestArgs } from '@umbraco-cms/backoffice/search';
import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api';
import { MyRepository } from './my-repository.js';
 
export class MySearchProvider extends UmbControllerBase implements UmbSearchProvider {
  #repository: MyRepository;
 
  constructor(host: UmbControllerHost) {
    super(host);
    this.#repository = new MyRepository(this);
  }
 
  async search(args: UmbSearchRequestArgs) {
    const { data } = await this.#repository.search(args.query);
 
    const items: UmbSearchResultItemModel[] = data?.items.map((item) => ({
      entityType: 'my-entity',
      unique: item.id,
      name: item.name,
      icon: item.icon ?? 'icon-document',
      href: `/section/my-section/workspace/my-workspace/edit/${item.id}`,
    })) ?? [];
 
    return {
      data: {
        items,
        total: data?.total ?? 0,
      },
    };
  }
}
 
export default MySearchProvider;

async search(args: UmbSearchRequestArgs) {
  const { query, searchFrom } = args;
 
  // searchFrom contains the entity to search from (if specified)
  const parentId = searchFrom?.unique;
 
  const results = await this.#fetchResults(query, parentId);
 
  return {
    data: {
      items: results,
      total: results.length,
    },
  };
}