@dxos/plugin-search 0.8.4-main.bc674ce → 0.8.4-main.bcb3aa67d6

package/src/capabilities/operation-resolver/operation-resolver.ts

@@ -1,23 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Effect from 'effect/Effect';
-
-import { Capability, Common } from '@dxos/app-framework';
-import { Operation, OperationResolver } from '@dxos/operation';
-
-import { SearchOperation } from '../../types';
-
-export default Capability.makeModule(
-  Effect.fnUntraced(function* () {
-    return Capability.contributes(Common.Capability.OperationResolver, [
-      OperationResolver.make({
-        operation: SearchOperation.OpenSearch,
-        handler: Effect.fnUntraced(function* () {
-          yield* Operation.invoke(Common.LayoutOperation.UpdateComplementary, { subject: 'search' });
-        }),
-      }),
-    ]);
-  }),
-);

package/src/capabilities/react-surface/index.ts

@@ -1,7 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Capability } from '@dxos/app-framework';
-
-export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));

package/src/capabilities/react-surface/react-surface.tsx

@@ -1,70 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Effect from 'effect/Effect';
-import React from 'react';
-
-import { Capability, Common } from '@dxos/app-framework';
-import { useActiveSpace } from '@dxos/plugin-space';
-import { type Space, SpaceState, isSpace } from '@dxos/react-client/echo';
-
-import { SEARCH_DIALOG, SearchDialog, type SearchDialogProps, SearchMain, SpaceMain } from '../../components';
-import { SearchContextProvider } from '../../hooks';
-import { meta } from '../../meta';
-
-export default Capability.makeModule(() =>
-  Effect.succeed(
-    Capability.contributes(Common.Capability.ReactSurface, [
-      Common.createSurface({
-        id: SEARCH_DIALOG,
-        role: 'dialog',
-        filter: (data): data is { props: SearchDialogProps } => data.component === SEARCH_DIALOG,
-        component: ({ data }) => (
-          <SearchContextProvider>
-            <SearchDialog {...data.props} />
-          </SearchContextProvider>
-        ),
-      }),
-      Common.createSurface({
-        id: `${SEARCH_DIALOG}/search-input`,
-        role: 'search-input',
-        component: () => {
-          const space = useActiveSpace();
-
-          return (
-            <SearchContextProvider>
-              <SearchMain space={space} />
-            </SearchContextProvider>
-          );
-        },
-      }),
-      Common.createSurface({
-        id: `${SEARCH_DIALOG}/search`,
-        role: 'deck-companion--search',
-        filter: (data): data is { subject: Space } => isSpace(data.subject),
-        component: ({ data }) => {
-          const space = data.subject;
-          if (!space) {
-            return null;
-          }
-
-          return (
-            <SearchContextProvider>
-              <SearchMain space={space} />
-            </SearchContextProvider>
-          );
-        },
-      }),
-      Common.createSurface({
-        id: `${meta.id}/space-article`,
-        role: 'article',
-        position: 'hoist',
-        filter: (data): data is { subject: Space } =>
-          // TODO(wittjosiah): Need to avoid shotgun parsing space state everywhere.
-          isSpace(data.subject) && data.subject.state.get() === SpaceState.SPACE_READY,
-        component: ({ data }) => <SpaceMain space={data.subject} />,
-      }),
-    ]),
-  ),
-);

package/src/components/SearchDialog.tsx

@@ -1,130 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import * as Option from 'effect/Option';
-import React, { forwardRef, useCallback, useState } from 'react';
-
-import { Common } from '@dxos/app-framework';
-import { useAppGraph, useLayout, useOperationInvoker } from '@dxos/app-framework/react';
-import { Obj } from '@dxos/echo';
-import { Graph, type Node } from '@dxos/plugin-graph';
-import { useClient } from '@dxos/react-client';
-import { Filter, useQuery } from '@dxos/react-client/echo';
-import { Button, Dialog, toLocalizedString, useTranslation } from '@dxos/react-ui';
-import { SearchList } from '@dxos/react-ui-searchlist';
-import { descriptionText, mx, osTranslations } from '@dxos/ui-theme';
-
-import { useSearchResults } from '../hooks';
-import { meta } from '../meta';
-
-export const SEARCH_DIALOG = `${meta.id}/SearchDialog`;
-
-type SearchListResultProps = {
-  node: Node.Node;
-  onSelect?: (nodeId: string) => void;
-};
-
-const SearchListResult = forwardRef<HTMLDivElement, SearchListResultProps>(({ node, onSelect }, forwardedRef) => {
-  const { t } = useTranslation(meta.id);
-  const label = toLocalizedString(node?.properties.label ?? 'never', t);
-  const handleSelect = useCallback(() => {
-    onSelect?.(node!.id);
-  }, [node, onSelect]);
-  return (
-    <SearchList.Item
-      value={node!.id}
-      label={label}
-      icon={node?.properties.icon}
-      classNames='flex gap-2 items-center pli-2'
-      onSelect={handleSelect}
-      ref={forwardedRef}
-    />
-  );
-});
-
-export type SearchDialogProps = {
-  pivotId: string;
-};
-
-export const SearchDialog = ({ pivotId }: SearchDialogProps) => {
-  const { t } = useTranslation(meta.id);
-  const { graph } = useAppGraph();
-  const layout = useLayout();
-  const closed = (Array.isArray(layout.inactive) ? layout.inactive : [layout.inactive])
-    .map((id) => (graph ? Graph.getNode(graph, id) : Option.none()))
-    .filter(Boolean);
-  const [queryString, setQueryString] = useState('');
-  const client = useClient();
-  const dangerouslyLoadAllObjects = useQuery(client.spaces, Filter.everything());
-  const [pending, results] = useSearchResults(queryString, dangerouslyLoadAllObjects);
-  const resultObjects = Array.from(results.keys());
-  const { invokePromise } = useOperationInvoker();
-
-  const handleSelect = useCallback(
-    async (nodeId: string) => {
-      await invokePromise(Common.LayoutOperation.UpdateDialog, { state: false });
-
-      // If node is already present in the active parts, scroll to it and close the dialog.
-      const index = layout.active.findIndex((id) => id === nodeId);
-      if (index !== -1) {
-        await invokePromise(Common.LayoutOperation.ScrollIntoView, { subject: nodeId });
-      } else {
-        await invokePromise(Common.LayoutOperation.Open, {
-          subject: [nodeId],
-          pivotId,
-          positioning: 'end',
-        });
-      }
-    },
-    [pivotId, invokePromise, layout],
-  );
-
-  const handleSearch = useCallback((query: string) => {
-    setQueryString(query);
-  }, []);
-
-  return (
-    <Dialog.Content>
-      <Dialog.Title>{t('search dialog title')}</Dialog.Title>
-      <SearchList.Root onSearch={handleSearch}>
-        <div
-          role='combobox'
-          aria-expanded='true'
-          aria-label={t('search placeholder')}
-          className='flex flex-col grow overflow-hidden'
-        >
-          <SearchList.Input placeholder={t('search placeholder')} />
-          <SearchList.Content classNames='max-bs-[24rem] overflow-auto'>
-            <SearchList.Viewport>
-              {queryString.length > 0 ? (
-                resultObjects.length > 0 ? (
-                  resultObjects
-                    .map((object) => Graph.getNode(graph, Obj.getDXN(object).toString()))
-                    .filter(Option.isSome)
-                    .map((node) => <SearchListResult key={node.value.id} node={node.value} onSelect={handleSelect} />)
-                ) : (
-                  <p className='pli-1'>{t(pending ? 'pending results message' : 'empty results message')}</p>
-                )
-              ) : (
-                <>
-                  {closed.length > 0 && (
-                    <h2 className={mx('mlb-1', descriptionText)}>{t('recently closed heading')}</h2>
-                  )}
-                  {closed.filter(Option.isSome).map((node) => (
-                    <SearchListResult key={node.value.id} node={node.value} onSelect={handleSelect} />
-                  ))}
-                </>
-              )}
-            </SearchList.Viewport>
-          </SearchList.Content>
-        </div>
-      </SearchList.Root>
-      <Dialog.Close asChild>
-        <Button variant='primary' classNames='mbs-2'>
-          {t('close label', { ns: osTranslations })}
-        </Button>
-      </Dialog.Close>
-    </Dialog.Content>
-  );
-};

package/src/components/SearchMain.stories.tsx

@@ -1,90 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { type Decorator, type Meta, type StoryObj } from '@storybook/react-vite';
-import * as Effect from 'effect/Effect';
-import React from 'react';
-
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { Obj } from '@dxos/echo';
-import { TestSchema } from '@dxos/echo/testing';
-import { ClientPlugin } from '@dxos/plugin-client';
-import { PreviewPlugin } from '@dxos/plugin-preview';
-import { corePlugins } from '@dxos/plugin-testing';
-import { faker } from '@dxos/random';
-import { useSpaces } from '@dxos/react-client/echo';
-import { withLayout, withTheme } from '@dxos/react-ui/testing';
-import { withMosaic } from '@dxos/react-ui-mosaic/testing';
-
-import { SearchContextProvider } from '../hooks';
-import { translations } from '../translations';
-
-import { SearchMain } from './SearchMain';
-
-faker.seed(1234);
-
-const withSearchContext = (): Decorator => {
-  return (Story) => (
-    <SearchContextProvider>
-      <Story />
-    </SearchContextProvider>
-  );
-};
-
-const DefaultStory = () => {
-  const spaces = useSpaces();
-  const space = spaces[spaces.length - 1];
-  return <SearchMain space={space} />;
-};
-
-const meta = {
-  title: 'plugins/plugin-search/SearchMain',
-  component: SearchMain,
-  render: DefaultStory,
-  decorators: [
-    withTheme,
-    withLayout({ layout: 'column' }),
-    withMosaic(),
-    withSearchContext(),
-    withPluginManager({
-      plugins: [
-        ...corePlugins(),
-        ClientPlugin({
-          types: [TestSchema.Task, TestSchema.Organization, TestSchema.Person],
-          onClientInitialized: ({ client }) =>
-            Effect.gen(function* () {
-              yield* Effect.promise(() => client.halo.createIdentity());
-              yield* Effect.promise(() => client.spaces.waitUntilReady());
-              const space = yield* Effect.promise(() => client.spaces.create({ name: 'Test Space' }));
-              yield* Effect.promise(() => space.waitUntilReady());
-              // Create some test data to search.
-              space.db.add(
-                Obj.make(TestSchema.Task, { title: 'Project Proposal', description: 'A proposal for a new project' }),
-              );
-              space.db.add(
-                Obj.make(TestSchema.Task, { title: 'Meeting Notes', description: 'Notes from the team meeting' }),
-              );
-              space.db.add(
-                Obj.make(TestSchema.Task, { title: 'Budget Report', description: 'Q3 financial budget report' }),
-              );
-              space.db.add(Obj.make(TestSchema.Person, { name: 'Alice Smith', email: 'alice@example.com' }));
-              space.db.add(Obj.make(TestSchema.Person, { name: 'Bob Jones', email: 'bob@example.com' }));
-              space.db.add(Obj.make(TestSchema.Organization, { name: 'Composer Project' }));
-            }),
-        }),
-        PreviewPlugin(),
-      ],
-    }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-    translations,
-  },
-} satisfies Meta<typeof SearchMain>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/components/SearchMain.tsx

@@ -1,83 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { useCallback, useMemo, useState } from 'react';
-
-import { Surface } from '@dxos/app-framework/react';
-import { Entity, Query } from '@dxos/echo';
-import { Filter, type Space, useQuery } from '@dxos/react-client/echo';
-import { Toolbar, useTranslation } from '@dxos/react-ui';
-import { Card, Mosaic, type StackTileComponent } from '@dxos/react-ui-mosaic';
-import { Layout } from '@dxos/react-ui-mosaic';
-import { SearchList } from '@dxos/react-ui-searchlist';
-import { Text } from '@dxos/schema';
-
-import { useGlobalSearch, useGlobalSearchResults, useWebSearch } from '../hooks';
-import { meta } from '../meta';
-import { type SearchResult } from '../types';
-
-export const SearchMain = ({ space }: { space?: Space }) => {
-  const { t } = useTranslation(meta.id);
-  const { setMatch } = useGlobalSearch();
-  const [query, setQuery] = useState<string>();
-  // TODO(burdon): Option to search across spaces.
-  const objects = useQuery(
-    space?.db,
-    query === undefined
-      ? Query.select(Filter.nothing())
-      : // TODO(dmaretskyi): Final version would walk the ancestry of the object until we find a non-system type.
-        Query.all(
-          Query.select(Filter.text(query, { type: 'full-text' })).select(Filter.not(Filter.type(Text.Text))),
-          Query.select(Filter.text(query, { type: 'full-text' }))
-            .select(Filter.type(Text.Text))
-            .referencedBy('dxos.org/type/Document', 'content'),
-        ),
-  );
-
-  const results = useGlobalSearchResults(objects);
-  const { results: webResults } = useWebSearch({ query });
-  const allResults = useMemo(
-    () => [...results, ...webResults].filter(({ object }) => object && Entity.getLabel(object)),
-    [results, webResults],
-  );
-
-  const handleSearch = useCallback(
-    (text: string) => {
-      setQuery(text);
-      setMatch?.(text);
-    },
-    [setMatch],
-  );
-
-  return (
-    <Layout.Main toolbar>
-      <SearchList.Root onSearch={handleSearch}>
-        <Toolbar.Root>
-          <SearchList.Input placeholder={t('search placeholder')} />
-        </Toolbar.Root>
-        <SearchList.Content>
-          <Mosaic.Container asChild>
-            <Mosaic.Viewport>
-              <Mosaic.Stack items={allResults} getId={(result) => result.object!.id} Tile={SearchResultTile} />
-            </Mosaic.Viewport>
-          </Mosaic.Container>
-          {allResults.length === 0 && <SearchList.Empty>{t('empty results message')}</SearchList.Empty>}
-        </SearchList.Content>
-      </SearchList.Root>
-    </Layout.Main>
-  );
-};
-
-const SearchResultTile: StackTileComponent<SearchResult> = ({ data }) => {
-  return (
-    <Card.Root key={data.id}>
-      <Card.Toolbar>
-        <Card.DragHandle />
-        <Card.Title>{data.label ?? (data.object && Entity.getLabel(data.object))}</Card.Title>
-        <Card.Menu />
-      </Card.Toolbar>
-      <Surface role='card--content' data={{ subject: data.object }} limit={1} />
-    </Card.Root>
-  );
-};

package/src/components/SpaceMain.tsx

@@ -1,169 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-
-import { Common } from '@dxos/app-framework';
-import { useAppGraph, useCapabilities, useOperationInvoker } from '@dxos/app-framework/react';
-import { Filter, Obj, Query } from '@dxos/echo';
-import { Graph, Node, useActionRunner, useConnections } from '@dxos/plugin-graph';
-import { type Space, useQuery } from '@dxos/react-client/echo';
-import { Toolbar, toLocalizedString, useTranslation } from '@dxos/react-ui';
-import { Card, Mosaic, type StackTileComponent } from '@dxos/react-ui-mosaic';
-import { Layout } from '@dxos/react-ui-mosaic';
-import { SearchList } from '@dxos/react-ui-searchlist';
-import { Text } from '@dxos/schema';
-import { getStyles } from '@dxos/ui-theme';
-
-import { meta } from '../meta';
-
-/**
- *
- */
-export const SpaceMain = ({ space }: { space: Space }) => {
-  const { t } = useTranslation(meta.id);
-  const { items, handleSearch } = useSpaceItems(space);
-
-  return (
-    <Layout.Main toolbar>
-      <SearchList.Root onSearch={handleSearch}>
-        <Toolbar.Root>
-          <SearchList.Input placeholder={t('search placeholder')} />
-        </Toolbar.Root>
-        <SearchList.Content>
-          <Mosaic.Container asChild>
-            <Mosaic.Viewport padding>
-              <Mosaic.Stack items={items} getId={(node) => node.id} Tile={NodeTile} />
-            </Mosaic.Viewport>
-          </Mosaic.Container>
-        </SearchList.Content>
-      </SearchList.Root>
-    </Layout.Main>
-  );
-};
-
-const NodeTile: StackTileComponent<Node.Node> = ({ data: node }) => {
-  const { t } = useTranslation(meta.id);
-  const { graph } = useAppGraph();
-  const { invokeSync } = useOperationInvoker();
-  const runAction = useActionRunner();
-
-  const label = toLocalizedString(node.properties.label, t);
-  const icon = node.properties.icon ?? 'ph--placeholder--regular';
-  const iconHue = node.properties.iconHue;
-  const styles = iconHue ? getStyles(iconHue) : undefined;
-
-  const handleClick = () => {
-    if (Node.isAction(node)) {
-      // Run action if this is an action node.
-      const [parent] = Graph.getConnections(graph, node.id, 'inbound');
-      if (parent) {
-        void runAction(node, { parent });
-      }
-    } else {
-      // Navigate to the node.
-      invokeSync(Common.LayoutOperation.Open, { subject: [node.id] });
-    }
-  };
-
-  return (
-    <Card.Root fullWidth>
-      <Card.Toolbar>
-        <Card.ToolbarIconButton variant='ghost' label={label} icon={icon} iconOnly iconClassNames={styles?.icon} />
-        <Card.Title onClick={handleClick}>{label}</Card.Title>
-        <Card.Menu />
-      </Card.Toolbar>
-    </Card.Root>
-  );
-};
-
-/**
- * Hook to resolve metadata (icon, iconHue, etc.) for objects based on their typename.
- */
-// TODO(wittjosiah): Factor out.
-const useMetadataResolver = () => {
-  const allMetadata = useCapabilities(Common.Capability.Metadata);
-  return useCallback((typename: string) => allMetadata.find((m) => m.id === typename)?.metadata ?? {}, [allMetadata]);
-};
-
-/**
- * Hook to get space items with search/filter support.
- * Returns direct children when no query, or full-text search results when searching.
- */
-const useSpaceItems = (space: Space) => {
-  const { graph } = useAppGraph();
-  const [query, setQuery] = useState<string>();
-  const resolveMetadata = useMetadataResolver();
-
-  // Expand the space node to load its children (needed when navigating directly to a space URL).
-  useEffect(() => {
-    const frame = requestAnimationFrame(() => {
-      Graph.expand(graph, space.id, 'outbound');
-    });
-    return () => cancelAnimationFrame(frame);
-  }, [graph, space.id]);
-
-  // Get direct children of the space node for the default view.
-  const children = useConnections(graph, space.id, 'outbound');
-
-  const handleSearch = useCallback((text: string) => {
-    setQuery(text);
-  }, []);
-
-  // TODO(dmaretskyi): Switch back to QueryEditor once query builder is ready for production.
-  // Query results using full-text search.
-  const results = useQuery(
-    space.db,
-    query === undefined
-      ? Query.select(Filter.nothing())
-      : Query.all(
-          Query.select(Filter.text(query, { type: 'full-text' })).select(Filter.not(Filter.type(Text.Text))),
-          Query.select(Filter.text(query, { type: 'full-text' }))
-            .select(Filter.type(Text.Text))
-            .referencedBy('dxos.org/type/Document', 'content'),
-        ),
-  );
-
-  // Determine if query is empty (show default view).
-  const isQueryEmpty = !query?.trim();
-
-  // Filter children to those which are objects or actions with disposition 'item'.
-  const filteredChildren = useMemo(
-    () =>
-      children.filter((node) => {
-        // Include regular objects.
-        if (Obj.isObject(node.data)) {
-          return true;
-        }
-        // Include actions with disposition 'item'.
-        return Node.isAction(node) && node.properties.disposition === 'item';
-      }),
-    [children],
-  );
-
-  // When showing default view, use nodes (which may include actions).
-  // When showing search results, wrap objects in a compatible shape with resolved metadata.
-  const items = useMemo(() => {
-    if (isQueryEmpty) {
-      return filteredChildren;
-    }
-    // Wrap query results as pseudo-nodes for consistent rendering.
-    return results.map((obj) => {
-      const typename = Obj.getTypename(obj);
-      const metadata = typename ? resolveMetadata(typename) : {};
-      return {
-        id: obj.id,
-        type: 'search-result',
-        data: obj,
-        properties: {
-          label: Obj.getLabel(obj) ?? obj.id,
-          icon: metadata.icon ?? 'ph--placeholder--regular',
-          iconHue: metadata.iconHue,
-        },
-      } as Node.Node;
-    });
-  }, [isQueryEmpty, filteredChildren, results, resolveMetadata]);
-
-  return { items, handleSearch };
-};

package/src/types/action.tsx

@@ -1,18 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import * as Schema from 'effect/Schema';
-
-import { Operation } from '@dxos/operation';
-
-import { meta } from '../meta';
-
-const SEARCH_OPERATION = `${meta.id}/operation`;
-
-export namespace SearchOperation {
-  export const OpenSearch = Operation.make({
-    meta: { key: `${SEARCH_OPERATION}/open-search`, name: 'Open Search' },
-    schema: { input: Schema.Void, output: Schema.Void },
-  });
-}