@dxos/plugin-space 0.8.4-main.422d1c7879 → 0.8.4-main.43cb759274

package/src/containers/RecordArticle/RecordArticle.tsx

@@ -2,26 +2,33 @@
 // Copyright 2023 DXOS.org
 //
 
-import * as Function from 'effect/Function';
-import * as Option from 'effect/Option';
 import React from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface } from '@dxos/app-toolkit/ui';
-import { Annotation, Obj } from '@dxos/echo';
+import { Obj, Type } from '@dxos/echo';
 import { Card, Input, Panel, ScrollArea, Toolbar, useTranslation } from '@dxos/react-ui';
 
 import { meta } from '#meta';
 
 export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps) => {
   const { t } = useTranslation(meta.id);
-  const icon = Function.pipe(
-    Obj.getSchema(subject),
-    Option.fromNullable,
-    Option.flatMap(Annotation.IconAnnotation.get),
-    Option.map(({ icon }) => icon),
-    Option.getOrElse(() => 'ph--placeholder--regular'),
-  );
+  // Obj.getType fails for database-registered (dynamic) schemas due to DXN mismatch;
+  // fall back to typename query which matches TypeSchema.typename.
+  const db = Obj.getDatabase(subject);
+  const typename = Obj.getTypename(subject);
+  const schema =
+    Obj.getType(subject) ??
+    (typename && db
+      ? db.graph.registry
+          .list()
+          .filter(Type.isType)
+          .find((t) => Type.getTypename(t) === typename)
+      : undefined);
+  const icon =
+    schema && Type.getDatabase(schema) != null
+      ? 'ph--cube--regular'
+      : (Obj.getIcon(subject)?.icon ?? 'ph--circle-dashed--regular');
 
   return (
     <Panel.Root role={role}>
@@ -32,17 +39,17 @@ export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps)
         <ScrollArea.Root orientation='vertical'>
           <ScrollArea.Viewport classNames='p-4 space-y-4'>
             <Card.Root classNames='dx-card-max-width'>
-              <Card.Toolbar>
+              <Card.Header>
                 <Card.Icon icon={icon} />
-                <Card.Title>{Obj.getLabel(subject)}</Card.Title>
-              </Card.Toolbar>
-              <Card.Content>
+                <Card.Title>{Obj.getLabel(subject, { fallback: 'typename' })}</Card.Title>
+              </Card.Header>
+              <Card.Body>
                 <Surface.Surface type={AppSurface.Card} data={{ subject }} limit={1} />
-              </Card.Content>
+              </Card.Body>
             </Card.Root>
 
             {/* TODO(burdon): Only show label if surface exists? */}
-            <div role='none' className='flex flex-col gap-form-gap'>
+            <div className='flex flex-col gap-form-gap'>
               <Input.Root>
                 <Input.Label>{t('related-actions.label')}</Input.Label>
               </Input.Root>

package/src/containers/RelatedArticle/RelatedArticle.tsx

@@ -2,13 +2,11 @@
 // Copyright 2025 DXOS.org
 //
 
-import * as Function from 'effect/Function';
-import * as Option from 'effect/Option';
 import React, { useMemo } from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface, useObjectMenuItems } from '@dxos/app-toolkit/ui';
-import { Annotation, Entity, Obj } from '@dxos/echo';
+import { Entity, Obj } from '@dxos/echo';
 import { Card, Panel, Toolbar, useTranslation } from '@dxos/react-ui';
 import { Masonry } from '@dxos/react-ui-masonry';
 import { Menu } from '@dxos/react-ui-menu';
@@ -46,13 +44,7 @@ export const RelatedArticle = ({ role, companionTo }: RelatedArticleProps) => {
 const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; classNames?: string }) => {
   const { t } = useTranslation(meta.id);
   const data = useMemo(() => ({ subject }), [subject]);
-  const icon = Function.pipe(
-    Entity.getSchema(subject),
-    Option.fromNullable,
-    Option.flatMap(Annotation.IconAnnotation.get),
-    Option.map(({ icon }) => icon),
-    Option.getOrElse(() => 'ph--placeholder--regular'),
-  );
+  const icon = Entity.getIcon(subject)?.icon ?? 'ph--circle-dashed--regular';
 
   // TODO(burdon): BUG: Includes item itself.
   const menuItems = useObjectMenuItems(subject);
@@ -60,9 +52,9 @@ const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; class
   return (
     <Menu.Root>
       <Card.Root classNames={classNames}>
-        <Card.Toolbar>
+        <Card.Header>
           <Card.Icon icon={icon} />
-          <Card.Title>{Entity.getLabel(subject)}</Card.Title>
+          <Card.Title>{Entity.getLabel(subject, { fallback: 'typename' })}</Card.Title>
           <Menu.Trigger asChild disabled={!menuItems?.length}>
             <Toolbar.IconButton
               iconOnly
@@ -72,10 +64,10 @@ const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; class
             />
           </Menu.Trigger>
           <Menu.Content items={menuItems} />
-        </Card.Toolbar>
-        <Card.Content>
+        </Card.Header>
+        <Card.Body>
           <Surface.Surface type={AppSurface.Card} data={data} limit={1} />
-        </Card.Content>
+        </Card.Body>
       </Card.Root>
     </Menu.Root>
   );

package/src/containers/SchemaContainer/SchemaContainer.tsx

@@ -5,7 +5,7 @@
 import React, { useEffect, useState } from 'react';
 
 import { AppSurface } from '@dxos/app-toolkit/ui';
-import { type Type } from '@dxos/echo';
+import { Type } from '@dxos/echo';
 import { type Space } from '@dxos/react-client/echo';
 import { useTranslation } from '@dxos/react-ui';
 import { Settings } from '@dxos/react-ui-form';
@@ -15,24 +15,21 @@ import { meta } from '#meta';
 
 export const SchemaContainer = ({ space }: AppSurface.SpaceArticleProps) => {
   const { t } = useTranslation(meta.id);
-  const schemas = useQuerySpaceSchemas(space);
+  const types = useQuerySpaceTypes(space);
 
   return (
     <Settings.Viewport>
       <Settings.Section title={t('schema-verbose.label')} description={t('schema.description')}>
         <div
-          role='none'
           className={mx([
             'grid md:col-span-2 grid-cols-subgrid gap-trim-sm items-center',
             '*:first:mt-0! *:last:mb-0! px-trim-md py-trim-md',
             'border border-separator rounded-md',
           ])}
         >
-          {schemas.length === 0 && <div className='text-center py-4'>{t('no-schemas-found.message')}</div>}
-          {schemas.map((schema) => (
-            <div role='none' key={schema.id}>
-              {schema.typename}
-            </div>
+          {types.length === 0 && <div className='text-center py-4'>{t('no-schemas-found.message')}</div>}
+          {types.map((type) => (
+            <div key={type.id}>{Type.getTypename(type)}</div>
           ))}
         </div>
       </Settings.Section>
@@ -41,19 +38,17 @@ export const SchemaContainer = ({ space }: AppSurface.SpaceArticleProps) => {
 };
 
 /**
- * Subscribe to and retrieve all schemas from a space's schema registry.
+ * Subscribe to and retrieve all types from a space's registry.
  */
-export const useQuerySpaceSchemas = (space: Space): Type.RuntimeType[] => {
-  const [schemas, setSchemas] = useState<Type.RuntimeType[]>([]);
+export const useQuerySpaceTypes = (space: Space): Type.AnyEntity[] => {
+  const [types, setTypes] = useState<Type.AnyEntity[]>(() => [...space.db.graph.registry.list().filter(Type.isType)]);
 
   useEffect(() => {
-    const query = space.db.schemaRegistry.query();
-    const initialResults = query.runSync();
-    setSchemas(initialResults);
-
-    const unsubscribe = query.subscribe(() => setSchemas(query.results));
-    return () => unsubscribe();
+    setTypes([...space.db.graph.registry.list().filter(Type.isType)]);
+    return space.db.graph.registry.changed.on(() => {
+      setTypes([...space.db.graph.registry.list().filter(Type.isType)]);
+    });
   }, [space]);
 
-  return schemas;
+  return types;
 };

package/src/containers/SpacePresence/SpacePresence.stories.tsx

@@ -9,7 +9,8 @@ import { IdentityDid, PublicKey } from '@dxos/keys';
 import { HaloSpaceMember, SpaceMember } from '@dxos/react-client/echo';
 import { withTheme } from '@dxos/react-ui/testing';
 
-import { translations } from '../../translations';
+import { translations } from '#translations';
+
 import { FullPresence, type Member, type MemberPresenceProps, SmallPresence } from './SpacePresence';
 
 const viewers = (n: number, currentlyAttended = true): Member[] =>

package/src/containers/SpacePresence/SpacePresence.tsx

@@ -71,7 +71,7 @@ export const SpacePresence = ({ object, spaceId }: SpacePresenceProps) => {
     return null;
   }
 
-  const currentObjectViewers = ephemeral.viewersByObject[Obj.getDXN(object).toString()] ?? noViewers;
+  const currentObjectViewers = ephemeral.viewersByObject[Obj.getURI(object)] ?? noViewers;
 
   const membersForObject = spaceMembers
     .filter((member) => memberOnline(member) && memberIsNotSelf(member))

package/src/containers/SpaceRenamePopover/SpaceRenamePopover.tsx

@@ -22,7 +22,7 @@ export const SpaceRenamePopover = ({ space }: { space: Space }) => {
   const { invokePromise } = useOperationInvoker();
 
   const handleDone = useCallback(() => {
-    Obj.change(space.properties, (obj) => {
+    Obj.update(space.properties, (obj) => {
       obj.name = name;
     });
     void invokePromise(LayoutOperation.UpdatePopover, { anchorId: '', state: false });
@@ -30,8 +30,8 @@ export const SpaceRenamePopover = ({ space }: { space: Space }) => {
 
   // TODO(thure): Why does the input value need to be uncontrolled to work?
   return (
-    <div role='none' className='p-2 flex gap-2'>
-      <div role='none' className='flex-1'>
+    <div className='p-2 flex gap-2'>
+      <div className='flex-1'>
         <Input.Root>
           <Input.Label srOnly>{t('space-name.label')}</Input.Label>
           <Input.TextInput

package/src/containers/SpaceSettingsContainer/SpaceSettingsContainer.stories.tsx

@@ -5,13 +5,14 @@
 import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React from 'react';
 
-import { OperationPlugin, RuntimePlugin } from '@dxos/app-framework';
+import { ProcessManagerPlugin } from '@dxos/app-framework';
 import { withPluginManager } from '@dxos/app-framework/testing';
 import { AppSurface } from '@dxos/app-toolkit/ui';
 import { useClientStory, withClientProvider } from '@dxos/react-client/testing';
 import { Loading, withLayout, withTheme } from '@dxos/react-ui/testing';
 
-import { translations } from '../../translations';
+import { translations } from '#translations';
+
 import { SpaceSettingsContainer } from './SpaceSettingsContainer';
 
 const Story = (props: Partial<AppSurface.SpaceArticleProps>) => {
@@ -32,7 +33,7 @@ const meta = {
     withLayout({ layout: 'fullscreen' }),
     withClientProvider({ createIdentity: true, createSpace: true }),
     // TODO(wittjosiah): Try to write story which does not depend on plugin manager.
-    withPluginManager({ plugins: [OperationPlugin(), RuntimePlugin()] }),
+    withPluginManager({ plugins: [ProcessManagerPlugin()] }),
   ],
   parameters: {
     translations,

package/src/containers/SpaceSettingsContainer/SpaceSettingsContainer.tsx

@@ -13,17 +13,7 @@ import { log } from '@dxos/log';
 import { SpaceArchive } from '@dxos/protocols/proto/dxos/client/services';
 import { EdgeReplicationSetting } from '@dxos/protocols/proto/dxos/echo/metadata';
 import { useClient } from '@dxos/react-client';
-import { SpaceState } from '@dxos/react-client/echo';
-import {
-  Button,
-  DropdownMenu,
-  Icon,
-  IconButton,
-  Input,
-  useFileDownload,
-  useMulticastObservable,
-  useTranslation,
-} from '@dxos/react-ui';
+import { Button, Dialog, DropdownMenu, Icon, IconButton, Input, useTranslation } from '@dxos/react-ui';
 import { Form, type FormFieldMap, Settings } from '@dxos/react-ui-form';
 import { HuePicker, IconPicker } from '@dxos/react-ui-pickers';
 
@@ -31,20 +21,13 @@ import { meta } from '#meta';
 import { SpaceOperation } from '#operations';
 import { SpaceCapabilities, SpaceForm } from '#types';
 
-const SpaceFormSchema = SpaceForm.pipe(
-  Schema.extend(
-    Schema.Struct({
-      archived: Schema.Boolean.annotations({ title: 'Archive Space' }),
-    }),
-  ),
-);
+const SpaceFormSchema = SpaceForm;
 
 // TODO(wittjosiah): Handle space migrations here?
 export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps) => {
   const { t } = useTranslation(meta.id);
   const { invokePromise } = useOperationInvoker();
   const client = useClient();
-  const archived = useMulticastObservable(space.state) === SpaceState.SPACE_INACTIVE;
   const [edgeReplication, setEdgeReplication] = useState(
     space.internal.data.edgeReplication === EdgeReplicationSetting.ENABLED,
   );
@@ -69,7 +52,7 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
       }
 
       if (changed['name'] || changed['icon'] || changed['hue']) {
-        Obj.change(space.properties, (obj) => {
+        Obj.update(space.properties, (obj) => {
           if (changed['name'] && newValues.name !== undefined) {
             obj.name = newValues.name;
           }
@@ -81,22 +64,8 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
           }
         });
       }
-
-      if (changed['archived']) {
-        if (newValues.archived && !archived) {
-          void invokePromise(SpaceOperation.Close, { space });
-          const personalSpace = getPersonalSpace(client);
-          if (personalSpace) {
-            void invokePromise(LayoutOperation.SwitchWorkspace, {
-              subject: getSpacePath(personalSpace.id),
-            });
-          }
-        } else if (!newValues.archived && archived) {
-          void invokePromise(SpaceOperation.Open, { space });
-        }
-      }
     },
-    [space, client, archived, invokePromise, toggleEdgeReplication],
+    [space, toggleEdgeReplication],
   );
 
   const defaultValues = useMemo(
@@ -105,9 +74,8 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
       icon: space.properties.icon,
       hue: space.properties.hue,
       edgeReplication,
-      archived,
     }),
-    [space.properties.name, space.properties.icon, space.properties.hue, edgeReplication, archived],
+    [space.properties.name, space.properties.icon, space.properties.hue, edgeReplication],
   );
 
   const personal = isPersonalSpace(space);
@@ -165,37 +133,43 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
           </Settings.Item>
         );
       },
-      archived: personal
-        ? () => null
-        : ({ type, label, getValue, onValueChange }) => {
-            const handleChange = useCallback(() => onValueChange(type, !getValue()), [onValueChange, type, getValue]);
-            return (
-              <Settings.Item title={label} description={t('archive-space.description')}>
-                <Button variant={getValue() ? 'default' : 'destructive'} onClick={handleChange}>
-                  {getValue() ? t('unarchive-space.label') : t('archive-space.label')}
-                </Button>
-              </Settings.Item>
-            );
-          },
     }),
     [t, space, personal],
   );
 
-  const download = useFileDownload();
   const handleBackupBinary = useCallback(async () => {
-    const archive = await space.internal.export({ format: SpaceArchive.Format.BINARY });
-    download(new Blob([archive.contents as Uint8Array<ArrayBuffer>]), archive.filename);
-  }, [space, download]);
+    await invokePromise(SpaceOperation.ExportSpace, { space, format: SpaceArchive.Format.BINARY });
+  }, [space, invokePromise]);
   const handleBackupJson = useCallback(async () => {
-    const archive = await space.internal.export({ format: SpaceArchive.Format.JSON });
-    download(new Blob([archive.contents as Uint8Array<ArrayBuffer>]), archive.filename);
-  }, [space, download]);
+    await invokePromise(SpaceOperation.ExportSpace, { space, format: SpaceArchive.Format.JSON });
+  }, [space, invokePromise]);
 
   const repairs = useCapabilities(SpaceCapabilities.Repair);
   const handleRepair = useCallback(async () => {
     await Promise.all(repairs.map((repair) => repair({ space, isDefault: isPersonalSpace(space) })));
   }, [space, repairs]);
 
+  const [deleteConfirmOpen, setDeleteConfirmOpen] = useState(false);
+  // Wired to an onClick handler: must resolve (never reject) so it can't trigger an unhandled rejection.
+  const handleDelete = useCallback(async () => {
+    try {
+      await invokePromise(SpaceOperation.Delete, { space });
+      setDeleteConfirmOpen(false);
+      const personalSpace = getPersonalSpace(client);
+      if (personalSpace) {
+        void invokePromise(LayoutOperation.SwitchWorkspace, { subject: getSpacePath(personalSpace.id) });
+      }
+    } catch (err) {
+      log.catch(err, { stage: 'delete: invocation rejected', spaceId: space.id });
+      setDeleteConfirmOpen(false);
+      void invokePromise(LayoutOperation.AddToast, {
+        id: `${space.id}-delete-failed`,
+        title: t('delete-space-failed.message'),
+        icon: 'ph--warning--regular',
+      });
+    }
+  }, [space, client, invokePromise, t]);
+
   return (
     <Settings.Viewport>
       <Settings.Section
@@ -249,6 +223,44 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
           <Button onClick={handleRepair}>{t('repair-space.label')}</Button>
         </Settings.Item>
       </Settings.Section>
+
+      <Settings.Section title={t('danger-zone.title')} description={t('danger-zone.description')}>
+        {!personal && (
+          <Settings.Item title={t('delete-space.title')} description={t('delete-space.description')}>
+            <Dialog.Root open={deleteConfirmOpen} onOpenChange={setDeleteConfirmOpen}>
+              <Dialog.Trigger asChild>
+                <Button variant='destructive' data-testid='spaceSettings.deleteSpace'>
+                  {t('delete-space.label')}
+                </Button>
+              </Dialog.Trigger>
+              <Dialog.Portal>
+                <Dialog.Overlay>
+                  <Dialog.Content>
+                    <Dialog.Header>
+                      <Dialog.Title>{t('delete-space-confirm.title')}</Dialog.Title>
+                    </Dialog.Header>
+                    <Dialog.Body>
+                      <Dialog.Description>{t('delete-space-confirm.description')}</Dialog.Description>
+                      <div className='flex justify-end gap-2 mbs-4'>
+                        <Dialog.Close asChild>
+                          <Button>{t('cancel.label')}</Button>
+                        </Dialog.Close>
+                        <Button
+                          variant='destructive'
+                          onClick={handleDelete}
+                          data-testid='spaceSettings.deleteSpaceConfirm'
+                        >
+                          {t('delete-space.label')}
+                        </Button>
+                      </div>
+                    </Dialog.Body>
+                  </Dialog.Content>
+                </Dialog.Overlay>
+              </Dialog.Portal>
+            </Dialog.Root>
+          </Settings.Item>
+        )}
+      </Settings.Section>
     </Settings.Viewport>
   );
 };

package/src/containers/SyncStatus/SyncStatus.stories.tsx

@@ -7,7 +7,8 @@ import { type Meta, type StoryObj } from '@storybook/react-vite';
 import { withClientProvider } from '@dxos/react-client/testing';
 import { withTheme } from '@dxos/react-ui/testing';
 
-import { translations } from '../../translations';
+import { translations } from '#translations';
+
 import { SyncStatusIndicator } from './SyncStatus';
 
 const meta = {

package/src/containers/SyncStatus/SyncStatus.tsx

@@ -5,7 +5,7 @@
 import React, { useEffect, useState } from 'react';
 
 import { log } from '@dxos/log';
-import { StatusBar } from '@dxos/plugin-status-bar';
+import { StatusBar } from '@dxos/plugin-status-bar/components';
 import { EdgeStatus } from '@dxos/protocols/proto/dxos/client/services';
 import { type QueryEdgeStatusResponse } from '@dxos/protocols/proto/dxos/client/services';
 import { useClient } from '@dxos/react-client';
@@ -59,7 +59,13 @@ export const SyncStatusIndicator = ({ state, saved }: { state: SpaceSyncStateMap
     <Popover.Root>
       <Popover.Trigger asChild>
         <StatusBar.Item>
-          <IconButton icon={getIcon(status)} iconOnly label={t(`${status}.label`)} classNames={classNames} />
+          <IconButton
+            variant='ghost'
+            icon={getIcon(status)}
+            iconOnly
+            label={t(`${status}.label`)}
+            classNames={classNames}
+          />
         </StatusBar.Item>
       </Popover.Trigger>
       <Popover.Portal>

package/src/containers/ViewEditor/ViewEditor.tsx

@@ -2,17 +2,15 @@
 // Copyright 2023 DXOS.org
 //
 
-import * as Schema from 'effect/Schema';
 import React, { useCallback, useState } from 'react';
 
 import { useOperationInvoker } from '@dxos/app-framework/ui';
 import { resolveSchemaWithRegistry } from '@dxos/app-toolkit/query';
 import { useTypeOptions } from '@dxos/app-toolkit/ui';
-import { DXN, Filter, JsonSchema, Obj, Query, type QueryAST, Tag, Type } from '@dxos/echo';
-import { type View } from '@dxos/echo';
+import { EID, Filter, Obj, Query, type QueryAST, Scope, Tag, Type, type View } from '@dxos/echo';
 import { type Mutable } from '@dxos/echo/internal';
 import { useClient } from '@dxos/react-client';
-import { getSpace, useQuery } from '@dxos/react-client/echo';
+import { useQuery } from '@dxos/react-client/echo';
 import { useAsyncEffect } from '@dxos/react-ui';
 import { ViewEditor as NaturalViewEditor } from '@dxos/react-ui-form';
 import { ViewModel } from '@dxos/schema';
@@ -24,11 +22,11 @@ export type ViewEditorProps = { view: View.View };
 export const ViewEditor = ({ view }: ViewEditorProps) => {
   const { invokePromise } = useOperationInvoker();
   const client = useClient();
-  const space = getSpace(view);
-  const [schema, setSchema] = useState<Schema.Schema.AnyNoContext>(() => Schema.Struct({}));
-  const tags = useQuery(space?.db, Filter.type(Tag.Tag));
+  const db = Obj.getDatabase(view);
+  const [type, setType] = useState<Type.AnyEntity>();
+  const tags = useQuery(db, Filter.type(Tag.Tag));
   const types = useTypeOptions({
-    space,
+    db,
     annotation: {
       location: ['database', 'runtime'],
       kind: ['user'],
@@ -36,43 +34,47 @@ export const ViewEditor = ({ view }: ViewEditorProps) => {
   });
 
   useAsyncEffect(async () => {
-    if (!view?.query || !space) {
+    if (!view?.query || !db) {
       return;
     }
 
-    const foundSchema = await resolveSchemaWithRegistry(space.db.schemaRegistry, view.query.ast);
-    if (foundSchema && foundSchema !== schema) {
-      setSchema(() => foundSchema);
+    const foundType = await resolveSchemaWithRegistry(db, view.query.ast);
+    if (foundType && foundType !== type) {
+      setType(() => foundType);
     }
-  }, [client, space, view, schema]);
+  }, [client, db, view, type]);
 
   const handleQueryChanged = useCallback(
-    async (newQuery: QueryAST.Query, target?: string) => {
-      if (!view || !space) {
+    async (newQuery: QueryAST.Query, target?: EID.EID) => {
+      if (!view || !db) {
         return;
       }
 
-      const queue = target && DXN.tryParse(target) ? target : undefined;
-      const query = queue ? Query.fromAst(newQuery).from({ queues: [queue] }) : Query.fromAst(newQuery);
-      Obj.change(view, (view) => {
+      const queue = target;
+      const query = queue
+        ? Query.fromAst(newQuery).from([
+            Scope.feed(`dxn:queue:data:${EID.getSpaceId(queue)}:${EID.getEntityId(queue)}`),
+          ])
+        : Query.fromAst(newQuery);
+      Obj.update(view, (view) => {
         view.query.ast = query.ast as Mutable<typeof query.ast>;
       });
-      const newSchema = await resolveSchemaWithRegistry(space.db.schemaRegistry, query.ast);
-      if (!newSchema) {
+      const newType = await resolveSchemaWithRegistry(db, query.ast);
+      if (!newType) {
         return;
       }
 
       const newView = ViewModel.make({
         query,
-        jsonSchema: JsonSchema.toJsonSchema(newSchema),
+        jsonSchema: newType.jsonSchema,
       });
-      Obj.change(view, (view) => {
+      Obj.update(view, (view) => {
         view.projection = Obj.getSnapshot(newView).projection as Mutable<typeof view.projection>;
       });
 
-      setSchema(() => newSchema);
+      setType(() => newType);
     },
-    [view, schema],
+    [view, type],
   );
 
   const handleDelete = useCallback(
@@ -82,21 +84,21 @@ export const ViewEditor = ({ view }: ViewEditorProps) => {
     [invokePromise, view],
   );
 
-  if (!space || !schema) {
+  if (!db || !type) {
     return null;
   }
 
   return (
     <NaturalViewEditor
-      registry={space.db.schemaRegistry}
-      schema={schema}
+      registry={db.graph.registry}
+      type={type}
       view={view}
       mode='tag'
-      db={space.db}
+      db={db}
       tags={tags}
       types={types}
       onQueryChanged={handleQueryChanged}
-      onDelete={Type.isMutable(schema) ? handleDelete : undefined}
+      onDelete={Type.getDatabase(type) != null ? handleDelete : undefined}
     />
   );
 };

package/src/containers/index.ts

@@ -10,13 +10,14 @@ export const CollectionArticle: ComponentType<any> = lazy(() => import('./Collec
 export const CollectionSection: ComponentType<any> = lazy(() => import('./CollectionSection'));
 export const CreateObjectDialog: ComponentType<any> = lazy(() => import('./CreateObjectDialog'));
 export const CreateSpaceDialog: ComponentType<any> = lazy(() => import('./CreateSpaceDialog'));
+export const ImportSpaceDialog: ComponentType<any> = lazy(() => import('./ImportSpaceDialog'));
 export const InlineSyncStatus: ComponentType<any> = lazy(() => import('./InlineSyncStatus'));
 export const JoinDialog: ComponentType<any> = lazy(() => import('./JoinDialog'));
 export const MembersContainer: ComponentType<any> = lazy(() => import('./MembersContainer'));
 export const MenuFooter: ComponentType<any> = lazy(() => import('./MenuFooter'));
 export const ObjectCardStack: ComponentType<any> = lazy(() => import('./ObjectCardStack'));
 export const ObjectProperties: ComponentType<any> = lazy(() => import('./ObjectProperties'));
-export const ObjectRenamePopover: ComponentType<any> = lazy(() => import('./ObjectRenamePopover'));
+export const EntityRenamePopover: ComponentType<any> = lazy(() => import('./EntityRenamePopover'));
 export const RecordArticle: ComponentType<any> = lazy(() => import('./RecordArticle'));
 export const RelatedArticle: ComponentType<any> = lazy(() => import('./RelatedArticle'));
 export const SchemaContainer: ComponentType<any> = lazy(() => import('./SchemaContainer'));

package/src/hooks/useInputSurfaceLookup.tsx

@@ -17,9 +17,16 @@ export const useInputSurfaceLookup = (baseData?: Record<string, any>): FormField
   const pluginManager = usePluginManager();
   return useCallback<FormFieldProvider>(
     ({ schema, prop, fieldProps }) => {
-      const data = { prop, schema, ...baseData };
+      const data = {
+        prop,
+        schema,
+        /** Property Schema AST (`fieldProps.type`). Not spread as React prop `type` — Surface peels `type` for role tokens. */
+        fieldPropertyAst: fieldProps.type,
+        ...baseData,
+      };
+      const { type: _fieldPropertyAstExcluded, ...surfaceFieldProps } = fieldProps as Record<string, any>;
       if (Surface.isAvailable(pluginManager.capabilities, { role: 'form-input', data })) {
-        return <Surface.Surface role='form-input' data={data} {...(fieldProps as Record<string, any>)} />;
+        return <Surface.Surface role='form-input' data={data} {...surfaceFieldProps} />;
       }
     },
     [pluginManager, baseData],