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

package/src/capabilities/react-surface.tsx

@@ -5,15 +5,16 @@
 import * as Effect from 'effect/Effect';
 import * as Option from 'effect/Option';
 import type * as Schema from 'effect/Schema';
+import * as SchemaAST from 'effect/SchemaAST';
 import React, { type ComponentProps, useCallback } from 'react';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { Surface, useAtomCapability, useOperationInvoker, useSettingsState } from '@dxos/app-framework/ui';
+import { RootCollectionAnnotation } from '@dxos/app-toolkit';
 import { AppSurface, useActiveSpace, useTypeOptions } from '@dxos/app-toolkit/ui';
-import { Database, Obj, type Ref } from '@dxos/echo';
-import { Collection, type View } from '@dxos/echo';
+import { Annotation, Collection, Database, Entity, Obj, Type } from '@dxos/echo';
 import { findAnnotation } from '@dxos/effect';
-import { type Space, SpaceState, getSpace, isSpace, useSpace, useSpaces } from '@dxos/react-client/echo';
+import { type Space, SpaceState, getSpace, isSpace, useSpaces } from '@dxos/react-client/echo';
 import { Input } from '@dxos/react-ui';
 import { type FormFieldComponentProps, SelectField } from '@dxos/react-ui-form';
 import { HuePicker, IconPicker } from '@dxos/react-ui-pickers';
@@ -25,13 +26,14 @@ import {
   CollectionSection,
   CreateObjectDialog,
   CreateSpaceDialog,
+  ImportSpaceDialog,
   InlineSyncStatus,
   JoinDialog,
   MembersContainer,
   MenuFooter,
+  EntityRenamePopover,
   ObjectCardStack,
   ObjectProperties,
-  ObjectRenamePopover,
   RecordArticle,
   RelatedArticle,
   SchemaContainer,
@@ -56,8 +58,9 @@ import {
 import {
   CREATE_OBJECT_DIALOG,
   CREATE_SPACE_DIALOG,
+  IMPORT_SPACE_DIALOG,
   JOIN_DIALOG,
-  OBJECT_RENAME_POPOVER,
+  ENTITY_RENAME_POPOVER,
   SPACE_RENAME_POPOVER,
 } from '../constants';
 
@@ -69,19 +72,19 @@ export default Capability.makeModule(
   Effect.fnUntraced(function* ({ createInvitationUrl }: ReactSurfaceOptions) {
     return Capability.contributes(Capabilities.ReactSurface, [
       Surface.create({
-        id: 'collection-fallback',
-        position: 'fallback',
+        id: 'collectionFallback',
+        position: 'last',
         filter: AppSurface.object(AppSurface.Article, Collection.Collection),
         component: ({ data }) => <CollectionArticle attendableId={data.attendableId} subject={data.subject} />,
       }),
       Surface.create({
-        id: 'record-article',
-        position: 'fallback',
+        id: 'recordArticle',
+        position: 'last',
         filter: AppSurface.subject(AppSurface.Article, Obj.isObject),
         component: ({ data }) => <RecordArticle subject={data.subject} />,
       }),
       Surface.create({
-        id: 'plugin-settings',
+        id: 'pluginSettings',
         filter: AppSurface.settings(AppSurface.Article, meta.id),
         component: ({ data: { subject } }) => {
           const { settings, updateSettings } = useSettingsState<Settings.Settings>(subject.atom);
@@ -98,7 +101,7 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'companion.object-properties',
+        id: 'companion.objectProperties',
         filter: AppSurface.allOf(
           AppSurface.literal(AppSurface.Article, 'settings'),
           AppSurface.companion(AppSurface.Article),
@@ -114,7 +117,7 @@ export default Capability.makeModule(
         component: ({ data, role }) => <RelatedArticle role={role} companionTo={data.companionTo} />,
       }),
       Surface.create({
-        id: 'space-settings-properties',
+        id: 'spaceSettingsProperties',
         filter: AppSurface.literal(AppSurface.Article, `${meta.id}.general`),
         component: ({ ref }) => {
           const space = useActiveSpace();
@@ -126,8 +129,8 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'space-settings-members',
-        position: 'hoist',
+        id: 'spaceSettingsMembers',
+        position: 'first',
         filter: AppSurface.literal(AppSurface.Article, `${meta.id}.members`),
         component: () => {
           const space = useActiveSpace();
@@ -139,7 +142,7 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'space-settings-schema',
+        id: 'spaceSettingsSchema',
         filter: AppSurface.literal(AppSurface.Article, `${meta.id}.schema`),
         component: () => {
           const space = useActiveSpace();
@@ -151,31 +154,40 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'selected-objects',
+        id: 'selectedObjects',
         role: 'article',
-        filter: (
-          data,
-        ): data is { companionTo: Obj.OfShape<{ view: Ref.Ref<View.View> }>; subject: 'selected-objects' } => {
+        filter: (data): data is { companionTo: Obj.Unknown; subject: 'selected-objects' } => {
           if (data.subject !== 'selected-objects' || !Obj.isObject(data.companionTo)) {
             return false;
           }
 
-          // TODO(burdon): Check companionTo.view.target is valid.
-          const schema = Obj.getSchema(data.companionTo);
-          return Option.fromNullable(schema).pipe(
-            Option.flatMap((schema) => ViewAnnotation.get(schema)),
-            Option.getOrElse(() => false),
-          );
+          const type = Obj.getType(data.companionTo);
+          const path = type
+            ? Option.getOrElse(ViewAnnotation.get(Type.getSchema(type)), () => [] as readonly string[])
+            : [];
+          const viewTarget = path.length > 0 ? ViewAnnotation.tryGetTargetAlongPath(data.companionTo, path) : undefined;
+          return !!viewTarget;
         },
         // TODO(burdon): Replace with mosaic.
-        component: ({ data, ref }) => (
-          <ObjectCardStack
-            key={Obj.getDXN(data.companionTo).toString()}
-            objectId={Obj.getDXN(data.companionTo).toString()}
-            view={data.companionTo.view.target!}
-            ref={ref}
-          />
-        ),
+        component: ({ data, ref }) => {
+          const type = Obj.getType(data.companionTo);
+          const path = type
+            ? Option.getOrElse(ViewAnnotation.get(Type.getSchema(type)), () => [] as readonly string[])
+            : [];
+          const view = path.length > 0 ? ViewAnnotation.tryGetTargetAlongPath(data.companionTo, path) : undefined;
+          if (!view) {
+            return null;
+          }
+
+          return (
+            <ObjectCardStack
+              key={Obj.getURI(data.companionTo)}
+              objectId={Obj.getURI(data.companionTo)}
+              view={view}
+              ref={ref}
+            />
+          );
+        },
       }),
       Surface.create({
         id: JOIN_DIALOG,
@@ -187,6 +199,11 @@ export default Capability.makeModule(
         filter: AppSurface.component(AppSurface.Dialog, CREATE_SPACE_DIALOG),
         component: () => <CreateSpaceDialog />,
       }),
+      Surface.create({
+        id: IMPORT_SPACE_DIALOG,
+        filter: AppSurface.component(AppSurface.Dialog, IMPORT_SPACE_DIALOG),
+        component: () => <ImportSpaceDialog />,
+      }),
       Surface.create({
         id: CREATE_OBJECT_DIALOG,
         filter: AppSurface.component<ComponentProps<typeof CreateObjectDialog>>(
@@ -196,16 +213,21 @@ export default Capability.makeModule(
         component: ({ data }) => <CreateObjectDialog {...data.props} />,
       }),
       Surface.create({
-        id: 'create-initial-space-form-[hue]',
+        id: 'createInitialSpaceFormHue',
         role: 'form-input',
-        filter: (data): data is { prop: string; schema: Schema.Schema<any> } => {
+        filter: (data): data is { prop: string; schema: Schema.Schema<any>; fieldPropertyAst?: SchemaAST.AST } => {
           const annotation = findAnnotation<boolean>((data.schema as Schema.Schema.All).ast, HueAnnotationId);
           return !!annotation;
         },
-        component: ({ data: _, ...inputProps }) => {
-          const { label, readonly, type, getValue, onValueChange } = inputProps as any as FormFieldComponentProps;
-          const handleChange = useCallback((nextHue: string) => onValueChange(type, nextHue), [onValueChange]);
-          const handleReset = useCallback(() => onValueChange(type, undefined), [onValueChange]);
+        component: ({ data, ...inputProps }) => {
+          const ast = data.fieldPropertyAst;
+          if (!ast) {
+            return null;
+          }
+
+          const { label, readonly, getValue, onValueChange } = inputProps as any as FormFieldComponentProps;
+          const handleChange = useCallback((nextHue: string) => onValueChange(ast, nextHue), [ast, onValueChange]);
+          const handleReset = useCallback(() => onValueChange(ast, undefined), [ast, onValueChange]);
           return (
             <Input.Root>
               <Input.Label>{label}</Input.Label>
@@ -215,16 +237,21 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'create-initial-space-form-[icon]',
+        id: 'createInitialSpaceFormIcon',
         role: 'form-input',
-        filter: (data): data is { prop: string; schema: Schema.Schema<any> } => {
+        filter: (data): data is { prop: string; schema: Schema.Schema<any>; fieldPropertyAst?: SchemaAST.AST } => {
           const annotation = findAnnotation<boolean>((data.schema as Schema.Schema.All).ast, IconAnnotationId);
           return !!annotation;
         },
-        component: ({ data: _, ...inputProps }) => {
-          const { label, readonly, type, getValue, onValueChange } = inputProps as any as FormFieldComponentProps;
-          const handleChange = useCallback((nextIcon: string) => onValueChange(type, nextIcon), [onValueChange]);
-          const handleReset = useCallback(() => onValueChange(type, undefined), [onValueChange]);
+        component: ({ data, ...inputProps }) => {
+          const ast = data.fieldPropertyAst;
+          if (!ast) {
+            return null;
+          }
+
+          const { label, readonly, getValue, onValueChange } = inputProps as any as FormFieldComponentProps;
+          const handleChange = useCallback((nextIcon: string) => onValueChange(ast, nextIcon), [ast, onValueChange]);
+          const handleReset = useCallback(() => onValueChange(ast, undefined), [ast, onValueChange]);
           return (
             <Input.Root>
               <Input.Label>{label}</Input.Label>
@@ -239,7 +266,7 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'typename-form-input',
+        id: 'typenameFormInput',
         role: 'form-input',
         filter: (
           data,
@@ -247,6 +274,7 @@ export default Capability.makeModule(
           prop: string;
           schema: Schema.Schema.Any;
           target: Database.Database | Collection.Collection | undefined;
+          fieldPropertyAst?: SchemaAST.AST;
         } => {
           if (data.prop !== 'typename') {
             return false;
@@ -255,32 +283,42 @@ export default Capability.makeModule(
           const annotation = findAnnotation((data.schema as Schema.Schema.All).ast, TypeInputOptionsAnnotationId);
           return !!annotation;
         },
-        component: ({ data: { schema, target }, ...inputProps }) => {
-          const props = inputProps as any as FormFieldComponentProps;
+        component: ({ data: { schema, target, fieldPropertyAst }, ...inputProps }) => {
+          const ast = fieldPropertyAst;
+          if (!ast) {
+            return null;
+          }
+
+          const props = { ...inputProps, type: ast } as any as FormFieldComponentProps;
           const db = Database.isDatabase(target) ? target : target && Obj.getDatabase(target);
-          const space = useSpace(db?.spaceId);
           const annotation = findAnnotation<TypeInputOptions>(schema.ast, TypeInputOptionsAnnotationId)!;
-          const options = useTypeOptions({ space, annotation });
+          const options = useTypeOptions({ db, annotation });
 
           return <SelectField {...props} options={options} />;
         },
       }),
       Surface.create({
-        id: 'object-properties',
+        id: 'objectProperties',
         role: 'object-properties',
-        filter: (data): data is { subject: { view: Ref.Ref<View.View> } } => {
+        filter: (data): data is { subject: Obj.Unknown } => {
           if (!Obj.isObject(data.subject)) {
             return false;
           }
 
-          const schema = Obj.getSchema(data.subject);
-          return Option.fromNullable(schema).pipe(
-            Option.flatMap((schema) => ViewAnnotation.get(schema)),
-            Option.getOrElse(() => false),
-          );
+          const type = Obj.getType(data.subject);
+          const path = type
+            ? Option.getOrElse(ViewAnnotation.get(Type.getSchema(type)), () => [] as readonly string[])
+            : [];
+          const viewTarget = path.length > 0 ? ViewAnnotation.tryGetTargetAlongPath(data.subject, path) : undefined;
+          return !!viewTarget;
         },
         component: ({ data }) => {
-          const view = data.subject.view.target;
+          const type = Obj.getType(data.subject);
+          const path = type
+            ? Option.getOrElse(ViewAnnotation.get(Type.getSchema(type)), () => [] as readonly string[])
+            : [];
+          const view = path.length > 0 ? ViewAnnotation.tryGetTargetAlongPath(data.subject, path) : undefined;
+
           if (!view) {
             return null;
           }
@@ -295,19 +333,19 @@ export default Capability.makeModule(
         component: ({ data }) => <SpaceRenamePopover space={data.props} />,
       }),
       Surface.create({
-        id: OBJECT_RENAME_POPOVER,
+        id: ENTITY_RENAME_POPOVER,
         role: 'popover',
-        filter: (data): data is { props: Obj.Unknown } =>
-          data.component === OBJECT_RENAME_POPOVER && Obj.isObject(data.props),
-        component: ({ data }) => <ObjectRenamePopover object={data.props} />,
+        filter: (data): data is { props: Entity.Unknown } =>
+          data.component === ENTITY_RENAME_POPOVER && Entity.isEntity(data.props),
+        component: ({ data }) => <EntityRenamePopover entity={data.props} />,
       }),
       Surface.create({
-        id: 'menu-footer',
+        id: 'menuFooter',
         filter: AppSurface.subject(AppSurface.MenuFooter, Obj.isObject),
         component: ({ data }) => <MenuFooter object={data.subject} />,
       }),
       Surface.create({
-        id: 'navtree-presence',
+        id: 'navtreePresence',
         role: 'navtree-item-end',
         filter: (data): data is { id: string; subject: Obj.Unknown; open?: boolean } =>
           typeof data.id === 'string' && Obj.isObject(data.subject),
@@ -318,29 +356,29 @@ export default Capability.makeModule(
       }),
       // TODO(wittjosiah): Attention glyph for non-echo items should be handled elsewhere.
       Surface.create({
-        id: 'navtree-presence-fallback',
+        id: 'navtreePresenceFallback',
         role: 'navtree-item-end',
-        position: 'fallback',
+        position: 'last',
         filter: (data): data is { id: string; open?: boolean } => typeof data.id === 'string',
         component: ({ data }) => <SmallPresenceLive id={data.id} open={data.open} />,
       }),
       // TODO(wittjosiah): Broken?
       Surface.create({
-        id: 'navtree-sync-status',
+        id: 'navtreeSyncStatus',
         role: 'navtree-item-end',
         filter: (data): data is { subject: Space; open?: boolean } => isSpace(data.subject),
         component: ({ data }) => <InlineSyncStatus space={data.subject} open={data.open} />,
       }),
       Surface.create({
-        id: 'navbar-presence',
+        id: 'navbarPresence',
         role: 'navbar-end',
-        position: 'hoist',
+        position: 'first',
         filter: (data): data is { subject: Space | Obj.Unknown } => isSpace(data.subject) || Obj.isObject(data.subject),
         component: ({ data }) => {
           const space = isSpace(data.subject) ? data.subject : getSpace(data.subject);
           const object = isSpace(data.subject)
             ? data.subject.state.get() === SpaceState.SPACE_READY
-              ? (space?.properties[Collection.Collection.typename]?.target as Collection.Collection)
+              ? space && Annotation.get(space.properties, RootCollectionAnnotation).pipe(Option.getOrUndefined)?.target
               : undefined
             : data.subject;
 
@@ -348,12 +386,12 @@ export default Capability.makeModule(
         },
       }),
       Surface.create({
-        id: 'collection-section',
+        id: 'collectionSection',
         filter: AppSurface.object(AppSurface.Section, Collection.Collection),
         component: ({ data }) => <CollectionSection subject={data.subject} />,
       }),
       Surface.create({
-        id: 'status',
+        id: 'syncStatus',
         role: 'status-indicator',
         component: () => <SyncStatus />,
       }),

package/src/capabilities/repair.ts

@@ -3,9 +3,11 @@
 //
 
 import * as Effect from 'effect/Effect';
+import * as Option from 'effect/Option';
 
 import { Capability } from '@dxos/app-framework';
-import { Collection, Obj, Ref } from '@dxos/echo';
+import { RootCollectionAnnotation } from '@dxos/app-toolkit';
+import { Annotation, Collection, Obj, Ref } from '@dxos/echo';
 import { type Space } from '@dxos/react-client/echo';
 
 import { SpaceCapabilities } from '#types';
@@ -22,7 +24,8 @@ export default Capability.makeModule(() =>
  * Remove all existing query collections from the root collection.
  */
 const removeQueryCollections = async (space: Space) => {
-  const rootCollection: Collection.Collection = await space.properties[Collection.Collection.typename]?.load();
+  const rootCollectionRef = Annotation.get(space.properties, RootCollectionAnnotation).pipe(Option.getOrUndefined);
+  const rootCollection: Collection.Collection | undefined = await rootCollectionRef?.load();
   if (!rootCollection) {
     return;
   }
@@ -33,7 +36,7 @@ const removeQueryCollections = async (space: Space) => {
     return;
   }
 
-  Obj.change(rootCollection, (rootCollection) => {
+  Obj.update(rootCollection, (rootCollection) => {
     rootCollection.objects = objects
       .filter((object) => Obj.getTypename(object) !== 'org.dxos.type.queryCollection')
       .map((object) => Ref.make(object));

package/src/capabilities/spaces-ready.ts

@@ -9,19 +9,22 @@ import { Capabilities, Capability } from '@dxos/app-framework';
 import {
   AppCapabilities,
   LayoutOperation,
+  RootCollectionAnnotation,
   getSpacePath,
   resolvePersonalSpace,
   setPersonalSpace,
 } from '@dxos/app-toolkit';
 import { SubscriptionList } from '@dxos/async';
-import { Filter, Obj } from '@dxos/echo';
+import { Annotation, Collection, Filter, Obj, Type } from '@dxos/echo';
+import { SPACE_ID_LENGTH, parseId } from '@dxos/keys';
 import { log } from '@dxos/log';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
-import { ClientCapabilities } from '@dxos/plugin-client/types';
+import { MigrationVersionAnnotation, Migrations } from '@dxos/migrations';
+import { AttentionCapabilities } from '@dxos/plugin-attention';
+import { ClientCapabilities } from '@dxos/plugin-client';
 import { Graph } from '@dxos/plugin-graph';
 import { EdgeReplicationSetting } from '@dxos/protocols/proto/dxos/echo/metadata';
 import { PublicKey } from '@dxos/react-client';
-import { type Space, SPACE_ID_LENGTH, SpaceState, parseId } from '@dxos/react-client/echo';
+import { type Space, SpaceState } from '@dxos/react-client/echo';
 import { Expando } from '@dxos/schema';
 import { ComplexMap, reduceGroupBy } from '@dxos/util';
 
@@ -91,14 +94,13 @@ export default Capability.makeModule(
     if (resolved) {
       void initializePersonalSpace(resolved.space, resolved);
     } else {
-      subscriptions.add(
-        client.spaces.subscribe(() => {
-          const resolved = resolvePersonalSpace(client);
-          if (resolved) {
-            void initializePersonalSpace(resolved.space, resolved);
-          }
-        }).unsubscribe,
-      );
+      const personalSpaceSub = client.spaces.subscribe(() => {
+        const resolved = resolvePersonalSpace(client);
+        if (resolved) {
+          void initializePersonalSpace(resolved.space, resolved);
+        }
+      });
+      subscriptions.add(() => personalSpaceSub.unsubscribe());
     }
 
     //
@@ -142,39 +144,55 @@ export default Capability.makeModule(
     subscriptions.add(() => lastActiveCleanup?.());
 
     // Cache space names.
-    subscriptions.add(
-      client.spaces.subscribe(async (spaces) => {
-        // TODO(wittjosiah): Remove. This is a hack to be able to migrate the personal space properties.
-        const personalSpaceForMigration = resolvePersonalSpace(client);
-        if (
-          personalSpaceForMigration?.space &&
-          personalSpaceForMigration.space.state.get() === SpaceState.SPACE_REQUIRES_MIGRATION
-        ) {
-          await personalSpaceForMigration.space.internal.migrate();
-        }
+    const spaceNamesSub = client.spaces.subscribe(async (spaces) => {
+      // TODO(wittjosiah): Remove. This is a hack to be able to migrate the personal space properties.
+      const personalSpaceForMigration = resolvePersonalSpace(client);
+      if (
+        personalSpaceForMigration?.space &&
+        personalSpaceForMigration.space.state.get() === SpaceState.SPACE_REQUIRES_MIGRATION
+      ) {
+        await personalSpaceForMigration.space.internal.migrate();
+      }
 
-        spaces
-          .filter((space) => space.state.get() === SpaceState.SPACE_READY)
-          .forEach((space) => {
-            const updateSpaceName = () => {
-              const name = space.properties.name;
-              if (!name) {
-                registry.update(stateAtom, (current) => {
-                  const { [space.id]: _, ...rest } = current.spaceNames;
-                  return { ...current, spaceNames: rest };
-                });
-              } else {
-                registry.update(stateAtom, (current) => ({
-                  ...current,
-                  spaceNames: { ...current.spaceNames, [space.id]: name },
-                }));
-              }
-            };
-            updateSpaceName();
-            subscriptions.add(Obj.subscribe(space.properties, updateSpaceName));
-          });
-      }).unsubscribe,
-    );
+      spaces
+        .filter((space) => space.state.get() === SpaceState.SPACE_READY)
+        .forEach((space) => {
+          if (Option.isNone(Annotation.get(space.properties, RootCollectionAnnotation))) {
+            const legacyRef = (space.properties as any)[Type.getTypename(Collection.Collection)];
+            if (legacyRef) {
+              Obj.update(space.properties, (properties) => {
+                Annotation.set(properties, RootCollectionAnnotation, legacyRef);
+              });
+            }
+          }
+          if (Migrations.namespace && Option.isNone(Annotation.get(space.properties, MigrationVersionAnnotation))) {
+            const legacyVersion = (space.properties as any)[`${Migrations.namespace}.version`];
+            if (typeof legacyVersion === 'string') {
+              Obj.update(space.properties, (properties) => {
+                Annotation.set(properties, MigrationVersionAnnotation, legacyVersion);
+              });
+            }
+          }
+
+          const updateSpaceName = () => {
+            const name = space.properties.name;
+            if (!name) {
+              registry.update(stateAtom, (current) => {
+                const { [space.id]: _, ...rest } = current.spaceNames;
+                return { ...current, spaceNames: rest };
+              });
+            } else {
+              registry.update(stateAtom, (current) => ({
+                ...current,
+                spaceNames: { ...current.spaceNames, [space.id]: name },
+              }));
+            }
+          };
+          updateSpaceName();
+          subscriptions.add(Obj.subscribe(space.properties, updateSpaceName));
+        });
+    });
+    subscriptions.add(() => spaceNamesSub.unsubscribe());
 
     // Broadcast active node to other peers in the space - subscribe to both layout and attention.
     let broadcastCleanup: (() => void) | undefined;
@@ -256,56 +274,55 @@ export default Capability.makeModule(
     subscriptions.add(() => broadcastCleanup?.());
 
     // Listen for active nodes from other peers in the space.
-    subscriptions.add(
-      client.spaces.subscribe((spaces) => {
-        spaceSubscriptions.clear();
-        spaces.forEach((space) => {
-          spaceSubscriptions.add(
-            space.listen('viewing', (message) => {
-              const { added, removed, attended } = message.payload;
-
-              const identityKey = PublicKey.safeFrom(message.payload.identityKey);
-              const currentIdentity = client.halo.identity.get();
-              if (
-                identityKey &&
-                !currentIdentity?.identityKey.equals(identityKey) &&
-                Array.isArray(added) &&
-                Array.isArray(removed)
-              ) {
-                // TODO(wittjosiah): Stop using (Complex)Map inside reactive object.
-                registry.update(ephemeralAtom, (ephemeral) => {
-                  added.forEach((id) => {
-                    if (typeof id === 'string') {
-                      if (!(id in ephemeral.viewersByObject)) {
-                        ephemeral.viewersByObject[id] = new ComplexMap(PublicKey.hash);
-                      }
-                      ephemeral.viewersByObject[id]!.set(identityKey, {
-                        lastSeen: Date.now(),
-                        currentlyAttended: new Set(attended).has(id),
-                      });
-                      if (!ephemeral.viewersByIdentity.has(identityKey)) {
-                        ephemeral.viewersByIdentity.set(identityKey, new Set());
-                      }
-                      ephemeral.viewersByIdentity.get(identityKey)!.add(id);
+    const viewingSub = client.spaces.subscribe((spaces) => {
+      spaceSubscriptions.clear();
+      spaces.forEach((space) => {
+        spaceSubscriptions.add(
+          space.listen('viewing', (message) => {
+            const { added, removed, attended } = message.payload;
+
+            const identityKey = PublicKey.safeFrom(message.payload.identityKey);
+            const currentIdentity = client.halo.identity.get();
+            if (
+              identityKey &&
+              !currentIdentity?.identityKey.equals(identityKey) &&
+              Array.isArray(added) &&
+              Array.isArray(removed)
+            ) {
+              // TODO(wittjosiah): Stop using (Complex)Map inside reactive object.
+              registry.update(ephemeralAtom, (ephemeral) => {
+                added.forEach((id) => {
+                  if (typeof id === 'string') {
+                    if (!(id in ephemeral.viewersByObject)) {
+                      ephemeral.viewersByObject[id] = new ComplexMap(PublicKey.hash);
                     }
-                  });
-
-                  removed.forEach((id) => {
-                    if (typeof id === 'string') {
-                      ephemeral.viewersByObject[id]?.delete(identityKey);
-                      ephemeral.viewersByIdentity.get(identityKey)?.delete(id);
-                      // It's okay for these to be empty sets/maps, reduces churn.
+                    ephemeral.viewersByObject[id]!.set(identityKey, {
+                      lastSeen: Date.now(),
+                      currentlyAttended: new Set(attended).has(id),
+                    });
+                    if (!ephemeral.viewersByIdentity.has(identityKey)) {
+                      ephemeral.viewersByIdentity.set(identityKey, new Set());
                     }
-                  });
+                    ephemeral.viewersByIdentity.get(identityKey)!.add(id);
+                  }
+                });
 
-                  return { ...ephemeral };
+                removed.forEach((id) => {
+                  if (typeof id === 'string') {
+                    ephemeral.viewersByObject[id]?.delete(identityKey);
+                    ephemeral.viewersByIdentity.get(identityKey)?.delete(id);
+                    // It's okay for these to be empty sets/maps, reduces churn.
+                  }
                 });
-              }
-            }),
-          );
-        });
-      }).unsubscribe,
-    );
+
+                return { ...ephemeral };
+              });
+            }
+          }),
+        );
+      });
+    });
+    subscriptions.add(() => viewingSub.unsubscribe());
 
     // Enable edge replication for all spaces.
     try {