@dxos/plugin-space 0.7.5-main.9d2a38b → 0.7.5-main.e94eead

package/src/capabilities/react-surface.tsx

@@ -2,18 +2,10 @@
 // Copyright 2025 DXOS.org
 //
 
-import React, { useCallback } from 'react';
+import React from 'react';
 
-import {
-  Capabilities,
-  contributes,
-  createSurface,
-  Surface,
-  useCapability,
-  useCapabilities,
-  usePluginManager,
-} from '@dxos/app-framework';
-import { ClientCapabilities } from '@dxos/plugin-client';
+import { Capabilities, contributes, createSurface, Surface, useCapability } from '@dxos/app-framework';
+import { SettingsStore } from '@dxos/local-storage';
 import {
   getSpace,
   isEchoObject,
@@ -43,7 +35,6 @@ import {
   POPOVER_RENAME_SPACE,
   PopoverRenameObject,
   PopoverRenameSpace,
-  ShareSpaceButton,
   SmallPresenceLive,
   SPACE_SETTINGS_DIALOG,
   SpacePluginSettings,
@@ -53,10 +44,11 @@ import {
   SyncStatus,
   type CreateObjectDialogProps,
   type SpaceSettingsDialogProps,
+  POPOVER_ADD_SPACE,
+  PopoverAddSpace,
 } from '../components';
 import { SPACE_PLUGIN } from '../meta';
 import { CollectionType, type SpaceSettingsProps } from '../types';
-import { COMPOSER_SPACE_LOCK } from '../util';
 
 type ReactSurfaceOptions = {
   createInvitationUrl: (invitationCode: string) => string;
@@ -81,7 +73,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
     createSurface({
       id: `${SPACE_PLUGIN}/collection-fallback`,
       role: 'article',
-      disposition: 'fallback',
+      position: 'fallback',
       filter: (data): data is { subject: CollectionType } => data.subject instanceof CollectionType,
       component: ({ data }) => <CollectionMain collection={data.subject} />,
     }),
@@ -95,28 +87,28 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
     createSurface({
       id: `${SPACE_PLUGIN}/object-settings-base-panel`,
       role: 'complementary--settings',
-      disposition: 'hoist',
+      position: 'hoist',
       filter: (data): data is { subject: ReactiveEchoObject<any> } => isEchoObject(data.subject),
       component: ({ data }) => <BaseObjectSettings object={data.subject} />,
     }),
     createSurface({
       id: `${SPACE_PLUGIN}/object-settings-advanced-panel`,
       role: 'complementary--settings',
-      disposition: 'fallback',
+      position: 'fallback',
       filter: (data): data is { subject: ReactiveEchoObject<any> } => isEchoObject(data.subject),
       component: ({ data }) => <AdvancedObjectSettings object={data.subject} />,
     }),
     createSurface({
       id: SPACE_SETTINGS_DIALOG,
       role: 'dialog',
-      filter: (data): data is { subject: SpaceSettingsDialogProps } => data.component === SPACE_SETTINGS_DIALOG,
-      component: ({ data }) => <SpaceSettingsDialog {...data.subject} createInvitationUrl={createInvitationUrl} />,
+      filter: (data): data is { props: SpaceSettingsDialogProps } => data.component === SPACE_SETTINGS_DIALOG,
+      component: ({ data }) => <SpaceSettingsDialog {...data.props} createInvitationUrl={createInvitationUrl} />,
     }),
     createSurface({
       id: JOIN_DIALOG,
       role: 'dialog',
-      filter: (data): data is { subject: JoinPanelProps } => data.component === JOIN_DIALOG,
-      component: ({ data }) => <JoinDialog {...data.subject} />,
+      filter: (data): data is { props: JoinPanelProps } => data.component === JOIN_DIALOG,
+      component: ({ data }) => <JoinDialog {...data.props} />,
     }),
     createSurface({
       id: CREATE_SPACE_DIALOG,
@@ -127,36 +119,27 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
     createSurface({
       id: CREATE_OBJECT_DIALOG,
       role: 'dialog',
-      filter: (data): data is { subject: Partial<CreateObjectDialogProps> } => data.component === CREATE_OBJECT_DIALOG,
-      component: ({ data }) => {
-        const schemas = useCapabilities(ClientCapabilities.Schema).flat();
-        const manager = usePluginManager();
-
-        const resolve = useCallback(
-          (typename: string) => {
-            return (
-              manager.context.requestCapabilities(Capabilities.Metadata).find(({ id }) => id === typename)?.metadata ??
-              {}
-            );
-          },
-          [manager],
-        );
-
-        return <CreateObjectDialog schemas={schemas} resolve={resolve} {...data.subject} />;
-      },
+      filter: (data): data is { props: CreateObjectDialogProps } => data.component === CREATE_OBJECT_DIALOG,
+      component: ({ data }) => <CreateObjectDialog {...data.props} />,
     }),
     createSurface({
       id: POPOVER_RENAME_SPACE,
       role: 'popover',
-      filter: (data): data is { subject: Space } => data.component === POPOVER_RENAME_SPACE && isSpace(data.subject),
-      component: ({ data }) => <PopoverRenameSpace space={data.subject} />,
+      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',
-      filter: (data): data is { subject: ReactiveEchoObject<any> } =>
-        data.component === POPOVER_RENAME_OBJECT && isReactiveObject(data.subject),
-      component: ({ data }) => <PopoverRenameObject object={data.subject} />,
+      filter: (data): data is { props: ReactiveEchoObject<any> } =>
+        data.component === POPOVER_RENAME_OBJECT && isReactiveObject(data.props),
+      component: ({ data }) => <PopoverRenameObject object={data.props} />,
+    }),
+    createSurface({
+      id: POPOVER_ADD_SPACE,
+      role: 'popover',
+      filter: (data): data is any => data.component === POPOVER_ADD_SPACE,
+      component: () => <PopoverAddSpace />,
     }),
     createSurface({
       id: `${SPACE_PLUGIN}/navtree-presence`,
@@ -173,7 +156,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
       // TODO(wittjosiah): Attention glyph for non-echo items should be handled elsewhere.
       id: `${SPACE_PLUGIN}/navtree-presence-fallback`,
       role: 'navtree-item-end',
-      disposition: 'fallback',
+      position: 'fallback',
       filter: (data): data is { id: string; open?: boolean } => typeof data.id === 'string',
       component: ({ data }) => <SmallPresenceLive id={data.id} open={data.open} />,
     }),
@@ -186,7 +169,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
     createSurface({
       id: `${SPACE_PLUGIN}/navbar-presence`,
       role: 'navbar-end',
-      disposition: 'hoist',
+      position: 'hoist',
       filter: (data): data is { subject: Space | ReactiveEchoObject<any> } =>
         isSpace(data.subject) || isEchoObject(data.subject),
       component: ({ data }) => {
@@ -197,12 +180,7 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
             : undefined
           : data.subject;
 
-        return space && object ? (
-          <>
-            <SpacePresence object={object} />
-            {space.properties[COMPOSER_SPACE_LOCK] ? null : <ShareSpaceButton space={space} />}
-          </>
-        ) : null;
+        return object ? <SpacePresence object={object} /> : null;
       },
     }),
     createSurface({
@@ -213,12 +191,10 @@ export default ({ createInvitationUrl }: ReactSurfaceOptions) =>
     }),
     createSurface({
       id: `${SPACE_PLUGIN}/settings`,
-      role: 'settings',
-      filter: (data): data is any => data.subject === SPACE_PLUGIN,
-      component: () => {
-        const settings = useCapability(Capabilities.SettingsStore).getStore<SpaceSettingsProps>(SPACE_PLUGIN)!.value;
-        return <SpacePluginSettings settings={settings} />;
-      },
+      role: 'article',
+      filter: (data): data is { subject: SettingsStore<SpaceSettingsProps> } =>
+        data.subject instanceof SettingsStore && data.subject.prefix === SPACE_PLUGIN,
+      component: ({ data: { subject } }) => <SpacePluginSettings settings={subject.value} />,
     }),
     createSurface({
       id: `${SPACE_PLUGIN}/menu-footer`,

package/src/capabilities/schema.ts

@@ -0,0 +1,27 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { effect } from '@preact/signals-core';
+
+import { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';
+import { ClientCapabilities } from '@dxos/plugin-client';
+
+import { SpaceCapabilities } from './capabilities';
+import { type ObjectForm } from '../types';
+
+export default (context: PluginsContext) => {
+  const client = context.requestCapability(ClientCapabilities.Client);
+
+  // TODO(wittjosiah): Unregister schemas when they are disabled.
+  let previous: ObjectForm[] = [];
+  const unsubscribe = effect(() => {
+    const forms = Array.from(new Set(context.requestCapabilities(SpaceCapabilities.ObjectForm)));
+    // TODO(wittjosiah): Filter out schemas which the client has already registered.
+    const newSchemas = forms.filter((form) => !previous.includes(form)).map((form) => form.objectSchema);
+    previous = forms;
+    client.addTypes(newSchemas);
+  });
+
+  return contributes(Capabilities.Null, null, () => unsubscribe());
+};

package/src/capabilities/spaces-ready.ts

@@ -2,7 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { contributes, createIntent, openIds, type PluginsContext, Capabilities } from '@dxos/app-framework';
+import { contributes, createIntent, type PluginsContext, Capabilities, LayoutAction } from '@dxos/app-framework';
 import { EventSubscriptions } from '@dxos/async';
 import { Expando } from '@dxos/echo-schema';
 import { scheduledEffect } from '@dxos/echo-signals/core';
@@ -10,6 +10,7 @@ import { create } from '@dxos/live-object';
 import { log } from '@dxos/log';
 import { AttentionCapabilities } from '@dxos/plugin-attention';
 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 { Filter, FQ_ID_LENGTH, parseFullyQualifiedId, SpaceState } from '@dxos/react-client/echo';
@@ -29,7 +30,7 @@ export default async (context: PluginsContext) => {
   const { dispatchPromise: dispatch } = context.requestCapability(Capabilities.IntentDispatcher);
   const { graph } = context.requestCapability(Capabilities.AppGraph);
   const layout = context.requestCapability(Capabilities.Layout);
-  const location = context.requestCapability(Capabilities.Location);
+  const deck = context.requestCapability(DeckCapabilities.DeckState);
   const attention = context.requestCapability(AttentionCapabilities.Attention);
   const state = context.requestCapability(SpaceCapabilities.MutableState);
   const client = context.requestCapability(ClientCapabilities.Client);
@@ -37,6 +38,10 @@ export default async (context: PluginsContext) => {
   const defaultSpace = client.spaces.default;
   await defaultSpace.waitUntilReady();
 
+  if (deck.activeDeck === 'default') {
+    await dispatch(createIntent(LayoutAction.SwitchWorkspace, { part: 'workspace', subject: defaultSpace.id }));
+  }
+
   // Initialize space sharing lock in default space.
   if (typeof defaultSpace.properties[COMPOSER_SPACE_LOCK] !== 'boolean') {
     defaultSpace.properties[COMPOSER_SPACE_LOCK] = true;
@@ -54,21 +59,18 @@ export default async (context: PluginsContext) => {
   // Await missing objects.
   subscriptions.add(
     scheduledEffect(
-      () => ({
-        layoutMode: layout.layoutMode,
-        soloPart: location.active.solo?.[0],
-      }),
-      ({ layoutMode, soloPart }) => {
-        if (layoutMode !== 'solo' || !soloPart) {
+      () => ({ active: layout.active }),
+      ({ active }) => {
+        if (active.length !== 1) {
           return;
         }
 
-        const node = graph.findNode(soloPart.id);
-        if (!node && soloPart.id.length === FQ_ID_LENGTH) {
+        const node = graph.findNode(active[0]);
+        if (!node && active[0].length === FQ_ID_LENGTH) {
           const timeout = setTimeout(async () => {
-            const node = graph.findNode(soloPart.id);
+            const node = graph.findNode(active[0]);
             if (!node) {
-              await dispatch(createIntent(SpaceAction.WaitForObject, { id: soloPart.id }));
+              await dispatch(createIntent(SpaceAction.WaitForObject, { id: active[0] }));
             }
           }, WAIT_FOR_OBJECT_TIMEOUT);
 
@@ -102,17 +104,14 @@ export default async (context: PluginsContext) => {
   // Broadcast active node to other peers in the space.
   subscriptions.add(
     scheduledEffect(
-      () => ({
-        open: openIds(location.active, layout.layoutMode === 'solo' ? ['solo'] : ['main']),
-        closed: [...location.closed],
-      }),
-      ({ open, closed }) => {
+      () => ({ current: attention.current, active: layout.active, inactive: layout.inactive }),
+      ({ current, active, inactive }) => {
         const send = () => {
           const spaces = client.spaces.get();
           const identity = client.halo.identity.get();
-          if (identity && location.active) {
+          if (identity) {
             // Group parts by space for efficient messaging.
-            const idsBySpace = reduceGroupBy(open, (id) => {
+            const idsBySpace = reduceGroupBy(active, (id) => {
               try {
                 const [spaceId] = parseFullyQualifiedId(id);
                 return spaceId;
@@ -121,7 +120,7 @@ export default async (context: PluginsContext) => {
               }
             });
 
-            const removedBySpace = reduceGroupBy(closed, (id) => {
+            const removedBySpace = reduceGroupBy(inactive, (id) => {
               try {
                 const [spaceId] = parseFullyQualifiedId(id);
                 return spaceId;
@@ -147,7 +146,7 @@ export default async (context: PluginsContext) => {
               void space
                 .postMessage('viewing', {
                   identityKey: identity.identityKey.toHex(),
-                  attended: attention.current ? [...attention.current] : [],
+                  attended: current,
                   added,
                   removed,
                 })

package/src/components/AwaitingObject.tsx

@@ -5,7 +5,7 @@
 import { CheckCircle, CircleDashed, CircleNotch } from '@phosphor-icons/react';
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { NavigationAction, useIntentDispatcher, createIntent, useCapability, Capabilities } from '@dxos/app-framework';
+import { createIntent, LayoutAction, 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';
@@ -23,7 +23,7 @@ export const AwaitingObject = ({ id }: { id: string }) => {
   const [found, setFound] = useState(false);
   const { t } = useTranslation(SPACE_PLUGIN);
   const { dispatchPromise: dispatch } = useIntentDispatcher();
-  const location = useCapability(Capabilities.Location);
+  const layout = useLayout();
 
   const client = useClient();
   const objects = useQuery(client.spaces, Filter.all());
@@ -44,11 +44,11 @@ export const AwaitingObject = ({ id }: { id: string }) => {
     if (objects.findIndex((object) => fullyQualifiedId(object) === id) > -1) {
       setFound(true);
 
-      if (location.active.solo?.[0].id === id) {
+      if (layout.active.includes(id)) {
         setOpen(false);
       }
     }
-  }, [id, objects, location]);
+  }, [id, objects, layout]);
 
   const handleClose = useCallback(
     async () => dispatch(createIntent(SpaceAction.WaitForObject, { id: undefined })),
@@ -56,7 +56,7 @@ export const AwaitingObject = ({ id }: { id: string }) => {
   );
 
   const handleNavigate = useCallback(() => {
-    void dispatch(createIntent(NavigationAction.Open, { activeParts: { main: [id] } }));
+    void dispatch(createIntent(LayoutAction.Open, { part: 'main', subject: [id] }));
     void handleClose();
   }, [id, handleClose, dispatch]);
 

package/src/components/BaseObjectSettings.tsx

@@ -15,17 +15,24 @@ export type BaseObjectSettingsProps = {
 
 export const BaseObjectSettings = ({ object }: BaseObjectSettingsProps) => {
   const { t } = useTranslation(SPACE_PLUGIN);
+  const inputRef = React.useRef<HTMLInputElement>(null);
   // TODO(burdon): Standardize forms.
   return (
     <div role='form' className='flex flex-col w-full p-2 gap-1'>
       <Input.Root>
         <Input.Label>{t('name label')}</Input.Label>
         <Input.TextInput
+          ref={inputRef}
           placeholder={t('name placeholder')}
           value={object.name ?? ''}
           onChange={(event) => {
             object.name = event.target.value;
           }}
+          onKeyDown={(event) => {
+            if (event.key === 'Enter') {
+              inputRef.current?.blur();
+            }
+          }}
         />
       </Input.Root>
     </div>

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

@@ -40,9 +40,7 @@ const meta: Meta<typeof CreateObjectDialog> = {
   parameters: {
     translations: [...translations, osTranslations],
   },
-  args: {
-    schemas: [CollectionType],
-  },
+  args: {},
 };
 
 export default meta;

package/src/components/CreateDialog/CreateObjectDialog.tsx

@@ -5,58 +5,65 @@
 import { pipe } from 'effect';
 import React, { useCallback, useRef } from 'react';
 
-import { chain, createIntent, NavigationAction, useIntentDispatcher } from '@dxos/app-framework';
-import { useClient } from '@dxos/react-client';
 import {
-  getSpace,
-  isReactiveObject,
-  isSpace,
-  type ReactiveObject,
-  type TypedObject,
-  useSpaces,
-} from '@dxos/react-client/echo';
+  Capabilities,
+  chain,
+  createIntent,
+  LayoutAction,
+  useCapabilities,
+  useIntentDispatcher,
+  usePluginManager,
+} from '@dxos/app-framework';
+import { invariant } from '@dxos/invariant';
+import { useClient } from '@dxos/react-client';
+import { getSpace, isReactiveObject, isSpace, type ReactiveObject, useSpaces } from '@dxos/react-client/echo';
 import { Button, Dialog, Icon, useTranslation } from '@dxos/react-ui';
 
 import { CreateObjectPanel, type CreateObjectPanelProps } from './CreateObjectPanel';
+import { SpaceCapabilities } from '../../capabilities';
 import { SPACE_PLUGIN } from '../../meta';
-import { CollectionType, SpaceAction } from '../../types';
+import { CollectionType, type ObjectForm, SpaceAction } from '../../types';
 
 export const CREATE_OBJECT_DIALOG = `${SPACE_PLUGIN}/CreateObjectDialog`;
 
-export type CreateObjectDialogProps = Pick<CreateObjectPanelProps, 'schemas' | 'target' | 'typename' | 'name'> & {
-  resolve?: (typename: string) => Record<string, any>;
+export type CreateObjectDialogProps = Pick<CreateObjectPanelProps, 'target' | 'typename' | 'name'> & {
   shouldNavigate?: (object: ReactiveObject<any>) => boolean;
 };
 
 export const CreateObjectDialog = ({
-  schemas,
   target,
   typename,
   name,
   shouldNavigate: _shouldNavigate,
-  resolve,
 }: CreateObjectDialogProps) => {
   const closeRef = useRef<HTMLButtonElement | null>(null);
+  const manager = usePluginManager();
   const { t } = useTranslation(SPACE_PLUGIN);
   const client = useClient();
   const spaces = useSpaces();
   const { dispatchPromise: dispatch } = useIntentDispatcher();
+  const forms = useCapabilities(SpaceCapabilities.ObjectForm);
+
+  const resolve = useCallback(
+    (typename: string) =>
+      manager.context.requestCapabilities(Capabilities.Metadata).find(({ id }) => id === typename)?.metadata ?? {},
+    [manager],
+  );
 
   const handleCreateObject = useCallback(
     async ({
-      schema,
+      form,
       target: _target,
-      data,
+      data = {},
     }: {
-      schema: TypedObject;
+      form: ObjectForm;
       target: CreateObjectPanelProps['target'];
       data?: Record<string, any>;
     }) => {
       const target = isSpace(_target)
         ? (_target.properties[CollectionType.typename]?.target as CollectionType | undefined)
         : _target;
-      const createObjectIntent = resolve?.(schema.typename)?.createObject;
-      if (!createObjectIntent || !target) {
+      if (!target) {
         // TODO(wittjosiah): UI feedback.
         return;
       }
@@ -65,13 +72,14 @@ export const CreateObjectDialog = ({
       closeRef.current?.click();
 
       const space = isSpace(target) ? target : getSpace(target);
-      const result = await dispatch(createObjectIntent(data, { space }));
+      invariant(space, 'Missing space');
+      const result = await dispatch(form.getIntent(data, { space }));
       const object = result.data?.object;
       if (isReactiveObject(object)) {
         const addObjectIntent = createIntent(SpaceAction.AddObject, { target, object });
         const shouldNavigate = _shouldNavigate ?? (() => true);
         if (shouldNavigate(object)) {
-          await dispatch(pipe(addObjectIntent, chain(NavigationAction.Open, {})));
+          await dispatch(pipe(addObjectIntent, chain(LayoutAction.Open, { part: 'main' })));
         } else {
           await dispatch(addObjectIntent);
         }
@@ -83,7 +91,7 @@ export const CreateObjectDialog = ({
   return (
     // TODO(wittjosiah): The tablist dialog pattern is copied from @dxos/plugin-manager.
     //  Consider factoring it out to the tabs package.
-    <Dialog.Content classNames='p-0 bs-content min-bs-[15rem] max-bs-full md:max-is-[40rem] overflow-hidden'>
+    <Dialog.Content classNames='p-0 bs-content max-bs-full md:max-is-[40rem] overflow-hidden'>
       <div role='none' className='flex justify-between pbs-2 pis-2 pie-2 @md:pbs-4 @md:pis-4 @md:pie-4'>
         <Dialog.Title>{t('create object dialog title')}</Dialog.Title>
         <Dialog.Close asChild>
@@ -92,18 +100,18 @@ export const CreateObjectDialog = ({
           </Button>
         </Dialog.Close>
       </div>
-      <div className='p-4'>
-        <CreateObjectPanel
-          schemas={schemas}
-          spaces={spaces}
-          target={target}
-          typename={typename}
-          name={name}
-          defaultSpaceId={client.spaces.default.id}
-          resolve={resolve}
-          onCreateObject={handleCreateObject}
-        />
-      </div>
+
+      <CreateObjectPanel
+        classNames='p-4'
+        forms={forms}
+        spaces={spaces}
+        target={target}
+        typename={typename}
+        name={name}
+        defaultSpaceId={client.spaces.default.id}
+        resolve={resolve}
+        onCreateObject={handleCreateObject}
+      />
     </Dialog.Content>
   );
 };