@dxos/plugin-space 0.8.4-main.67995b8 → 0.8.4-main.70d3990

package/src/components/ViewEditor.tsx

@@ -2,42 +2,73 @@
 // Copyright 2023 DXOS.org
 //
 
-import React, { useCallback, useMemo } from 'react';
+import * as Schema from 'effect/Schema';
+import React, { useCallback, useState } from 'react';
 
-import { createIntent, useIntentDispatcher } from '@dxos/app-framework';
-import { Type } from '@dxos/echo';
-import { invariant } from '@dxos/invariant';
+import { createIntent } from '@dxos/app-framework';
+import { useIntentDispatcher } from '@dxos/app-framework/react';
+import { DXN, Filter, Obj, Query, type QueryAST, Tag, Type } from '@dxos/echo';
 import { useClient } from '@dxos/react-client';
-import { Filter, getSpace, useQuery, useSchema } from '@dxos/react-client/echo';
-import { ViewEditor as NativeViewEditor } from '@dxos/react-ui-form';
-import { DataType } from '@dxos/schema';
+import { getSpace, useQuery } from '@dxos/react-client/echo';
+import { useAsyncEffect } from '@dxos/react-ui';
+import { ViewEditor as NaturalViewEditor } from '@dxos/react-ui-form';
+import { View } from '@dxos/schema';
 
+import { resolveSchemaWithClientAndSpace } from '../helpers';
+import { useTypeOptions } from '../hooks';
 import { SpaceAction } from '../types';
 
-type ViewEditorProps = { view: DataType.View };
+export type ViewEditorProps = { view: View.View };
 
 export const ViewEditor = ({ view }: ViewEditorProps) => {
   const { dispatchPromise: dispatch } = useIntentDispatcher();
   const client = useClient();
   const space = getSpace(view);
-  const schema = useSchema(client, space, view.query.typename);
+  const [schema, setSchema] = useState<Schema.Schema.AnyNoContext>(() => Schema.Struct({}));
+  const tags = useQuery(space, Filter.type(Tag.Tag));
+  const types = useTypeOptions({
+    space,
+    annotation: {
+      location: ['database', 'runtime'],
+      kind: ['user'],
+      registered: ['registered'],
+    },
+  });
+
+  useAsyncEffect(async () => {
+    if (!view?.query || !space) {
+      return;
+    }
 
-  const views = useQuery(space, Filter.type(DataType.View));
-  const currentTypename = useMemo(() => view.query?.typename, [view.query?.typename]);
+    const foundSchema = await resolveSchemaWithClientAndSpace(client, space, view.query.ast);
+    if (foundSchema && foundSchema !== schema) {
+      setSchema(() => foundSchema);
+    }
+  }, [client, space, view, schema]);
 
-  const handleUpdateTypename = useCallback(
-    (typename: string) => {
-      invariant(schema);
-      invariant(Type.isMutable(schema));
+  const handleQueryChanged = useCallback(
+    async (newQuery: QueryAST.Query, target?: string) => {
+      if (!view || !space) {
+        return;
+      }
 
-      const matchingViews = views.filter((view) => view.query.typename === currentTypename);
-      for (const view of matchingViews) {
-        view.query.typename = typename;
+      const queue = target && DXN.tryParse(target) ? target : undefined;
+      const query = queue ? Query.fromAst(newQuery).options({ queues: [queue] }) : Query.fromAst(newQuery);
+      view.query.ast = query.ast;
+      const newSchema = await resolveSchemaWithClientAndSpace(client, space, query.ast);
+      if (!newSchema) {
+        return;
       }
 
-      schema.updateTypename(typename);
+      const newView = View.make({
+        query,
+        jsonSchema: Type.toJsonSchema(newSchema),
+      });
+      view.projection = Obj.getSnapshot(newView).projection;
+
+      setSchema(() => newSchema);
     },
-    [views, schema],
+    [view, schema],
   );
 
   const handleDelete = useCallback(
@@ -52,13 +83,16 @@ export const ViewEditor = ({ view }: ViewEditorProps) => {
   }
 
   return (
-    <NativeViewEditor
+    <NaturalViewEditor
       registry={space.db.schemaRegistry}
       schema={schema}
       view={view}
-      onTypenameChanged={Type.isMutable(schema) ? handleUpdateTypename : undefined}
-      onDelete={Type.isMutable(schema) ? handleDelete : undefined}
+      mode='tag'
       outerSpacing={false}
+      tags={tags}
+      types={types}
+      onQueryChanged={handleQueryChanged}
+      onDelete={Type.isMutable(schema) ? handleDelete : undefined}
     />
   );
 };

package/src/components/index.ts

@@ -2,7 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-import { lazy } from 'react';
+import { type ComponentType, lazy } from 'react';
 
 export * from './AwaitingObject';
 export * from './CreateDialog';
@@ -10,10 +10,8 @@ export * from './CollectionSection';
 export * from './JoinDialog';
 export * from './MembersContainer';
 export * from './MenuFooter';
-export * from './ObjectSettings';
-export * from './PersistenceStatus';
-export * from './PopoverRenameObject';
-export * from './PopoverRenameSpace';
+export * from './ObjectRenamePopover';
+export * from './SpaceRenamePopover';
 export * from './SchemaContainer';
 export * from './SpacePresence';
 export * from './SpacePluginSettings';
@@ -21,5 +19,7 @@ export * from './SpaceSettings';
 export * from './SyncStatus';
 export * from './ViewEditor';
 
-export const CollectionMain = lazy(() => import('./CollectionMain'));
-export const ObjectDetailsPanel = lazy(() => import('./ObjectDetailsPanel'));
+export const CollectionArticle = lazy(() => import('./CollectionArticle'));
+export const ObjectDetailsPanel: ComponentType<any> = lazy(() => import('./ObjectDetailsPanel'));
+export const ObjectSettingsContainer = lazy(() => import('./ObjectSettings'));
+export const RecordArticle = lazy(() => import('./RecordArticle'));

package/src/events.ts

@@ -2,14 +2,14 @@
 // Copyright 2025 DXOS.org
 //
 
-import { defineEvent, Events } from '@dxos/app-framework';
+import { Events, defineEvent } from '@dxos/app-framework';
 
-import { SPACE_PLUGIN } from './meta';
+import { meta } from './meta';
 
 export namespace SpaceEvents {
-  export const StateReady = Events.createStateEvent(`${SPACE_PLUGIN}/event/state-ready`);
-  export const SetupSettingsPanel = defineEvent(`${SPACE_PLUGIN}/event/setup-settings-panel`);
-  export const DefaultSpaceReady = defineEvent(`${SPACE_PLUGIN}/event/default-space-ready`);
-  export const SpaceCreated = defineEvent(`${SPACE_PLUGIN}/event/space-created`);
-  export const SchemaAdded = defineEvent(`${SPACE_PLUGIN}/event/schema-added`);
+  export const StateReady = Events.createStateEvent(`${meta.id}/event/state-ready`);
+  export const SetupSettingsPanel = defineEvent(`${meta.id}/event/setup-settings-panel`);
+  export const DefaultSpaceReady = defineEvent(`${meta.id}/event/default-space-ready`);
+  export const SpaceCreated = defineEvent(`${meta.id}/event/space-created`);
+  export const SchemaAdded = defineEvent(`${meta.id}/event/schema-added`);
 }

package/src/helpers/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export * from './query';

package/src/helpers/query.test.ts

@@ -0,0 +1,24 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { describe, expect, it } from 'vitest';
+
+import { evalQuery } from './query';
+
+describe('evalQuery', () => {
+  it('should evaluate a query string', () => {
+    const query = evalQuery('Query.select(Filter.type(Person.Person))');
+    expect(query.ast).toMatchInlineSnapshot(`
+      {
+        "filter": {
+          "id": undefined,
+          "props": {},
+          "type": "object",
+          "typename": "dxn:type:dxos.org/type/Person:0.1.0",
+        },
+        "type": "select",
+      }
+    `);
+  });
+});

package/src/helpers/query.ts

@@ -0,0 +1,158 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Array from 'effect/Array';
+import * as Effect from 'effect/Effect';
+import * as EffectFunction from 'effect/Function';
+import * as Match from 'effect/Match';
+import * as Option from 'effect/Option';
+import type * as Schema from 'effect/Schema';
+import * as SchemaAST from 'effect/SchemaAST';
+
+import { DXN, Filter, Query, type QueryAST } from '@dxos/echo';
+import {
+  ReferenceAnnotationId,
+  type ReferenceAnnotationValue,
+  getTypeAnnotation,
+  unwrapOptional,
+} from '@dxos/echo/internal';
+import { log } from '@dxos/log';
+import { type Client } from '@dxos/react-client';
+import { type Space } from '@dxos/react-client/echo';
+import { Person } from '@dxos/types';
+
+// TODO(wittjosiah): Factor out and add tests.
+// TODO(wittjosiah): Support arbitrary type imports.
+export const evalQuery = (queryString: string): Query.Any => {
+  const globals = { Query, Filter, Person };
+  try {
+    // eslint-disable-next-line @typescript-eslint/no-implied-eval
+    return new Function(...Object.keys(globals), `return ${queryString}`)(...Object.values(globals));
+  } catch (err) {
+    log.catch(err);
+    return Query.select(Filter.nothing());
+  }
+};
+
+export const resolveSchemaWithClientAndSpace = (client: Client, space: Space, query: QueryAST.Query) => {
+  const resolve = Effect.fn(function* (dxn: string) {
+    const typename = DXN.parse(dxn).asTypeDXN()?.type;
+    if (!typename) {
+      return Option.none();
+    }
+
+    const staticSchema = client.graph.schemaRegistry.getSchema(typename);
+    if (staticSchema) {
+      return Option.some(staticSchema);
+    }
+
+    const query = space.db.schemaRegistry.query({ typename });
+    const schemas = yield* Effect.promise(() => query.run());
+    return Array.head(schemas);
+  });
+
+  return resolveSchema(query, resolve).pipe(
+    Effect.map((schema) => Option.getOrUndefined(schema)),
+    Effect.runPromise,
+  );
+};
+
+const resolveSchema = (
+  query: QueryAST.Query,
+  resolve: (dxn: string) => Effect.Effect<Option.Option<Schema.Schema.AnyNoContext>>,
+): Effect.Effect<Option.Option<Schema.Schema.AnyNoContext>> => {
+  return Match.value(query).pipe(
+    Match.withReturnType<Effect.Effect<Option.Option<Schema.Schema.AnyNoContext>>>(),
+    // TODO(wittjosiah): Reconcile with filter match?
+    Match.when({ type: 'select' }, ({ filter }) =>
+      typenameFromFilter(filter).pipe(
+        Option.map((typename) => resolve(typename)),
+        Option.getOrElse(() => Effect.succeed(Option.none<Schema.Schema.AnyNoContext>())),
+      ),
+    ),
+    Match.when({ type: 'filter' }, ({ filter }) =>
+      typenameFromFilter(filter).pipe(
+        Option.map((typename) => resolve(typename)),
+        Option.getOrElse(() => Effect.succeed(Option.none<Schema.Schema.AnyNoContext>())),
+      ),
+    ),
+    Match.when({ type: 'reference-traversal' }, ({ anchor, property }) =>
+      resolveSchema(anchor, resolve).pipe(
+        Effect.map((base) =>
+          base.pipe(
+            Option.map((schema) => SchemaAST.getPropertySignatures(schema.ast)),
+            Option.flatMap((properties) => Array.findFirst(properties, (p) => p.name === property)),
+            Option.flatMap((property) =>
+              SchemaAST.getAnnotation<ReferenceAnnotationValue>(ReferenceAnnotationId)(unwrapOptional(property)),
+            ),
+            Option.map((annotation) => annotation.typename),
+          ),
+        ),
+        Effect.flatMap(
+          Option.match({
+            onNone: () => Effect.succeed(Option.none()),
+            onSome: (typename) => resolve(DXN.fromTypename(typename).toString()),
+          }),
+        ),
+      ),
+    ),
+    Match.when({ type: 'relation', filter: Match.defined }, ({ filter }) =>
+      typenameFromFilter(filter).pipe(
+        Option.map((typename) => resolve(typename)),
+        Option.getOrElse(() => Effect.succeed(Option.none<Schema.Schema.AnyNoContext>())),
+      ),
+    ),
+    Match.when({ type: 'relation-traversal' }, ({ anchor, direction }) =>
+      resolveSchema(anchor, resolve).pipe(
+        Effect.map((base) =>
+          base.pipe(
+            Option.map((schema) => getTypeAnnotation(schema)),
+            Option.flatMap((annotation) =>
+              Option.fromNullable(direction === 'source' ? annotation?.sourceSchema : annotation?.targetSchema),
+            ),
+          ),
+        ),
+        Effect.flatMap(
+          Option.match({
+            onNone: () => Effect.succeed(Option.none()),
+            onSome: (typename) => resolve(typename),
+          }),
+        ),
+      ),
+    ),
+    Match.when({ type: 'options' }, ({ query }) => resolveSchema(query, resolve)),
+    Match.orElse((_q) => {
+      // TODO(wittjosiah): Implement other cases.
+      return Effect.succeed(Option.none());
+    }),
+  );
+};
+
+const typenameFromFilter = (filter: QueryAST.Filter): Option.Option<string> =>
+  Match.value(filter).pipe(
+    Match.withReturnType<Option.Option<string>>(),
+    Match.when({ type: 'object' }, ({ typename }) => Option.fromNullable(typename)),
+    Match.when({ type: 'and' }, ({ filters }) =>
+      EffectFunction.pipe(filters, Array.map(typenameFromFilter), Array.findFirst(Option.isSome), Option.flatten),
+    ),
+    Match.when({ type: 'or' }, ({ filters }) =>
+      EffectFunction.pipe(filters, Array.map(typenameFromFilter), Array.findFirst(Option.isSome), Option.flatten),
+    ),
+    Match.orElse(() => Option.none()),
+  );
+
+// TODO(wittjosiah): Currently assumes options is at the top-level of the ast.
+export const getQueryTarget = (query: QueryAST.Query, space?: Space) => {
+  return Match.value(query).pipe(
+    Match.when({ type: 'options' }, ({ options }) => {
+      return Option.fromNullable(options.queues).pipe(
+        Option.flatMap((queues) => Array.head(queues)),
+        Option.flatMap((queueDxn) => Option.fromNullable(DXN.tryParse(queueDxn))),
+        Option.flatMap((queueDxn) => Option.fromNullable(space?.queues.get(queueDxn))),
+        Option.getOrElse(() => space),
+      );
+    }),
+    Match.orElse(() => space),
+  );
+};

package/src/hooks/index.ts

@@ -5,3 +5,4 @@
 export * from './useActiveSpace';
 export * from './useInputSurfaceLookup';
 export * from './usePath';
+export * from './useTypeOptions';

package/src/hooks/useActiveSpace.ts

@@ -2,13 +2,14 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Capabilities, useLayout, type PluginContext } from '@dxos/app-framework';
+import { Capabilities, type PluginContext } from '@dxos/app-framework';
+import { useLayout } from '@dxos/app-framework/react';
 import { ClientCapabilities } from '@dxos/plugin-client';
 import { parseId, useSpace } from '@dxos/react-client/echo';
 
 export const getActiveSpace = (context: PluginContext) => {
-  const layout = context.getCapability(Capabilities.Layout);
   const client = context.getCapability(ClientCapabilities.Client);
+  const layout = context.getCapability(Capabilities.Layout);
   const { spaceId } = parseId(layout.workspace);
   return spaceId ? client.spaces.get(spaceId) : undefined;
 };

package/src/hooks/useInputSurfaceLookup.tsx

@@ -2,10 +2,10 @@
 // Copyright 2025 DXOS.org
 //
 
-import { type Schema } from 'effect';
+import type * as Schema from 'effect/Schema';
 import React, { useCallback } from 'react';
 
-import { usePluginManager, isSurfaceAvailable, Surface } from '@dxos/app-framework';
+import { Surface, isSurfaceAvailable, usePluginManager } from '@dxos/app-framework/react';
 import { type InputProps } from '@dxos/react-ui-form';
 
 // TODO(ZaymonFC): Move this if you find yourself needing it elsewhere.
@@ -20,7 +20,12 @@ export const useInputSurfaceLookup = (baseData?: Record<string, any>) => {
   return useCallback(
     ({ prop, schema, inputProps }: { prop: string; schema: Schema.Schema<any>; inputProps: InputProps }) => {
       const composedData = { prop, schema, ...baseData };
-      if (!isSurfaceAvailable(pluginManager.context, { role: 'form-input', data: composedData })) {
+      if (
+        !isSurfaceAvailable(pluginManager.context, {
+          role: 'form-input',
+          data: composedData,
+        })
+      ) {
         return undefined;
       }
 

package/src/hooks/usePath.ts

@@ -2,7 +2,7 @@
 // Copyright 2024 DXOS.org
 //
 
-import { Option } from 'effect';
+import * as Option from 'effect/Option';
 import { useEffect, useState } from 'react';
 
 import { type ReadableGraph } from '@dxos/plugin-graph';

package/src/hooks/useTypeOptions.ts

@@ -0,0 +1,27 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { useMemo } from 'react';
+
+import { useClient } from '@dxos/react-client';
+import { type Space } from '@dxos/react-client/echo';
+import { useTranslation } from '@dxos/react-ui';
+
+import { type TypeInputOptions, getTypenames } from '../types';
+
+export const useTypeOptions = ({ space, annotation }: { space?: Space; annotation: TypeInputOptions }) => {
+  const { t } = useTranslation();
+  const client = useClient();
+  const typenames = getTypenames({ annotation, space, client });
+  return useMemo(
+    () =>
+      typenames
+        .map((typename) => ({
+          value: typename,
+          label: t('typename label', { ns: typename, defaultValue: typename }),
+        }))
+        .toSorted((a, b) => a.label.localeCompare(b.label)),
+    [t, typenames],
+  );
+};

package/src/index.ts

@@ -6,6 +6,7 @@ export { SpaceCapabilities } from './capabilities';
 export { SpaceEvents } from './events';
 
 export * from './components';
+export * from './helpers';
 export * from './hooks';
 export * from './meta';
 export * from './SpacePlugin';

package/src/meta.ts

@@ -3,11 +3,14 @@
 //
 
 import { type PluginMeta } from '@dxos/app-framework';
-
-export const SPACE_PLUGIN = 'dxos.org/plugin/space';
+import { trim } from '@dxos/util';
 
 export const meta: PluginMeta = {
-  id: SPACE_PLUGIN,
+  id: 'dxos.org/plugin/space',
   name: 'Spaces',
+  description: trim`
+    Core workspace container system for organizing and sharing collaborative environments.
+    Create, manage, and share spaces with granular access control and invitation management.
+  `,
   icon: 'ph--planet--regular',
 };