@dxos/plugin-space 0.8.3 → 0.8.4-main.28f8d3d

package/src/capabilities/intent-resolver.ts

@@ -18,25 +18,26 @@ import { Migrations } from '@dxos/migrations';
 import { ClientCapabilities } from '@dxos/plugin-client';
 import { ObservabilityAction } from '@dxos/plugin-observability/types';
 import { EdgeReplicationSetting } from '@dxos/protocols/proto/dxos/echo/metadata';
-import { isSpace, getSpace, SpaceState, fullyQualifiedId } from '@dxos/react-client/echo';
+import { SpaceState, fullyQualifiedId, getSpace, isSpace } from '@dxos/react-client/echo';
 import { Invitation, InvitationEncoder } from '@dxos/react-client/invitations';
 import { ATTENDABLE_PATH_SEPARATOR } from '@dxos/react-ui-attention';
-import { DataType } from '@dxos/schema';
+import { DataType, ProjectionModel } from '@dxos/schema';
 
-import { SpaceCapabilities } from './capabilities';
 import {
   CREATE_OBJECT_DIALOG,
   CREATE_SPACE_DIALOG,
+  type CreateObjectDialogProps,
   JOIN_DIALOG,
+  type JoinDialogProps,
   POPOVER_RENAME_OBJECT,
   POPOVER_RENAME_SPACE,
-  type CreateObjectDialogProps,
-  type JoinDialogProps,
 } from '../components';
 import { SpaceEvents } from '../events';
 import { SPACE_PLUGIN } from '../meta';
 import { CollectionAction, SpaceAction } from '../types';
-import { cloneObject, COMPOSER_SPACE_LOCK, getNestedObjects } from '../util';
+import { COMPOSER_SPACE_LOCK, cloneObject, getNestedObjects } from '../util';
+
+import { SpaceCapabilities } from './capabilities';
 
 // TODO(wittjosiah): Remove.
 const SPACE_MAX_OBJECTS = 500;
@@ -75,17 +76,27 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
           await space.internal.setEdgeReplicationPreference(EdgeReplicationSetting.ENABLED);
         }
         await space.waitUntilReady();
+
+        // Create root collection.
         const collection = Obj.make(DataType.Collection, { objects: [] });
-        space.properties[Type.getTypename(DataType.Collection)] = Ref.make(collection);
+        space.properties[DataType.Collection.typename] = Ref.make(collection);
 
+        // Set current migration version.
         if (Migrations.versionProperty) {
           space.properties[Migrations.versionProperty] = Migrations.targetVersion;
         }
 
+        // Create records smart collection.
+        const records = Obj.make(DataType.QueryCollection, {
+          query: { typename: DataType.StoredSchema.typename },
+        });
+        collection.objects.push(Ref.make(records));
+
+        // Allow other plugins to add default content.
         await context.activatePromise(SpaceEvents.SpaceCreated);
         const onSpaceCreatedCallbacks = context.getCapabilities(SpaceCapabilities.OnSpaceCreated);
-        await Promise.all(
-          onSpaceCreatedCallbacks.map((onSpaceCreated) => onSpaceCreated({ space, rootCollection: collection })),
+        const spaceCreatedIntents = onSpaceCreatedCallbacks.map((onSpaceCreated) =>
+          onSpaceCreated({ space, rootCollection: collection }),
         );
 
         return {
@@ -95,6 +106,7 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
             space,
           },
           intents: [
+            ...spaceCreatedIntents,
             ...(observability
               ? [
                   createIntent(ObservabilityAction.SendEvent, {
@@ -309,9 +321,106 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
         };
       },
     }),
+    createResolver({
+      intent: SpaceAction.UseStaticSchema,
+      resolve: async ({ space, typename }) => {
+        const client = context.getCapability(ClientCapabilities.Client);
+        const schema = client.graph.schemaRegistry.schemas.find((schema) => Type.getTypename(schema) === typename);
+        invariant(schema, `Schema not found: ${typename}`);
+
+        if (!space.properties.staticRecords) {
+          space.properties.staticRecords = [];
+        }
+
+        if (!space.properties.staticRecords.includes(typename)) {
+          space.properties.staticRecords.push(typename);
+        }
+
+        await context.activatePromise(SpaceEvents.SchemaAdded);
+        const onSchemaAdded = context.getCapabilities(SpaceCapabilities.OnSchemaAdded);
+        const schemaAddedIntents = onSchemaAdded.map((onSchemaAdded) => onSchemaAdded({ space, schema }));
+
+        return {
+          data: {},
+          intents: [
+            ...schemaAddedIntents,
+            ...(observability
+              ? [
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'space.schema.use',
+                    properties: {
+                      spaceId: space.id,
+                      typename: Type.getTypename(schema),
+                    },
+                  }),
+                ]
+              : []),
+          ],
+        };
+      },
+    }),
+    createResolver({
+      intent: SpaceAction.AddSchema,
+      resolve: async ({ space, name, schema: schemaInput }) => {
+        const [schema] = await space.db.schemaRegistry.register([schemaInput]);
+        if (name) {
+          schema.storedSchema.name = name;
+        }
+
+        await context.activatePromise(SpaceEvents.SchemaAdded);
+        const onSchemaAdded = context.getCapabilities(SpaceCapabilities.OnSchemaAdded);
+        const schemaAddedIntents = onSchemaAdded.map((onSchemaAdded) => onSchemaAdded({ space, schema }));
+
+        return {
+          data: {
+            id: schema.id,
+            object: schema.storedSchema,
+            schema,
+          },
+          intents: [
+            ...schemaAddedIntents,
+            ...(observability
+              ? [
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'space.schema.add',
+                    properties: {
+                      spaceId: space.id,
+                      objectId: schema.id,
+                      typename: schema.typename,
+                    },
+                  }),
+                ]
+              : []),
+          ],
+        };
+      },
+    }),
+    createResolver({
+      intent: SpaceAction.DeleteField,
+      resolve: async ({ view, fieldId, deletionData }, undo) => {
+        const space = getSpace(view);
+        invariant(space);
+        invariant(view.query.typename);
+        const schema = await space.db.schemaRegistry.query({ typename: view.query.typename }).firstOrUndefined();
+        invariant(schema);
+        const projection = new ProjectionModel(schema.jsonSchema, view.projection);
+        if (!undo) {
+          const { deleted, index } = projection.deleteFieldProjection(fieldId);
+          return {
+            undoable: {
+              message: ['field deleted label', { ns: SPACE_PLUGIN }],
+              data: { deletionData: { ...deleted, index } },
+            },
+          };
+        } else if (undo && deletionData) {
+          const { field, props, index } = deletionData;
+          projection.setFieldProjection({ field, props }, index);
+        }
+      },
+    }),
     createResolver({
       intent: SpaceAction.OpenCreateObject,
-      resolve: ({ target, typename, navigable = true }) => {
+      resolve: ({ target, typename, navigable = true, onCreateObject }) => {
         const state = context.getCapability(SpaceCapabilities.State);
 
         return {
@@ -324,6 +433,7 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
                 props: {
                   target,
                   typename,
+                  onCreateObject,
                   shouldNavigate: navigable
                     ? (object: Obj.Any) => {
                         const isCollection = Obj.instanceOf(DataType.Collection, object);
@@ -381,13 +491,13 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
         } else if (isSpace(target) && hidden) {
           space.db.add(object);
         } else if (isSpace(target)) {
-          const collection = space.properties[Type.getTypename(DataType.Collection)]?.target;
+          const collection = space.properties[DataType.Collection.typename]?.target;
           if (Obj.instanceOf(DataType.Collection, collection)) {
             collection.objects.push(Ref.make(object));
           } else {
             // TODO(wittjosiah): Can't add non-echo objects by including in a collection because of types.
             const collection = Obj.make(DataType.Collection, { objects: [Ref.make(object)] });
-            space.properties[Type.getTypename(DataType.Collection)] = Ref.make(collection);
+            space.properties[DataType.Collection.typename] = Ref.make(collection);
           }
         }
 
@@ -444,7 +554,7 @@ export default ({ context, observability, createInvitationUrl }: IntentResolverO
 
         if (!undo) {
           const parentCollection: DataType.Collection =
-            target ?? space.properties[Type.getTypename(DataType.Collection)]?.target;
+            target ?? space.properties[DataType.Collection.typename]?.target;
           const nestedObjectsList = await Promise.all(objects.map((obj) => getNestedObjects(obj, resolve)));
 
           const deletionData = {

package/src/capabilities/react-root.tsx

@@ -6,10 +6,11 @@ import React from 'react';
 
 import { Capabilities, contributes, useCapability } from '@dxos/app-framework';
 
-import { SpaceCapabilities } from './capabilities';
 import { AwaitingObject } from '../components';
 import { SPACE_PLUGIN } from '../meta';
 
+import { SpaceCapabilities } from './capabilities';
+
 export default () =>
   contributes(Capabilities.ReactRoot, {
     id: SPACE_PLUGIN,

package/src/capabilities/react-surface.tsx

@@ -7,9 +7,9 @@ import React, { useCallback, useMemo } from 'react';
 
 import {
   Capabilities,
+  Surface,
   contributes,
   createSurface,
-  Surface,
   useCapabilities,
   useCapability,
   useLayout,
@@ -19,47 +19,60 @@ import { findAnnotation } from '@dxos/effect';
 import { SettingsStore } from '@dxos/local-storage';
 import { ClientCapabilities } from '@dxos/plugin-client';
 import { useClient } from '@dxos/react-client';
-import { getSpace, isLiveObject, isSpace, parseId, SpaceState, useSpace, type Space } from '@dxos/react-client/echo';
+import {
+  type Space,
+  SpaceState,
+  fullyQualifiedId,
+  getSpace,
+  isLiveObject,
+  isSpace,
+  parseId,
+  useSpace,
+} from '@dxos/react-client/echo';
 import { Input, useTranslation } from '@dxos/react-ui';
 import { type InputProps, SelectInput } from '@dxos/react-ui-form';
 import { HuePicker, IconPicker } from '@dxos/react-ui-pickers';
 import { DataType, type TypenameAnnotation, TypenameAnnotationId } from '@dxos/schema';
 import { type JoinPanelProps } from '@dxos/shell/react';
 
-import { SpaceCapabilities } from './capabilities';
 import {
-  CollectionMain,
-  CollectionSection,
   CREATE_OBJECT_DIALOG,
   CREATE_SPACE_DIALOG,
+  CollectionMain,
+  CollectionSection,
   CreateObjectDialog,
+  type CreateObjectDialogProps,
   CreateSpaceDialog,
   InlineSyncStatus,
   JOIN_DIALOG,
   JoinDialog,
   MembersContainer,
   MenuFooter,
+  ObjectDetailsPanel,
   ObjectSettingsContainer,
   POPOVER_RENAME_OBJECT,
   POPOVER_RENAME_SPACE,
   PopoverRenameObject,
   PopoverRenameSpace,
+  RecordMain,
   SchemaContainer,
   SmallPresenceLive,
   SpacePluginSettings,
   SpacePresence,
   SpaceSettingsContainer,
   SyncStatus,
-  type CreateObjectDialogProps,
+  ViewEditor,
 } from '../components';
 import { SPACE_PLUGIN } from '../meta';
 import { HueAnnotationId, IconAnnotationId, type SpaceSettingsProps } from '../types';
 
+import { SpaceCapabilities } from './capabilities';
+
 type ReactSurfaceOptions = {
   createInvitationUrl: (invitationCode: string) => string;
 };
 
-const OMIT = [Type.getTypename(DataType.Collection), Type.getTypename(DataType.QueryCollection)];
+const OMIT = [DataType.Collection.typename, DataType.QueryCollection.typename];
 
 export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
   contributes(Capabilities.ReactSurface, [
@@ -73,13 +86,20 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
         <Surface
           data={{
             id: data.subject.id,
-            subject: data.subject.properties[Type.getTypename(DataType.Collection)]?.target,
+            subject: data.subject.properties[DataType.Collection.typename]?.target,
           }}
           role={role}
           {...rest}
         />
       ),
     }),
+    createSurface({
+      id: `${SPACE_PLUGIN}/record-article`,
+      role: 'article',
+      position: 'fallback',
+      filter: (data): data is { subject: Obj.Any } => Obj.isObject(data.subject),
+      component: ({ data }) => <RecordMain record={data.subject} />,
+    }),
     createSurface({
       id: `${SPACE_PLUGIN}/collection-fallback`,
       role: 'article',
@@ -146,6 +166,19 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
         return <SchemaContainer space={space} />;
       },
     }),
+    createSurface({
+      id: `${SPACE_PLUGIN}/selected-objects`,
+      role: 'article',
+      filter: (data): data is { companionTo: DataType.View; subject: 'selected-objects' } =>
+        Obj.instanceOf(DataType.View, data.companionTo) && data.subject === 'selected-objects',
+      component: ({ data }) => (
+        <ObjectDetailsPanel
+          key={fullyQualifiedId(data.companionTo)}
+          objectId={fullyQualifiedId(data.companionTo)}
+          view={data.companionTo}
+        />
+      ),
+    }),
     createSurface({
       id: JOIN_DIALOG,
       role: 'dialog',
@@ -228,7 +261,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
 
         const schemaWhitelists = useCapabilities(ClientCapabilities.SchemaWhiteList);
         const whitelistedTypenames = useMemo(
-          () => new Set(schemaWhitelists.flatMap((typeArray) => typeArray.map((type) => type.typename))),
+          () => new Set(schemaWhitelists.flatMap((typeArray) => typeArray.map((type) => Type.getTypename(type)))),
           [schemaWhitelists],
         );
 
@@ -239,7 +272,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
               objectForms
                 .map((form) => Type.getTypename(form.objectSchema))
                 // TODO(wittjosiah): Remove.
-                .filter((typename) => !OMIT.includes(typename)),
+                .filter((typename) => !OMIT.includes(typename) && !typename.endsWith('View')),
             ),
           [objectForms],
         );
@@ -247,13 +280,23 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
         const fixed = client.graph.schemaRegistry.schemas.filter((schema) => {
           const limitedStatic =
             annotation.includes('limited-static') && whitelistedTypenames.has(Type.getTypename(schema));
+          const unusedStatic =
+            annotation.includes('unused-static') &&
+            whitelistedTypenames.has(Type.getTypename(schema)) &&
+            !space.properties.staticRecords?.includes(Type.getTypename(schema));
+          const usedStatic =
+            annotation.includes('used-static') &&
+            whitelistedTypenames.has(Type.getTypename(schema)) &&
+            space.properties.staticRecords?.includes(Type.getTypename(schema));
           const objectForm = annotation.includes('object-form') && objectFormTypenames.has(Type.getTypename(schema));
-          return annotation.includes('static') || limitedStatic || objectForm;
+          return annotation.includes('static') || limitedStatic || unusedStatic || usedStatic || objectForm;
         });
         const dynamic = space?.db.schemaRegistry.query().runSync();
         const typenames = Array.from(
           new Set<string>([
             ...(annotation.includes('limited-static') ||
+            annotation.includes('unused-static') ||
+            annotation.includes('used-static') ||
             annotation.includes('static') ||
             annotation.includes('object-form')
               ? fixed.map((schema) => Type.getTypename(schema))
@@ -264,25 +307,33 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
 
         const options = useMemo(
           () =>
-            typenames.map((typename) => ({
-              value: typename,
-              label: t('typename label', { ns: typename, defaultValue: typename }),
-            })),
+            typenames
+              .map((typename) => ({
+                value: typename,
+                label: t('typename label', { ns: typename, defaultValue: typename }),
+              }))
+              .toSorted((a, b) => a.label.localeCompare(b.label)),
           [t, typenames],
         );
 
         return <SelectInput {...props} options={options} />;
       },
     }),
+    createSurface({
+      id: `${SPACE_PLUGIN}/object-settings`,
+      role: 'object-settings',
+      filter: (data): data is { subject: DataType.View } => Obj.instanceOf(DataType.View, data.subject),
+      component: ({ data }) => <ViewEditor view={data.subject} />,
+    }),
     createSurface({
       id: POPOVER_RENAME_SPACE,
-      role: 'popover',
+      role: 'card--popover',
       filter: (data): data is { props: Space } => data.component === POPOVER_RENAME_SPACE && isSpace(data.props),
       component: ({ data }) => <PopoverRenameSpace space={data.props} />,
     }),
     createSurface({
       id: POPOVER_RENAME_OBJECT,
-      role: 'popover',
+      role: 'card--popover',
       filter: (data): data is { props: Obj.Any } =>
         data.component === POPOVER_RENAME_OBJECT && isLiveObject(data.props),
       component: ({ data }) => <PopoverRenameObject object={data.props} />,
@@ -328,7 +379,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
         const space = isSpace(data.subject) ? data.subject : getSpace(data.subject);
         const object = isSpace(data.subject)
           ? data.subject.state.get() === SpaceState.SPACE_READY
-            ? (space?.properties[Type.getTypename(DataType.Collection)]?.target as DataType.Collection)
+            ? (space?.properties[DataType.Collection.typename]?.target as DataType.Collection)
             : undefined
           : data.subject;
 

package/src/capabilities/schema-defs.ts

@@ -2,12 +2,13 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';
+import { Capabilities, type PluginContext, contributes } from '@dxos/app-framework';
 import { ClientCapabilities } from '@dxos/plugin-client';
 
-import { SpaceCapabilities } from './capabilities';
 import { type ObjectForm } from '../types';
 
+import { SpaceCapabilities } from './capabilities';
+
 export default (context: PluginContext) => {
   const registry = context.getCapability(Capabilities.RxRegistry);
   const client = context.getCapability(ClientCapabilities.Client);

package/src/capabilities/schema-tool.test.ts

@@ -3,7 +3,7 @@
 //
 
 import { Schema } from 'effect';
-import { describe, it, expect } from 'vitest';
+import { describe, expect, it } from 'vitest';
 
 import { TypeNameSchema } from './schema-tools';
 

package/src/capabilities/schema-tools.ts

@@ -4,8 +4,8 @@
 
 import { Schema, SchemaAST } from 'effect';
 
-import { createTool, ToolResult } from '@dxos/ai';
-import { Capabilities, contributes, type PromiseIntentDispatcher } from '@dxos/app-framework';
+import { ToolResult, createTool } from '@dxos/ai';
+import { Capabilities, type PromiseIntentDispatcher, contributes } from '@dxos/app-framework';
 import { type Space } from '@dxos/client/echo';
 import { Type } from '@dxos/echo';
 import { FormatEnum, FormatEnums, SelectOptionSchema } from '@dxos/echo-schema';
@@ -61,8 +61,8 @@ export default () =>
   contributes(Capabilities.Tools, [
     createTool(SYSTEM_NAMESPACE, {
       name: 'list',
-      description: 'List registered schemas in the space.',
-      caption: 'Listing registered schemas...',
+      description: 'List registered record types in the space.',
+      caption: 'Listing registered record types...',
       schema: Schema.Struct({}),
       execute: async (_input, { extensions }) => {
         invariant(extensions?.space, 'No space.');
@@ -79,11 +79,11 @@ export default () =>
     }),
     createTool(SYSTEM_NAMESPACE, {
       name: 'get',
-      description: 'Get a specific schema by its typename.',
-      caption: 'Getting schema...',
+      description: 'Get a specific record type by its name.',
+      caption: 'Getting record...',
       schema: Schema.Struct({
         typename: Schema.String.annotations({
-          description: 'The fully qualified typename of the schema.',
+          description: 'The fully qualified name of the record type.',
         }),
       }),
       execute: async ({ typename }, { extensions }) => {
@@ -100,15 +100,15 @@ export default () =>
     }),
     createTool(SYSTEM_NAMESPACE, {
       name: 'create',
-      description: 'Create a new schema with the provided definition.',
-      caption: 'Creating schema...',
+      description: 'Create a new record type with the provided definition.',
+      caption: 'Creating record type...',
       schema: Schema.Struct({
         typename: TypeNameSchema.annotations({
           description:
-            'The fully qualified schema typename. Must start with a domain, and then one or more path components (e.g., "example.com/type/TypeName").',
+            'The fully qualified name of the record type. Must start with a domain, and then one or more path components (e.g., "example.com/type/TypeName").',
         }),
         properties: Schema.Array(PropertyDefinitionSchema).pipe(
-          Schema.annotations({ description: 'Array of property definitions for the schema.' }),
+          Schema.annotations({ description: 'Array of property definitions for the record.' }),
           Schema.mutable,
         ),
       }),

package/src/capabilities/spaces-ready.ts

@@ -4,7 +4,7 @@
 
 import { Option } from 'effect';
 
-import { contributes, createIntent, Capabilities, LayoutAction, type PluginContext } from '@dxos/app-framework';
+import { Capabilities, LayoutAction, type PluginContext, contributes, createIntent } from '@dxos/app-framework';
 import { SubscriptionList } from '@dxos/async';
 import { Filter, Obj, Type } from '@dxos/echo';
 import { scheduledEffect } from '@dxos/echo-signals/core';
@@ -14,13 +14,14 @@ import { ClientCapabilities } from '@dxos/plugin-client';
 import { DeckCapabilities } from '@dxos/plugin-deck';
 import { EdgeReplicationSetting } from '@dxos/protocols/proto/dxos/echo/metadata';
 import { PublicKey } from '@dxos/react-client';
-import { FQ_ID_LENGTH, parseFullyQualifiedId, SpaceState } from '@dxos/react-client/echo';
+import { FQ_ID_LENGTH, SpaceState, parseFullyQualifiedId } from '@dxos/react-client/echo';
 import { ComplexMap, reduceGroupBy } from '@dxos/util';
 
-import { SpaceCapabilities } from './capabilities';
 import { SpaceAction } from '../types';
 import { COMPOSER_SPACE_LOCK, SHARED } from '../util';
 
+import { SpaceCapabilities } from './capabilities';
+
 const ACTIVE_NODE_BROADCAST_INTERVAL = 30_000;
 const WAIT_FOR_OBJECT_TIMEOUT = 5_000;
 
@@ -66,12 +67,14 @@ export default async (context: PluginContext) => {
           return;
         }
 
-        const node = graph.getNode(active[0]).pipe(Option.getOrNull);
-        if (!node && active[0].length === FQ_ID_LENGTH) {
+        const id = active[0];
+        const node = graph.getNode(id).pipe(Option.getOrNull);
+        if (!node && id.length === FQ_ID_LENGTH) {
+          void graph.initialize(id);
           const timeout = setTimeout(async () => {
-            const node = graph.getNode(active[0]).pipe(Option.getOrNull);
+            const node = graph.getNode(id).pipe(Option.getOrNull);
             if (!node) {
-              await dispatch(createIntent(SpaceAction.WaitForObject, { id: active[0] }));
+              await dispatch(createIntent(SpaceAction.WaitForObject, { id }));
             }
           }, WAIT_FOR_OBJECT_TIMEOUT);
 

package/src/capabilities/state.ts

@@ -4,15 +4,16 @@
 
 import { effect } from '@preact/signals-core';
 
-import { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';
+import { Capabilities, type PluginContext, contributes } from '@dxos/app-framework';
 import { PublicKey } from '@dxos/keys';
 import { LocalStorageStore } from '@dxos/local-storage';
 import { ComplexMap } from '@dxos/util';
 
-import { SpaceCapabilities } from './capabilities';
 import { SPACE_PLUGIN } from '../meta';
 import { type PluginState } from '../types';
 
+import { SpaceCapabilities } from './capabilities';
+
 export default (context: PluginContext) => {
   const state = new LocalStorageStore<PluginState>(SPACE_PLUGIN, {
     awaiting: undefined,

package/src/components/AwaitingObject.tsx

@@ -2,14 +2,12 @@
 // Copyright 2023 DXOS.org
 //
 
-import { CheckCircle, CircleDashed, CircleNotch } from '@phosphor-icons/react';
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { createIntent, LayoutAction, useIntentDispatcher, useLayout } from '@dxos/app-framework';
+import { LayoutAction, createIntent, useIntentDispatcher, useLayout } from '@dxos/app-framework';
 import { useClient } from '@dxos/react-client';
 import { Filter, fullyQualifiedId, useQuery } from '@dxos/react-client/echo';
-import { Button, Toast, useTranslation } from '@dxos/react-ui';
-import { getSize, mx } from '@dxos/react-ui-theme';
+import { Button, Icon, Toast, useTranslation } from '@dxos/react-ui';
 
 import { SPACE_PLUGIN } from '../meta';
 import { SpaceAction } from '../types';
@@ -66,17 +64,17 @@ export const AwaitingObject = ({ id }: { id: string }) => {
         <Toast.Title classNames='flex items-center gap-2'>
           {found ? (
             <>
-              <CheckCircle className={getSize(5)} />
+              <Icon icon='ph--check-circle--regular' size={5} />
               <span>{t('found object label')}</span>
             </>
           ) : waiting ? (
             <>
-              <CircleNotch className={mx(getSize(5), 'animate-spin')} />
+              <Icon icon='ph--circle-notch--regular' size={5} classNames='animate-spin' />
               <span>{t('waiting for object label')}</span>
             </>
           ) : (
             <>
-              <CircleDashed className={getSize(5)} />
+              <Icon icon='ph--circle-dashed--regular' size={5} />
               <span>{t('object not found label')}</span>
             </>
           )}

package/src/components/CollectionMain.tsx

@@ -28,3 +28,5 @@ export const CollectionMain = ({ collection }: { collection: DataType.Collection
     </div>
   );
 };
+
+export default CollectionMain;

package/src/components/CreateDialog/CreateObjectDialog.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta, type StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React, { useEffect } from 'react';
 
 import { Filter, Obj, Type } from '@dxos/echo';
@@ -12,11 +12,12 @@ import { useQuery, useSpace } from '@dxos/react-client/echo';
 import { withClientProvider } from '@dxos/react-client/testing';
 import { Dialog } from '@dxos/react-ui';
 import { DataType } from '@dxos/schema';
-import { osTranslations } from '@dxos/shell/react';
+import { translations as shellTranslations } from '@dxos/shell/react';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
+import { translations } from '../../translations';
+
 import { CreateObjectDialog, type CreateObjectDialogProps } from './CreateObjectDialog';
-import translations from '../../translations';
 
 const Story = (args: CreateObjectDialogProps) => {
   return (
@@ -39,7 +40,7 @@ const meta: Meta<typeof CreateObjectDialog> = {
     withLayout(),
   ],
   parameters: {
-    translations: [...translations, osTranslations],
+    translations: [...translations, ...shellTranslations],
   },
   args: {},
 };