@dxos/plugin-space 0.9.0 → 0.9.1-main.c7dcc2e112

package/src/containers/RecordArticle/RecordArticle.tsx

@@ -2,17 +2,22 @@
 // Copyright 2023 DXOS.org
 //
 
-import React from 'react';
+import React, { useMemo } from 'react';
 
 import { Surface } from '@dxos/app-framework/ui';
-import { AppSurface } from '@dxos/app-toolkit/ui';
-import { Obj, Type } from '@dxos/echo';
-import { Card, Input, Panel, ScrollArea, Toolbar, useTranslation } from '@dxos/react-ui';
+import { AppSurface, useObjectMenuItems } from '@dxos/app-toolkit/ui';
+import { Entity, Obj, Type } from '@dxos/echo';
+import { Card, Icon, IconButton, Input, Panel, ScrollArea, Toolbar, useTranslation } from '@dxos/react-ui';
+import { Masonry } from '@dxos/react-ui-masonry';
+import { Menu } from '@dxos/react-ui-menu';
+import { mx } from '@dxos/ui-theme';
 
+import { useRelatedObjects } from '#hooks';
 import { meta } from '#meta';
+import { Prompts } from '#types';
 
 export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   // 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);
@@ -30,6 +35,9 @@ export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps)
       ? 'ph--cube--regular'
       : (Obj.getIcon(subject)?.icon ?? 'ph--circle-dashed--regular');
 
+  const related = useRelatedObjects(db, subject, { references: true, relations: true });
+  const singleColumn = related.length === 1;
+
   return (
     <Panel.Root role={role}>
       <Panel.Toolbar asChild>
@@ -40,11 +48,13 @@ export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps)
           <ScrollArea.Viewport classNames='p-4 space-y-4'>
             <Card.Root classNames='dx-card-max-width'>
               <Card.Header>
-                <Card.Icon icon={icon} />
+                <Card.Block>
+                  <Icon icon={icon} />
+                </Card.Block>
                 <Card.Title>{Obj.getLabel(subject, { fallback: 'typename' })}</Card.Title>
               </Card.Header>
               <Card.Body>
-                <Surface.Surface type={AppSurface.Card} data={{ subject }} limit={1} />
+                <Surface.Surface type={AppSurface.CardContent} data={{ subject }} limit={1} />
               </Card.Body>
             </Card.Root>
 
@@ -53,11 +63,60 @@ export const RecordArticle = ({ role, subject }: AppSurface.ObjectArticleProps)
               <Input.Root>
                 <Input.Label>{t('related-actions.label')}</Input.Label>
               </Input.Root>
-              <Surface.Surface role='prompts' data={{ subject }} limit={1} />
+              <Surface.Surface type={Prompts} data={{ subject, attendableId: subject.id }} limit={1} />
             </div>
+
+            {related.length > 0 && (
+              <div
+                className={mx('dx-expander flex flex-col gap-form-gap', singleColumn ? 'dx-card-max-width' : 'w-full')}
+              >
+                <Input.Root>
+                  <Input.Label>{t('related-objects.label')}</Input.Label>
+                </Input.Root>
+                <Masonry.Root Tile={ObjectCard} columns={singleColumn ? 1 : undefined}>
+                  <Masonry.Content>
+                    <Masonry.Viewport items={related} />
+                  </Masonry.Content>
+                </Masonry.Root>
+              </div>
+            )}
           </ScrollArea.Viewport>
         </ScrollArea.Root>
       </Panel.Content>
     </Panel.Root>
   );
 };
+
+const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; classNames?: string }) => {
+  const { t } = useTranslation(meta.profile.key);
+  const data = useMemo(() => ({ subject }), [subject]);
+  const icon = Entity.getIcon(subject)?.icon ?? 'ph--circle-dashed--regular';
+  const menuItems = useObjectMenuItems(subject);
+
+  return (
+    <Menu.Root>
+      <Card.Root classNames={classNames}>
+        <Card.Header>
+          <Card.Block>
+            <Icon icon={icon} />
+          </Card.Block>
+          <Card.Title>{Entity.getLabel(subject, { fallback: 'typename' })}</Card.Title>
+          <Card.Block end>
+            <Menu.Trigger asChild disabled={!menuItems?.length}>
+              <IconButton
+                iconOnly
+                variant='ghost'
+                icon='ph--dots-three-vertical--regular'
+                label={t('more-actions.label')}
+              />
+            </Menu.Trigger>
+            <Menu.Content items={menuItems} />
+          </Card.Block>
+        </Card.Header>
+        <Card.Body>
+          <Surface.Surface type={AppSurface.CardContent} data={data} limit={1} />
+        </Card.Body>
+      </Card.Root>
+    </Menu.Root>
+  );
+};

package/src/containers/RelatedArticle/RelatedArticle.tsx

@@ -7,7 +7,7 @@ import React, { useMemo } from 'react';
 import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface, useObjectMenuItems } from '@dxos/app-toolkit/ui';
 import { Entity, Obj } from '@dxos/echo';
-import { Card, Panel, Toolbar, useTranslation } from '@dxos/react-ui';
+import { Card, Icon, IconButton, Panel, Toolbar, useTranslation } from '@dxos/react-ui';
 import { Masonry } from '@dxos/react-ui-masonry';
 import { Menu } from '@dxos/react-ui-menu';
 
@@ -42,7 +42,7 @@ export const RelatedArticle = ({ role, companionTo }: RelatedArticleProps) => {
 
 /** Masonry tile renderer for a related entity. */
 const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; classNames?: string }) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const data = useMemo(() => ({ subject }), [subject]);
   const icon = Entity.getIcon(subject)?.icon ?? 'ph--circle-dashed--regular';
 
@@ -53,20 +53,24 @@ const ObjectCard = ({ data: subject, classNames }: { data: Entity.Unknown; class
     <Menu.Root>
       <Card.Root classNames={classNames}>
         <Card.Header>
-          <Card.Icon icon={icon} />
+          <Card.Block>
+            <Icon icon={icon} />
+          </Card.Block>
           <Card.Title>{Entity.getLabel(subject, { fallback: 'typename' })}</Card.Title>
-          <Menu.Trigger asChild disabled={!menuItems?.length}>
-            <Toolbar.IconButton
-              iconOnly
-              variant='ghost'
-              icon='ph--dots-three-vertical--regular'
-              label={t('more-actions.label')}
-            />
-          </Menu.Trigger>
-          <Menu.Content items={menuItems} />
+          <Card.Block end>
+            <Menu.Trigger asChild disabled={!menuItems?.length}>
+              <IconButton
+                iconOnly
+                variant='ghost'
+                icon='ph--dots-three-vertical--regular'
+                label={t('more-actions.label')}
+              />
+            </Menu.Trigger>
+            <Menu.Content items={menuItems} />
+          </Card.Block>
         </Card.Header>
         <Card.Body>
-          <Surface.Surface type={AppSurface.Card} data={data} limit={1} />
+          <Surface.Surface type={AppSurface.CardContent} data={data} limit={1} />
         </Card.Body>
       </Card.Root>
     </Menu.Root>

package/src/containers/RenamePopover/RenamePopover.tsx

@@ -0,0 +1,112 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+
+import { useOperationInvoker } from '@dxos/app-framework/ui';
+import { LayoutOperation } from '@dxos/app-toolkit';
+import { Entity, Obj } from '@dxos/echo';
+import { log } from '@dxos/log';
+import { type Space, isSpace } from '@dxos/react-client/echo';
+import { Input, useTranslation } from '@dxos/react-ui';
+
+import { meta } from '#meta';
+
+export type RenameSubject = Space | Entity.Unknown;
+
+const getName = (subject: RenameSubject): string =>
+  (isSpace(subject) ? subject.properties.name : Entity.getLabel(subject)) ?? '';
+
+const setName = (subject: RenameSubject, name: string): void => {
+  if (isSpace(subject)) {
+    Obj.update(subject.properties, (properties) => {
+      properties.name = name;
+    });
+  } else {
+    Entity.update(subject, () => Entity.setLabel(subject, name));
+  }
+};
+
+export type RenamePopoverProps = { subject: RenameSubject };
+
+/**
+ * Inline rename popover anchored to a navtree row. Commits on Enter or when dismissed; Escape cancels.
+ */
+export const RenamePopover = ({ subject }: RenamePopoverProps) => {
+  const { t } = useTranslation(meta.profile.key);
+  const space = isSpace(subject);
+  const { invokePromise } = useOperationInvoker();
+  const [name, setNameState] = useState(() => getName(subject));
+
+  // Commit the latest value when the popover is dismissed (Enter, click-outside, or blur), unless cancelled.
+  const nameRef = useRef(name);
+  nameRef.current = name;
+  const initialNameRef = useRef(name);
+  const cancelledRef = useRef(false);
+  // Enter commits then closes, which unmounts and runs the dismissal cleanup; guard against a duplicate write.
+  const committedRef = useRef(false);
+
+  const write = useCallback(() => {
+    try {
+      if (!cancelledRef.current && nameRef.current !== initialNameRef.current) {
+        setName(subject, nameRef.current);
+      }
+    } catch (err) {
+      log.error('Failed to rename', { err });
+    }
+  }, [subject]);
+
+  const commit = useCallback(() => {
+    if (!committedRef.current) {
+      committedRef.current = true;
+      write();
+    }
+  }, [write]);
+
+  // Commit the latest value on dismissal (click-outside/blur) when the component unmounts, unless Enter
+  // already committed or Escape cancelled. This must not set committedRef: under StrictMode the mount-time
+  // setup/cleanup/setup cycle runs this cleanup before any interaction, and flipping the guard there would
+  // suppress the real Enter commit.
+  useEffect(
+    () => () => {
+      if (!committedRef.current) {
+        write();
+      }
+    },
+    [write],
+  );
+
+  const close = useCallback(() => {
+    void invokePromise(LayoutOperation.UpdatePopover, { anchorId: '', state: false });
+  }, [invokePromise]);
+
+  return (
+    <div className='p-2'>
+      <Input.Root>
+        <Input.Label srOnly>{t(space ? 'space-name.label' : 'object-name.label')}</Input.Label>
+        <Input.TextInput
+          autoFocus
+          value={name}
+          placeholder={t(space ? 'unnamed-space.label' : 'object.placeholder')}
+          data-testid='spacePlugin.rename.input'
+          onChange={({ target: { value } }) => setNameState(value)}
+          onFocus={(event) => event.target.select()}
+          onKeyDown={(event) => {
+            if (event.key === 'Enter') {
+              commit();
+              close();
+            } else if (event.key === 'Escape') {
+              // Own the dismissal so it does not also bubble to the deck popover's escape handler,
+              // whose divergent teardown leaves stale state that makes the next open flicker.
+              event.preventDefault();
+              event.stopPropagation();
+              cancelledRef.current = true;
+              close();
+            }
+          }}
+        />
+      </Input.Root>
+    </div>
+  );
+};

package/src/containers/RenamePopover/index.ts

@@ -0,0 +1,6 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export { RenamePopover as default } from './RenamePopover';
+export type { RenamePopoverProps, RenameSubject } from './RenamePopover';

package/src/containers/SchemaContainer/SchemaContainer.tsx

@@ -14,7 +14,7 @@ import { mx } from '@dxos/ui-theme';
 import { meta } from '#meta';
 
 export const SchemaContainer = ({ space }: AppSurface.SpaceArticleProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const types = useQuerySpaceTypes(space);
 
   return (

package/src/containers/SpaceHomeArticle/SpaceHomeArticle.tsx

@@ -0,0 +1,100 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import React, { useCallback } from 'react';
+
+import { Surface } from '@dxos/app-framework/ui';
+import { type AppSurface, useAppGraph } from '@dxos/app-toolkit/ui';
+import { useActionRunner } from '@dxos/plugin-graph';
+import { Column, Panel, ScrollArea } from '@dxos/react-ui';
+import {
+  type ActionExecutor,
+  type ActionGraphProps,
+  Menu,
+  MenuBuilder,
+  graphActions,
+  useMenuBuilder,
+} from '@dxos/react-ui-menu';
+
+import { meta } from '#meta';
+import { SpaceHomeContent, SpaceHomePinBottom } from '#types';
+
+export type SpaceHomeArticleProps = AppSurface.SpaceArticleProps;
+
+/**
+ * Per-space Home article shell. Owns only the chrome: a toolbar sourced from graph actions
+ * contributed with `disposition: 'toolbar'` (e.g. Start tour / Hide Welcome from plugin-support),
+ * and a Column layout that delegates its body to surface contributors:
+ *
+ * - `space-home-content`: scrollable region (Welcome panel, recent-objects masonry, starter prompts).
+ * - `space-home-pin-bottom`: pinned region (assistant prompt), capped at one contributor.
+ *
+ * The Space is read from `data.subject` (the Home node carries the Space as its data).
+ */
+export const SpaceHomeArticle = ({ role, attendableId, space }: SpaceHomeArticleProps) => {
+  const { actions, onAction } = useMenuActions(attendableId);
+
+  return (
+    <Panel.Root role={role}>
+      <Menu.Root {...actions} attendableId={attendableId} onAction={onAction}>
+        <Panel.Toolbar asChild>
+          <Menu.Toolbar />
+        </Panel.Toolbar>
+      </Menu.Root>
+      <Panel.Content asChild>
+        <Column.Root style={{ gridTemplateRows: 'minmax(0,1fr) auto' }}>
+          <ScrollArea.Root orientation='vertical' centered padding>
+            <ScrollArea.Viewport>
+              <div className='dx-document flex flex-col gap-4 py-4'>
+                <Surface.Surface type={SpaceHomeContent} data={{ space }} />
+              </div>
+            </ScrollArea.Viewport>
+          </ScrollArea.Root>
+          <Column.Center classNames='dx-document pb-4'>
+            <Surface.Surface type={SpaceHomePinBottom} data={{ space }} limit={1} />
+          </Column.Center>
+        </Column.Root>
+      </Panel.Content>
+    </Panel.Root>
+  );
+};
+
+//
+// Hooks
+//
+
+/**
+ * Builds the toolbar from contributed graph actions for the Home node. Actions opt into the
+ * toolbar via `disposition: 'toolbar'`; the Home shell contributes none itself, so the toolbar
+ * is empty unless another plugin (e.g. plugin-support's tour/welcome actions) contributes.
+ */
+const useMenuActions = (
+  attendableId?: string,
+): { actions: ReturnType<typeof useMenuBuilder>; onAction: ActionExecutor } => {
+  const { graph } = useAppGraph();
+  const runAction = useActionRunner();
+
+  const menuActions = useMenuBuilder(
+    (get): ActionGraphProps => {
+      if (!attendableId) {
+        return MenuBuilder.make().build();
+      }
+      return MenuBuilder.make()
+        .subgraph(
+          graphActions(graph, get, attendableId, { filter: (action) => action.properties.disposition === 'toolbar' }),
+        )
+        .build();
+    },
+    [graph, attendableId],
+  );
+
+  const onAction: ActionExecutor = useCallback(
+    (action) => {
+      void runAction(action, { caller: meta.profile.key });
+    },
+    [runAction],
+  );
+
+  return { actions: menuActions, onAction };
+};

package/src/containers/SpaceHomeArticle/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+export { SpaceHomeArticle as default } from './SpaceHomeArticle';

package/src/containers/SpaceHomeRecent/SpaceHomeRecent.tsx

@@ -0,0 +1,101 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import * as Option from 'effect/Option';
+import React, { useCallback, useMemo } from 'react';
+
+import { useCapabilities, useOperationInvoker } from '@dxos/app-framework/ui';
+import { AppCapabilities, LayoutOperation, Paths } from '@dxos/app-toolkit';
+import { Collection, Filter, Obj, Order, Query, Type } from '@dxos/echo';
+import { HiddenAnnotation, getTypeAnnotation } from '@dxos/echo/Annotation';
+import { Kind as EntityKind } from '@dxos/echo/Entity';
+import { type Space, useQuery } from '@dxos/react-client/echo';
+import { Card, Icon, toLocalizedString, useTranslation } from '@dxos/react-ui';
+import { Masonry } from '@dxos/react-ui-masonry';
+import { getStyles } from '@dxos/ui-theme';
+
+import { meta } from '#meta';
+
+/** Number of recently-modified objects to surface as cards. */
+const RECENT_LIMIT = 10;
+
+type SpaceScopedProps = {
+  space?: Space;
+};
+
+/**
+ * Recent-objects region for the Home article. Queries the most-recently-modified objects of
+ * registered, non-hidden, non-relation, non-collection types and renders them as a Masonry of
+ * tiles. Renders nothing (no heading) when the space has no recent objects — the starter-prompt
+ * contributor (plugin-assistant) fills the empty state instead.
+ */
+export const SpaceHomeRecent = ({ space }: SpaceScopedProps) => {
+  const { t } = useTranslation(meta.profile.key);
+
+  const schemas = useCapabilities(AppCapabilities.Schema);
+  const filter = useMemo(() => {
+    const collectionTypename = Type.getTypename(Collection.Collection);
+    const types = schemas
+      .flat()
+      .filter(Type.isType)
+      .filter((type) => getTypeAnnotation(Type.getSchema(type))?.kind !== EntityKind.Relation)
+      .filter((type) => !HiddenAnnotation.get(Type.getSchema(type)).pipe(Option.getOrElse(() => false)))
+      .filter((type) => Type.getTypename(type) !== collectionTypename);
+    return types.length > 0 ? Filter.or(...types.map((type) => Filter.type(type))) : undefined;
+  }, [schemas]);
+
+  const query = useMemo(
+    () =>
+      Query.select(filter ?? Filter.everything())
+        .orderBy(Order.updated('desc'))
+        .limit(RECENT_LIMIT),
+    [filter],
+  );
+  const recent = useQuery(filter && space ? space.db : undefined, query);
+
+  if (recent.length === 0) {
+    return null;
+  }
+
+  return (
+    <>
+      <h2 className='text-sm font-medium text-description'>{t('space-home.recent.heading')}</h2>
+      <Masonry.Root Tile={RecentObjectTile}>
+        <Masonry.Content padding={false}>
+          <Masonry.Viewport classNames='py-2' items={recent} getId={(object) => object.id} />
+        </Masonry.Content>
+      </Masonry.Root>
+    </>
+  );
+};
+
+const RecentObjectTile = ({ data }: { data: Obj.Unknown; index: number }) => {
+  const { invokePromise } = useOperationInvoker();
+  const { t } = useTranslation(meta.profile.key);
+  const typename = Obj.getTypename(data);
+  const label = toLocalizedString(
+    Obj.getLabel(data) ?? (typename ? ['object-name.placeholder', { ns: typename, defaultValue: 'New item' }] : ''),
+    t,
+  );
+  const iconAnnotation = Obj.getIcon(data);
+  const icon = iconAnnotation?.icon ?? 'ph--circle-dashed--regular';
+  const iconStyles = iconAnnotation?.hue ? getStyles(iconAnnotation.hue) : undefined;
+
+  const handleClick = useCallback(() => {
+    void invokePromise(LayoutOperation.Open, { subject: [Paths.getObjectPathFromObject(data)] });
+  }, [invokePromise, data]);
+
+  return (
+    <Card.Root role='button' classNames='cursor-pointer' onClick={handleClick}>
+      <Card.Header>
+        <Card.Block>
+          <Icon icon={icon} classNames={iconStyles?.text} />
+        </Card.Block>
+        <Card.Title>{label}</Card.Title>
+      </Card.Header>
+    </Card.Root>
+  );
+};
+
+RecentObjectTile.displayName = 'RecentObjectTile';

package/src/containers/SpaceHomeRecent/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+export { SpaceHomeRecent as default } from './SpaceHomeRecent';

package/src/containers/SpacePresence/SpacePresence.tsx

@@ -246,7 +246,7 @@ export type SmallPresenceProps = {
 } & Pick<AttentionGlyphProps, 'attended' | 'containsAttended'>;
 
 export const SmallPresence = ({ count = 0, attended, containsAttended }: SmallPresenceProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
 
   return (
     <Tooltip.Trigger asChild content={t('presence.label', { count })} side='bottom'>

package/src/containers/SpaceSettingsContainer/SpaceSettingsContainer.tsx

@@ -6,7 +6,7 @@ import * as Schema from 'effect/Schema';
 import React, { type ChangeEvent, useCallback, useMemo, useState } from 'react';
 
 import { useCapabilities, useOperationInvoker } from '@dxos/app-framework/ui';
-import { getPersonalSpace, getSpacePath, isPersonalSpace, LayoutOperation } from '@dxos/app-toolkit';
+import { AppSpace, Paths, LayoutOperation } from '@dxos/app-toolkit';
 import { AppSurface } from '@dxos/app-toolkit/ui';
 import { Obj } from '@dxos/echo';
 import { log } from '@dxos/log';
@@ -25,7 +25,7 @@ const SpaceFormSchema = SpaceForm;
 
 // TODO(wittjosiah): Handle space migrations here?
 export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const { invokePromise } = useOperationInvoker();
   const client = useClient();
   const [edgeReplication, setEdgeReplication] = useState(
@@ -78,7 +78,7 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
     [space.properties.name, space.properties.icon, space.properties.hue, edgeReplication],
   );
 
-  const personal = isPersonalSpace(space);
+  const personal = AppSpace.isPersonalSpace(space);
 
   const fieldMap = useMemo<FormFieldMap>(
     () => ({
@@ -146,7 +146,7 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
 
   const repairs = useCapabilities(SpaceCapabilities.Repair);
   const handleRepair = useCallback(async () => {
-    await Promise.all(repairs.map((repair) => repair({ space, isDefault: isPersonalSpace(space) })));
+    await Promise.all(repairs.map((repair) => repair({ space, isDefault: AppSpace.isPersonalSpace(space) })));
   }, [space, repairs]);
 
   const [deleteConfirmOpen, setDeleteConfirmOpen] = useState(false);
@@ -155,9 +155,9 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
     try {
       await invokePromise(SpaceOperation.Delete, { space });
       setDeleteConfirmOpen(false);
-      const personalSpace = getPersonalSpace(client);
+      const personalSpace = AppSpace.getPersonalSpace(client);
       if (personalSpace) {
-        void invokePromise(LayoutOperation.SwitchWorkspace, { subject: getSpacePath(personalSpace.id) });
+        void invokePromise(LayoutOperation.SwitchWorkspace, { subject: Paths.getSpacePath(personalSpace.id) });
       }
     } catch (err) {
       log.catch(err, { stage: 'delete: invocation rejected', spaceId: space.id });
@@ -174,7 +174,7 @@ export const SpaceSettingsContainer = ({ space }: AppSurface.SpaceArticleProps)
     <Settings.Viewport>
       <Settings.Section
         title={t('space-properties-settings-verbose.label')}
-        description={t('space-properties-settings.description', { ns: meta.id })}
+        description={t('space-properties-settings.description', { ns: meta.profile.key })}
       >
         <Form.Root
           key={space.id}

package/src/containers/SyncStatus/SyncStatus.tsx

@@ -30,7 +30,7 @@ export const SyncStatus = () => {
 };
 
 export const SyncStatusIndicator = ({ state, saved }: { state: SpaceSyncStateMap; saved: boolean }) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const summary = getSyncSummary(state);
   const offline = Object.values(state).length === 0;
   const needsToUpload = summary.differentDocuments > 0 || summary.missingOnRemote > 0;
@@ -79,7 +79,7 @@ export const SyncStatusIndicator = ({ state, saved }: { state: SpaceSyncStateMap
 };
 
 const EdgeConnectionPopover = () => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const client = useClient();
   const { status } = useStream(
     () => client.services.services.EdgeAgentService!.queryEdgeStatus(),

package/src/containers/index.ts

@@ -17,13 +17,14 @@ export const MembersContainer: ComponentType<any> = lazy(() => import('./Members
 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 EntityRenamePopover: ComponentType<any> = lazy(() => import('./EntityRenamePopover'));
 export const RecordArticle: ComponentType<any> = lazy(() => import('./RecordArticle'));
 export const RelatedArticle: ComponentType<any> = lazy(() => import('./RelatedArticle'));
+export const RenamePopover: ComponentType<any> = lazy(() => import('./RenamePopover'));
 export const SchemaContainer: ComponentType<any> = lazy(() => import('./SchemaContainer'));
 export const SmallPresenceLive: ComponentType<any> = lazy(() => import('./SmallPresenceLive'));
 export const SpacePresence: ComponentType<any> = lazy(() => import('./SpacePresence'));
-export const SpaceRenamePopover: ComponentType<any> = lazy(() => import('./SpaceRenamePopover'));
+export const SpaceHomeArticle: ComponentType<any> = lazy(() => import('./SpaceHomeArticle'));
+export const SpaceHomeRecent: ComponentType<any> = lazy(() => import('./SpaceHomeRecent'));
 export const SpaceSettingsContainer: ComponentType<any> = lazy(() => import('./SpaceSettingsContainer'));
 export const SyncStatus: ComponentType<any> = lazy(() => import('./SyncStatus'));
 export const ViewEditor: ComponentType<any> = lazy(() => import('./ViewEditor'));

package/src/hooks/useInputSurfaceLookup.tsx

@@ -5,6 +5,7 @@
 import React, { useCallback } from 'react';
 
 import { Surface, usePluginManager } from '@dxos/app-framework/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
 import { type FormFieldProvider } from '@dxos/react-ui-form';
 
 /**
@@ -25,8 +26,8 @@ export const useInputSurfaceLookup = (baseData?: Record<string, any>): FormField
         ...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} {...surfaceFieldProps} />;
+      if (Surface.isAvailable(pluginManager.capabilities, { type: AppSurface.FormInput, data })) {
+        return <Surface.Surface type={AppSurface.FormInput} data={data} {...surfaceFieldProps} />;
       }
     },
     [pluginManager, baseData],

package/src/hooks/useRelatedObjects.ts

@@ -2,9 +2,11 @@
 // Copyright 2023 DXOS.org
 //
 
+import * as Option from 'effect/Option';
 import { useMemo } from 'react';
 
-import { type Database, Entity, Filter, Obj, Ref, Relation } from '@dxos/echo';
+import { type Database, Entity, Filter, Obj, Ref, Relation, Type } from '@dxos/echo';
+import { HiddenAnnotation } from '@dxos/echo/Annotation';
 import { useQuery } from '@dxos/react-client/echo';
 import { isNonNullable } from '@dxos/util';
 
@@ -74,6 +76,16 @@ export const useRelatedObjects = (
         // TODO(burdon): Configure.
         .filter((obj) => Entity.getTypename(obj) !== 'org.dxos.type.text')
         .filter((obj) => Entity.getTypename(obj) !== 'org.dxos.type.assistant.chat')
+        .filter((obj) => {
+          if (!Obj.isObject(obj)) {
+            return true;
+          }
+          const typeEntity = Obj.getType(obj);
+          if (!typeEntity) {
+            return true;
+          }
+          return !HiddenAnnotation.get(Type.getSchema(typeEntity)).pipe(Option.getOrElse(() => false));
+        })
     );
   }, [subject, objects, options.references, options.relations]);
 };