@dxos/plugin-simple-layout 0.8.4-main.7996785055 → 0.8.4-main.8baae0fced

package/src/hooks/useDrawerActions.ts

@@ -12,9 +12,9 @@ import { Node, useActionRunner } from '@dxos/plugin-graph';
 import { useTranslation } from '@dxos/react-ui';
 import { type ActionExecutor, type ActionGraphProps, createGapSeparator } from '@dxos/react-ui-menu';
 
-import { useMobileLayout } from '../components';
-import { meta } from '../meta';
-import { SimpleLayoutState as SimpleLayoutStateCapability } from '../types';
+import { useMobileLayout } from '#components';
+import { meta } from '#meta';
+import { SimpleLayoutCapabilities } from '#types';
 
 import { createCompanionActions } from './actions';
 import { useSimpleLayoutState } from './useSimpleLayoutState';
@@ -31,7 +31,7 @@ export type DrawerActions = {
  */
 export const useDrawerActions = (consumerName: string): DrawerActions => {
   const { t } = useTranslation(meta.id);
-  const stateAtom = useCapability(SimpleLayoutStateCapability);
+  const stateAtom = useCapability(SimpleLayoutCapabilities.State);
   const { graph } = useAppGraph();
   const runAction = useActionRunner();
   const { updateState } = useSimpleLayoutState();
@@ -64,7 +64,7 @@ export const useDrawerActions = (consumerName: string): DrawerActions => {
             type: Node.ActionType,
             properties: {
               icon: isExpanded ? 'ph--arrow-down--regular' : 'ph--arrow-up--regular',
-              label: isExpanded ? t('collapse drawer label') : t('expand drawer label'),
+              label: isExpanded ? t('collapse-drawer.label') : t('expand-drawer.label'),
               iconOnly: true,
             },
             data: () =>
@@ -80,7 +80,7 @@ export const useDrawerActions = (consumerName: string): DrawerActions => {
           type: Node.ActionType,
           properties: {
             icon: 'ph--x--regular',
-            label: t('close drawer label'),
+            label: t('close-drawer.label'),
             iconOnly: true,
           },
           data: () =>

package/src/hooks/useNavbarActions.ts

@@ -16,8 +16,8 @@ import {
   createMenuItemGroup,
 } from '@dxos/react-ui-menu';
 
-import { meta } from '../meta';
-import { SimpleLayoutState } from '../types';
+import { meta } from '#meta';
+import { SimpleLayoutCapabilities } from '#types';
 
 import { createCompanionActions } from './actions';
 import { useSimpleLayoutState } from './useSimpleLayoutState';
@@ -39,7 +39,7 @@ export const useNavbarActions = (): NavbarActions => {
   const { t } = useTranslation(meta.id);
   const { graph } = useAppGraph();
   const runAction = useActionRunner();
-  const stateAtom = useCapability(SimpleLayoutState);
+  const stateAtom = useCapability(SimpleLayoutCapabilities.State);
   const { updateState } = useSimpleLayoutState();
 
   // Create a computed atom that derives everything from graph connections and state.
@@ -62,7 +62,7 @@ export const useNavbarActions = (): NavbarActions => {
           variant: 'dropdownMenu',
           icon: 'ph--list--regular',
           iconOnly: true,
-          label: t('main menu label'),
+          label: t('main-menu.label'),
           testId: 'simpleLayoutPlugin.addSpace',
         });
         nodes.push(mainMenuGroup);

package/src/hooks/useSimpleLayoutState.ts

@@ -7,20 +7,22 @@ import { useCallback, useContext } from 'react';
 
 import { useCapability } from '@dxos/app-framework/ui';
 
-import { SimpleLayoutState } from '../types';
+import { SimpleLayoutCapabilities } from '#types';
 
 export type UseSimpleLayoutState = {
-  state: SimpleLayoutState;
-  updateState: (fn: (current: SimpleLayoutState) => SimpleLayoutState) => void;
+  state: SimpleLayoutCapabilities.SimpleLayoutState;
+  updateState: (
+    fn: (current: SimpleLayoutCapabilities.SimpleLayoutState) => SimpleLayoutCapabilities.SimpleLayoutState,
+  ) => void;
 };
 
 export const useSimpleLayoutState = (): UseSimpleLayoutState => {
   const registry = useContext(RegistryContext);
-  const stateAtom = useCapability(SimpleLayoutState);
+  const stateAtom = useCapability(SimpleLayoutCapabilities.State);
   const state = useAtomValue(stateAtom);
 
   const updateState = useCallback(
-    (fn: (current: SimpleLayoutState) => SimpleLayoutState) => {
+    (fn: (current: SimpleLayoutCapabilities.SimpleLayoutState) => SimpleLayoutCapabilities.SimpleLayoutState) => {
       registry.set(stateAtom, fn(registry.get(stateAtom)));
     },
     [registry, stateAtom],

package/src/index.ts

@@ -2,4 +2,5 @@
 // Copyright 2025 DXOS.org
 //
 
-export * from './SimpleLayoutPlugin';
+export * from './meta';
+export * from './types';

package/src/meta.ts

@@ -6,11 +6,13 @@ import { type Plugin } from '@dxos/app-framework';
 import { trim } from '@dxos/util';
 
 export const meta: Plugin.Meta = {
-  id: 'org.dxos.plugin.simple-layout',
+  id: 'org.dxos.plugin.simpleLayout',
   name: 'Simple Layout',
+  author: 'DXOS',
   description: trim`
     Minimal layout plugin for simplified UI contexts like popover windows.
     Provides basic content rendering without sidebars or complex navigation.
   `,
   icon: 'ph--layout--regular',
+  tags: ['system'],
 };

package/src/operations/close.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/index.ts

@@ -1,6 +1,6 @@
 // Copyright 2025 DXOS.org
 
-import { OperationHandlerSet } from '@dxos/operation';
+import { OperationHandlerSet } from '@dxos/compute';
 
 export const SimpleLayoutOperationHandlerSet = OperationHandlerSet.lazy(
   () => import('./close'),

package/src/operations/open.ts

@@ -2,27 +2,60 @@
 
 import * as Effect from 'effect/Effect';
 
-import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Capability } from '@dxos/app-framework';
+import {
+  AppCapabilities,
+  LayoutOperation,
+  createEdgeExistenceChecker,
+  validateNavigationTarget,
+} from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
+import { Context } from '@dxos/context';
+import { log } from '@dxos/log';
+import { ClientCapabilities } from '@dxos/plugin-client';
 
 import { layoutStateAccess } from './state-access';
 
 const handler: Operation.WithHandler<typeof LayoutOperation.Open> = LayoutOperation.Open.pipe(
   Operation.withHandler(
     Effect.fnUntraced(function* (input) {
+      log('LayoutOperation.Open handler start');
+      const { graph } = yield* Capability.get(AppCapabilities.AppGraph);
       const { updateState } = yield* layoutStateAccess;
       const id = input.subject[0];
 
+      // Validate navigation target, redirecting to 404 if not found.
+      const capabilities = yield* Capability.Service;
+      const pathResolvers = capabilities.getAll(AppCapabilities.NavigationPathResolver);
+      const checkRemoteExistence = yield* Capability.get(ClientCapabilities.Client).pipe(
+        Effect.map((client) =>
+          createEdgeExistenceChecker((spaceId, body) => client.edge.http.execQuery(new Context(), spaceId, body)),
+        ),
+        Effect.catchAll(() => Effect.succeed(undefined)),
+      );
+
+      const validatedId =
+        input.navigation === 'immediate'
+          ? id
+          : yield* validateNavigationTarget({
+              graph,
+              subjectId: id,
+              pathResolvers,
+              checkRemoteExistence,
+            });
+
       updateState((state) => {
         const newHistory = state.active ? [...state.history, state.active] : state.history;
         const trimmedHistory =
           newHistory.length > MAX_HISTORY_LENGTH ? newHistory.slice(-MAX_HISTORY_LENGTH) : newHistory;
         return {
           ...state,
-          active: id,
+          active: validatedId,
           history: trimmedHistory,
         };
       });
+
+      return [validatedId];
     }),
   ),
 );

package/src/operations/revert-workspace.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/set-layout-mode.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 const handler: Operation.WithHandler<typeof LayoutOperation.SetLayoutMode> = LayoutOperation.SetLayoutMode.pipe(
   Operation.withHandler(Effect.fnUntraced(function* () {})),

package/src/operations/set.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/state-access.ts

@@ -4,15 +4,17 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 
-import { type SimpleLayoutState, SimpleLayoutState as SimpleLayoutStateCapability } from '../types';
+import { SimpleLayoutCapabilities } from '../types';
 
 export const layoutStateAccess = Effect.gen(function* () {
   const registry = yield* Capability.get(Capabilities.AtomRegistry);
-  const stateAtom = yield* Capability.get(SimpleLayoutStateCapability);
+  const stateAtom = yield* Capability.get(SimpleLayoutCapabilities.State);
 
   return {
     getState: () => registry.get(stateAtom),
-    updateState: (fn: (current: SimpleLayoutState) => SimpleLayoutState) => {
+    updateState: (
+      fn: (current: SimpleLayoutCapabilities.SimpleLayoutState) => SimpleLayoutCapabilities.SimpleLayoutState,
+    ) => {
       registry.set(stateAtom, fn(registry.get(stateAtom)));
     },
   };

package/src/operations/switch-workspace.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { isPinnedWorkspace, LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/update-complementary.ts

@@ -2,8 +2,9 @@
 
 import * as Effect from 'effect/Effect';
 
-import { getCompanionVariant, LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { LayoutOperation } from '@dxos/app-toolkit';
+import { Operation } from '@dxos/compute';
+import { getLinkedVariant } from '@dxos/react-ui-attention';
 
 import { layoutStateAccess } from './state-access';
 
@@ -20,7 +21,7 @@ const handler: Operation.WithHandler<typeof LayoutOperation.UpdateComplementary>
             companionVariant: undefined,
           }));
         } else if (input.subject) {
-          const variant = getCompanionVariant(input.subject);
+          const variant = getLinkedVariant(input.subject);
           updateState((state) => ({
             ...state,
             companionVariant: variant,

package/src/operations/update-dialog.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/update-popover.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 import { layoutStateAccess } from './state-access';
 

package/src/operations/update-sidebar.ts

@@ -3,7 +3,7 @@
 import * as Effect from 'effect/Effect';
 
 import { LayoutOperation } from '@dxos/app-toolkit';
-import { Operation } from '@dxos/operation';
+import { Operation } from '@dxos/compute';
 
 const handler: Operation.WithHandler<typeof LayoutOperation.UpdateSidebar> = LayoutOperation.UpdateSidebar.pipe(
   Operation.withHandler(() => Effect.void),

package/src/plugin.ts

@@ -0,0 +1,11 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Plugin } from '@dxos/app-framework';
+
+import { meta } from './meta';
+
+export const SimpleLayoutPlugin = Plugin.lazy(meta, () => import('#plugin'));
+
+export { SimpleLayoutOperationHandlerSet } from './operations';

package/src/translations.ts

@@ -3,32 +3,33 @@
 //
 
 import { type Resource } from '@dxos/react-ui';
-import { translations as searchTranslations } from '@dxos/react-ui-search';
+import { translations as searchTranslations } from '@dxos/react-ui-search/translations';
 
-import { meta } from './meta';
+import { meta } from '#meta';
 
 export const translations = [
   ...searchTranslations,
   {
     'en-US': {
       [meta.id]: {
-        'plugin name': 'Simple layout',
-        'settings title': 'Simple layout settings',
-        'workspaces heading': 'Workspaces',
-        'settings heading': 'Settings',
-        'back label': 'Back',
-        'browse label': 'Browse',
-        'notifications label': 'Notifications',
-        'profile label': 'Profile',
-        'app menu label': 'App menu',
-        'main menu label': 'Main menu',
-        'companions menu label': 'Companions',
-        'error fallback message': 'An error occurred',
-        'drawer label': 'Drawer',
-        'close drawer label': 'Close drawer',
-        'expand drawer label': 'Expand drawer',
-        'collapse drawer label': 'Collapse drawer',
-        'actions menu label': 'Actions',
+        'plugin.name': 'Simple layout',
+        'settings.title': 'Simple layout settings',
+        'workspaces.heading': 'Workspaces',
+        'settings.heading': 'Settings',
+        'back.label': 'Back',
+        'browse.label': 'Browse',
+        'notifications.label': 'Notifications',
+        'profile.label': 'Profile',
+        'app-menu.label': 'App menu',
+        'main-menu.label': 'Main menu',
+        'companions-menu.label': 'Companions',
+        'error-fallback.message': 'An error occurred',
+        'drawer.label': 'Drawer',
+        'close-drawer.label': 'Close drawer',
+        'expand-drawer.label': 'Expand drawer',
+        'collapse-drawer.label': 'Collapse drawer',
+        'actions-menu.label': 'Actions',
+        'done.label': 'Done',
       },
     },
   },

package/src/types/{capabilities.ts → SimpleLayoutCapabilities.ts}

@@ -2,32 +2,28 @@
 // Copyright 2025 DXOS.org
 //
 
+// @import-as-namespace
+
 import { type Atom } from '@effect-atom/atom-react';
 
 import { Capability } from '@dxos/app-framework';
 import { type Label } from '@dxos/react-ui';
 
-import { meta } from '../meta';
+import { meta } from '#meta';
 
 export type DrawerState = 'closed' | 'open' | 'expanded';
 
-// TODO(wittjosiah): Handle toasts.
 export type SimpleLayoutState = {
-  /** Data to be passed to the main content Surface. */
   content?: any;
-
   previousWorkspace: string;
   workspace: string;
   active?: string;
-
   dialogOpen: boolean;
   dialogType?: 'default' | 'alert';
   dialogBlockAlign?: 'start' | 'center' | 'end';
   dialogOverlayClasses?: string;
   dialogOverlayStyle?: Record<string, any>;
-  /** Data to be passed to the dialog Surface. */
-  dialogContent?: any;
-
+  dialogContent?: { component: string; props?: any } | null;
   popoverOpen?: boolean;
   popoverSide?: 'top' | 'right' | 'bottom' | 'left';
   popoverVariant?: 'virtual' | 'react';
@@ -35,19 +31,11 @@ export type SimpleLayoutState = {
   popoverAnchorId?: string;
   popoverKind?: 'base' | 'card';
   popoverTitle?: Label;
-  popoverContent?: any;
-
-  /** Bottom drawer state. */
+  popoverContent?: { component: string; props?: any } | { subject: any } | null;
   drawerState: DrawerState;
-
-  /** Stack of previously active item IDs for back navigation. */
   history: string[];
-
-  /** Whether running in popover window context (hides mobile-specific UI). */
   isPopover?: boolean;
-
-  /** Variant of the companion to display in the drawer (e.g., "comments", "assistant-chat"). */
   companionVariant?: string;
 };
 
-export const SimpleLayoutState = Capability.make<Atom.Writable<SimpleLayoutState>>(`${meta.id}.state`);
+export const State = Capability.make<Atom.Writable<SimpleLayoutState>>(`${meta.id}.state`);

package/src/types/SimpleLayoutEvents.ts

@@ -0,0 +1,15 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+// @import-as-namespace
+
+import { type ActivationEvent } from '@dxos/app-framework';
+import { AppActivationEvents } from '@dxos/app-toolkit';
+
+import * as SimpleLayoutCapabilities from './SimpleLayoutCapabilities';
+
+/** Fired when State capability is ready. */
+export const StateReady: ActivationEvent.ActivationEvent = AppActivationEvents.createStateEvent(
+  SimpleLayoutCapabilities.State.identifier,
+);

package/src/types/index.ts

@@ -2,5 +2,5 @@
 // Copyright 2025 DXOS.org
 //
 
-export * from './capabilities';
-export * from './events';
+export * as SimpleLayoutCapabilities from './SimpleLayoutCapabilities';
+export * as SimpleLayoutEvents from './SimpleLayoutEvents';