@dxos/app-framework 0.8.4-main.72ec0f3 → 0.8.4-main.765dc60934

package/src/plugin-intent/intent.ts

@@ -1,154 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import * as Schema from 'effect/Schema';
-
-export type IntentParams = {
-  readonly input: Schema.Schema.All;
-  readonly output: Schema.Schema.All;
-};
-
-export type IntentData<Fields extends IntentParams> =
-  Schema.Schema.Type<Schema.Struct<Fields>> extends { readonly input: any }
-    ? Schema.Schema.Type<Schema.Struct<Fields>>['input']
-    : any;
-
-export type IntentResultData<Fields extends IntentParams> =
-  Schema.Schema.Type<Schema.Struct<Fields>> extends { readonly output: any }
-    ? Schema.Schema.Type<Schema.Struct<Fields>>['output']
-    : any;
-
-export type IntentSchema<Tag extends string, Fields extends IntentParams> = Schema.TaggedClass<any, Tag, Fields>;
-
-/**
- * An intent is an abstract description of an operation to be performed.
- * Intents allow actions to be performed across plugins.
- */
-export type Intent<Tag extends string, Fields extends IntentParams> = {
-  _schema: IntentSchema<Tag, Fields>;
-
-  /**
-   * The id of the intent.
-   */
-  id: Tag;
-
-  /**
-   * Any data needed to perform the desired action.
-   */
-  data: IntentData<Fields>;
-
-  /**
-   * Whether or not the intent is being undone.
-   */
-  undo?: boolean;
-};
-
-export type AnyIntent = Intent<any, any>;
-
-/**
- * Chain of intents to be executed together.
- * The result of each intent is merged into the next intent's input data.
- */
-export type IntentChain<
-  FirstTag extends string,
-  LastTag extends string,
-  FirstFields extends IntentParams,
-  LastFields extends IntentParams,
-> = {
-  first: Intent<FirstTag, FirstFields>;
-  last: Intent<LastTag, LastFields>;
-  all: AnyIntent[];
-};
-
-export type AnyIntentChain = IntentChain<any, any, any, any>;
-
-/**
- * Creates a typed intent.
- * @param schema Schema of the intent. Must be a tagged class with input and output schemas.
- * @param data Data fulfilling the input schema of the intent.
- * @param params.plugin Optional plugin ID to send the intent to.
- * @param params.undo Optional flag to indicate that the intent is being undone. Generally not set manually.
- */
-export const createIntent = <Tag extends string, Fields extends IntentParams>(
-  schema: IntentSchema<Tag, Fields>,
-  data: IntentData<Fields> = {},
-  params: Pick<AnyIntent, 'undo'> = {},
-): IntentChain<Tag, Tag, Fields, Fields> => {
-  // The output of validateSync breaks proxy objects so this is just used for validation.
-  // TODO(wittjosiah): Is there a better way to make theses types align?
-  const _ = Schema.validateSync(schema.fields.input as Schema.Schema<any, any, unknown>)(data);
-  const intent = {
-    ...params,
-    _schema: schema,
-    id: schema._tag,
-    data,
-  } satisfies Intent<Tag, Fields>;
-
-  return {
-    first: intent,
-    last: intent,
-    all: [intent],
-  };
-};
-
-// TODO(wittjosiah): Add a function for mapping the output of one intent to the input of another.
-
-/**
- * Chain two intents together.
- *
- * NOTE: Chaining of intents depends on the data inputs and outputs being structs.
- */
-export const chain =
-  <
-    FirstTag extends string,
-    NextTag extends string,
-    FirstFields extends IntentParams,
-    LastFields extends IntentParams,
-    NextFields extends IntentParams,
-  >(
-    schema: IntentSchema<NextTag, NextFields>,
-    data: Omit<IntentData<NextFields>, keyof IntentResultData<LastFields>> = {},
-    params: Pick<AnyIntent, 'undo'> = {},
-  ) =>
-  (
-    intent: IntentChain<FirstTag, any, FirstFields, LastFields>,
-  ): IntentChain<FirstTag, NextTag, FirstFields, NextFields> => {
-    const intents = 'all' in intent ? intent.all : [intent];
-    const first = intents[0];
-    const last = {
-      ...params,
-      _schema: schema,
-      id: schema._tag,
-      data,
-    } satisfies Intent<NextTag, NextFields>;
-
-    return {
-      first,
-      last,
-      all: [...intents, last],
-    };
-  };
-
-//
-// Intents
-//
-
-// NOTE: Should maintain compatibility with `i18next` (and @dxos/react-ui).
-// TODO(wittjosiah): Making this immutable breaks type compatibility.
-export const Label = Schema.Union(
-  Schema.String,
-  Schema.mutable(
-    Schema.Tuple(
-      Schema.String,
-      Schema.mutable(
-        Schema.Struct({
-          ns: Schema.String,
-          count: Schema.optional(Schema.Number),
-          defaultValue: Schema.optional(Schema.String),
-        }),
-      ),
-    ),
-  ),
-);
-export type Label = Schema.Schema.Type<typeof Label>;

package/src/plugin-intent/meta.ts

@@ -1,10 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { type PluginMeta } from '@dxos/app-framework';
-
-export const meta: PluginMeta = {
-  id: 'dxos.org/plugin/intent',
-  name: 'Intent',
-};

package/src/plugin-settings/SettingsPlugin.ts

@@ -1,34 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Capabilities, Events } from '../common';
-import { contributes, defineModule, definePlugin, lazy } from '../core';
-
-import { meta } from './meta';
-import { translations } from './translations';
-
-export const SettingsPlugin = definePlugin(meta, () => [
-  defineModule({
-    id: `${meta.id}/module/store`,
-    activatesOn: Events.Startup,
-    activatesBefore: [Events.SetupSettings],
-    activatesAfter: [Events.SettingsReady],
-    activate: lazy(() => import('./store')),
-  }),
-  defineModule({
-    id: `${meta.id}/module/translations`,
-    activatesOn: Events.SetupTranslations,
-    activate: () => contributes(Capabilities.Translations, translations),
-  }),
-  defineModule({
-    id: `${meta.id}/module/intent-resolver`,
-    activatesOn: Events.SetupIntentResolver,
-    activate: lazy(() => import('./intent-resolver')),
-  }),
-  defineModule({
-    id: `${meta.id}/module/app-graph-builder`,
-    activatesOn: Events.SetupAppGraph,
-    activate: lazy(() => import('./app-graph-builder')),
-  }),
-]);

package/src/plugin-settings/actions.ts

@@ -1,25 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import * as Schema from 'effect/Schema';
-
-import { meta } from './meta';
-
-// TODO(burdon): Document.
-export const SETTINGS_ID = '!dxos:settings';
-export const SETTINGS_KEY = 'settings';
-
-export namespace SettingsAction {
-  export class Open extends Schema.TaggedClass<Open>()(`${meta.id}/open`, {
-    input: Schema.Struct({
-      plugin: Schema.optional(Schema.String),
-    }),
-    output: Schema.Void,
-  }) {}
-
-  export class OpenPluginRegistry extends Schema.TaggedClass<OpenPluginRegistry>()(`${meta.id}/open-plugin-registry`, {
-    input: Schema.Void,
-    output: Schema.Void,
-  }) {}
-}

package/src/plugin-settings/app-graph-builder.ts

@@ -1,160 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Atom } from '@effect-atom/atom-react';
-import * as Function from 'effect/Function';
-import * as Option from 'effect/Option';
-
-import { ROOT_ID, createExtension } from '@dxos/app-graph';
-import { type SettingsStore, type SettingsValue } from '@dxos/local-storage';
-import { isNonNullable } from '@dxos/util';
-
-import { Capabilities } from '../common';
-import { type PluginContext, type PluginMeta, contributes } from '../core';
-import { createIntent } from '../plugin-intent';
-
-import { SETTINGS_ID, SETTINGS_KEY, SettingsAction } from './actions';
-import { meta } from './meta';
-
-export default (context: PluginContext) =>
-  contributes(Capabilities.AppGraphBuilder, [
-    createExtension({
-      id: `${meta.id}/action`,
-      actions: (node) =>
-        Atom.make((get) =>
-          Function.pipe(
-            get(node),
-            Option.flatMap((node) => (node.id === ROOT_ID ? Option.some(node) : Option.none())),
-            Option.map(() => [
-              {
-                id: meta.id,
-                data: async () => {
-                  const { dispatchPromise: dispatch } = context.getCapability(Capabilities.IntentDispatcher);
-                  await dispatch(createIntent(SettingsAction.Open));
-                },
-                properties: {
-                  label: ['open settings label', { ns: meta.id }],
-                  icon: 'ph--gear--regular',
-                  disposition: 'menu',
-                  keyBinding: {
-                    macos: 'meta+,',
-                    windows: 'alt+,',
-                  },
-                },
-              },
-            ]),
-            Option.getOrElse(() => []),
-          ),
-        ),
-    }),
-    createExtension({
-      id: `${meta.id}/core`,
-      connector: (node) =>
-        Atom.make((get) =>
-          Function.pipe(
-            get(node),
-            Option.flatMap((node) => (node.id === ROOT_ID ? Option.some(node) : Option.none())),
-            Option.map(() => [
-              {
-                id: SETTINGS_ID,
-                type: meta.id,
-                properties: {
-                  label: ['app settings label', { ns: meta.id }],
-                  icon: 'ph--gear--regular',
-                  disposition: 'pin-end',
-                  position: 'hoist',
-                  testId: 'treeView.appSettings',
-                },
-              },
-            ]),
-            Option.getOrElse(() => []),
-          ),
-        ),
-    }),
-    createExtension({
-      id: `${meta.id}/core-plugins`,
-      connector: (node) =>
-        Atom.make((get) =>
-          Function.pipe(
-            get(node),
-            Option.flatMap((node) => (node.id !== SETTINGS_ID ? Option.none() : Option.some(node))),
-            Option.map(() => {
-              const manager = get(context.capability(Capabilities.PluginManager));
-              const [settingsStore] = get(context.capabilities(Capabilities.SettingsStore));
-              return [
-                ...manager.plugins
-                  .filter((plugin) => manager.core.includes(plugin.meta.id))
-                  .map((plugin): [PluginMeta, SettingsStore<SettingsValue>] | null => {
-                    const settings = settingsStore?.getStore(plugin.meta.id);
-                    if (!settings) {
-                      return null;
-                    }
-
-                    return [plugin.meta, settings];
-                  })
-                  .filter(isNonNullable)
-                  .map(([meta, settings]) => ({
-                    id: `${SETTINGS_KEY}:${meta.id.replaceAll('/', ':')}`,
-                    type: 'category',
-                    data: settings,
-                    properties: {
-                      label: meta.name ?? meta.id,
-                      icon: meta.icon ?? 'ph--circle--regular',
-                    },
-                  })),
-
-                {
-                  id: `${SETTINGS_KEY}:custom-plugins`,
-                  type: 'category',
-                  properties: {
-                    label: ['custom plugins label', { ns: meta.id }],
-                    icon: 'ph--squares-four--regular',
-                    role: 'branch',
-                    disposition: 'collection',
-                  },
-                },
-              ];
-            }),
-            Option.getOrElse(() => []),
-          ),
-        ),
-    }),
-    createExtension({
-      id: `${meta.id}/custom-plugins`,
-      connector: (node) =>
-        Atom.make((get) =>
-          Function.pipe(
-            get(node),
-            Option.flatMap((node) =>
-              node.id !== `${SETTINGS_KEY}:custom-plugins` ? Option.none() : Option.some(node),
-            ),
-            Option.map(() => {
-              const manager = get(context.capability(Capabilities.PluginManager));
-              const [settingsStore] = get(context.capabilities(Capabilities.SettingsStore));
-              return manager.plugins
-                .filter((plugin) => !manager.core.includes(plugin.meta.id))
-                .map((plugin): [PluginMeta, SettingsStore<SettingsValue>] | null => {
-                  const settings = settingsStore?.getStore(plugin.meta.id);
-                  if (!settings) {
-                    return null;
-                  }
-
-                  return [plugin.meta, settings];
-                })
-                .filter(isNonNullable)
-                .map(([meta, settings]) => ({
-                  id: `${SETTINGS_KEY}:${meta.id.replaceAll('/', ':')}`,
-                  type: 'category',
-                  data: settings,
-                  properties: {
-                    label: meta.name ?? meta.id,
-                    icon: meta.icon ?? 'ph--circle--regular',
-                  },
-                }));
-            }),
-            Option.getOrElse(() => []),
-          ),
-        ),
-    }),
-  ]);

package/src/plugin-settings/index.ts

@@ -1,6 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-export * from './actions';
-export * from './SettingsPlugin';

package/src/plugin-settings/intent-resolver.ts

@@ -1,35 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Function from 'effect/Function';
-
-import { Capabilities, LayoutAction } from '../common';
-import { contributes } from '../core';
-import { chain, createIntent, createResolver } from '../plugin-intent';
-
-import { SETTINGS_ID, SETTINGS_KEY, SettingsAction } from './actions';
-
-export default () =>
-  contributes(
-    Capabilities.IntentResolver,
-    createResolver({
-      intent: SettingsAction.Open,
-      resolve: ({ plugin }) => {
-        const openSettings = createIntent(LayoutAction.SwitchWorkspace, { part: 'workspace', subject: SETTINGS_ID });
-        return {
-          intents: [
-            plugin
-              ? Function.pipe(
-                  openSettings,
-                  chain(LayoutAction.Open, {
-                    part: 'main',
-                    subject: [`${SETTINGS_KEY}:${plugin.replaceAll('/', ':')}`],
-                  }),
-                )
-              : openSettings,
-          ],
-        };
-      },
-    }),
-  );

package/src/plugin-settings/meta.ts

@@ -1,10 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { type PluginMeta } from '@dxos/app-framework';
-
-export const meta: PluginMeta = {
-  id: 'dxos.org/plugin/settings',
-  name: 'Settings',
-};

package/src/plugin-settings/store.ts

@@ -1,33 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { RootSettingsStore } from '@dxos/local-storage';
-
-import { Capabilities } from '../common';
-import { type PluginContext, contributes } from '../core';
-
-export default (context: PluginContext) => {
-  // TODO(wittjosiah): Replace with atom?
-  const settingsStore = new RootSettingsStore();
-
-  let previous: Capabilities.Settings[] = [];
-  const registry = context.getCapability(Capabilities.AtomRegistry);
-  const cancel = registry.subscribe(
-    context.capabilities(Capabilities.Settings),
-    (allSettings) => {
-      const added = allSettings.filter((setting) => !previous.includes(setting));
-      const removed = previous.filter((setting) => !allSettings.includes(setting));
-      previous = allSettings;
-      added.forEach((setting) => {
-        settingsStore.createStore(setting as any);
-      });
-      removed.forEach((setting) => {
-        settingsStore.removeStore(setting.prefix);
-      });
-    },
-    { immediate: true },
-  );
-
-  return contributes(Capabilities.SettingsStore, settingsStore, () => cancel());
-};

package/src/plugin-settings/translations.ts

@@ -1,19 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { type Resource } from '../common';
-
-import { meta } from './meta';
-
-export const translations = [
-  {
-    'en-US': {
-      [meta.id]: {
-        'open settings label': 'Open settings',
-        'app settings label': 'Settings',
-        'custom plugins label': 'Plugins',
-      },
-    },
-  },
-] as const satisfies Resource[];

package/src/react/App.stories.tsx

@@ -1,33 +0,0 @@
-//
-// Copyright 2022 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-
-import { withTheme } from '@dxos/react-ui/testing';
-
-import { useApp } from './useApp';
-
-const DefaultStory = () => {
-  const App = useApp({
-    placeholder: () => <div className='fixed inset-0 flex items-center justify-center'>Loading...</div>,
-  });
-
-  return <App />;
-};
-
-const meta = {
-  title: 'sdk/app-framework/App',
-  render: DefaultStory,
-  decorators: [withTheme],
-  parameters: {
-    layout: 'fullscreen',
-  },
-} satisfies Meta;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/react/App.tsx

@@ -1,59 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { type PropsWithChildren } from 'react';
-
-import { Capabilities } from '../common';
-import { topologicalSort } from '../helpers';
-
-import { type UseAppOptions } from './useApp';
-import { useCapabilities } from './useCapabilities';
-import { LoadingState, useLoading } from './useLoading';
-
-export type AppProps = Pick<UseAppOptions, 'placeholder' | 'debounce'> & {
-  state: { ready: boolean; error: unknown };
-};
-
-export const App = ({ placeholder: Placeholder, state, debounce }: AppProps) => {
-  const reactContexts = useCapabilities(Capabilities.ReactContext);
-  const reactRoots = useCapabilities(Capabilities.ReactRoot);
-  const stage = useLoading(state, debounce);
-
-  if (state.error) {
-    // This triggers the error boundary to provide UI feedback for the startup error.
-    throw state.error;
-  }
-
-  // TODO(wittjosiah): Consider using Suspense instead.
-  if (stage < LoadingState.Done) {
-    if (!Placeholder) {
-      return null;
-    }
-
-    return <Placeholder stage={stage} />;
-  }
-
-  const ComposedContext = composeContexts(reactContexts);
-  return (
-    <ComposedContext>
-      {reactRoots.map(({ id, root: Component }) => (
-        <Component key={id} />
-      ))}
-    </ComposedContext>
-  );
-};
-
-const composeContexts = (contexts: Capabilities.ReactContext[]) => {
-  if (contexts.length === 0) {
-    return ({ children }: PropsWithChildren) => <>{children}</>;
-  }
-
-  return topologicalSort(contexts)
-    .map(({ context }) => context)
-    .reduce((Acc, Next) => ({ children }) => (
-      <Acc>
-        <Next>{children}</Next>
-      </Acc>
-    ));
-};

package/src/react/DefaultFallback.tsx

@@ -1,26 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React from 'react';
-
-/**
- * NOTE: Default fallback should not use tailwind or theme.
- */
-export const DefaultFallback = ({ error }: { error: Error }) => {
-  return (
-    <div
-      style={{
-        margin: '1rem',
-        padding: '1rem',
-        overflow: 'hidden',
-        border: '4px solid teal',
-        borderRadius: '1rem',
-      }}
-    >
-      {/* TODO(wittjosiah): Link to docs for replacing default. */}
-      <h1 style={{ margin: '0.5rem 0', fontSize: '1.2rem' }}>ERROR: {error.message}</h1>
-      <pre style={{ overflow: 'auto', fontSize: '1rem', whiteSpace: 'pre-wrap', color: '#888888' }}>{error.stack}</pre>
-    </div>
-  );
-};

package/src/react/ErrorBoundary.tsx

@@ -1,56 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { Component, type FC, type PropsWithChildren, type ReactNode } from 'react';
-
-type State = {
-  error: Error | undefined;
-};
-
-export type ErrorBoundaryProps = PropsWithChildren<{
-  data?: any;
-  fallback?: FC<{ data?: any; error: Error }>;
-}>;
-
-/**
- * Surface error boundary.
- * For basic usage prefer providing a fallback component to `Surface`.
- *
- * Ref: https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary
- */
-export class ErrorBoundary extends Component<ErrorBoundaryProps, State> {
-  static getDerivedStateFromError(error: Error): { error: Error } {
-    return { error };
-  }
-
-  override state = { error: undefined };
-
-  override componentDidUpdate(prevProps: ErrorBoundaryProps): void {
-    if (prevProps.data !== this.props.data) {
-      this.resetError();
-    }
-  }
-
-  override render(): ReactNode {
-    if (this.state.error) {
-      const Fallback = this.props.fallback ?? DefaultFallback;
-      return <Fallback data={this.props.data} error={this.state.error} />;
-    }
-
-    return this.props.children;
-  }
-
-  private resetError(): void {
-    this.setState({ error: undefined });
-  }
-}
-
-const DefaultFallback: NonNullable<ErrorBoundaryProps['fallback']> = ({ data, error }) => {
-  return (
-    <div className='flex flex-col gap-2 overflow-hidden border border-red-500 rounded-sm'>
-      <h1 className='p-2'>ERROR: {error.message}</h1>
-      <pre className='p-2 overflow-y-auto text-sm text-subdued'>{JSON.stringify(data, null, 2)}</pre>
-    </div>
-  );
-};