@dxos/plugin-pipeline 0.9.0 → 0.9.1-staging.ee54ba693a

package/dx.config.ts

@@ -0,0 +1,32 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { Config2 } from '@dxos/app-framework/config';
+import { trim } from '@dxos/util';
+
+export default Config2.make({
+  plugin: {
+    key: 'org.dxos.plugin.pipeline',
+    name: 'Pipelines',
+    author: 'DXOS',
+    description: trim`
+      A multi-column Kanban-style pipeline plugin for DXOS Composer.
+      Each Pipeline holds an ordered set of Columns; each Column is backed by a ViewModel whose query
+      can select any ECHO object type — messages, contacts, documents, or custom types — from the active space.
+
+      Columns are fully configurable through the Settings companion panel, where users can add, rename,
+      reorder, and delete columns and edit the underlying query and projection for each column.
+      Objects can be dragged between columns and the full pipeline state, including column order and
+      per-column item order, persists collaboratively via ECHO.
+
+      A built-in Research template scaffolds a four-column pipeline wired to the Mailbox, Contacts,
+      Organizations, and Notes objects in the space, providing an out-of-the-box CRM-style workflow.
+      Pipeline articles also expose Invocations and Automation companion tabs for AI-driven automation.
+    `,
+    source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-pipeline',
+    icon: { key: 'ph--path--regular', hue: 'purple' },
+    spec: 'PLUGIN.mdl',
+    tags: ['labs'],
+  },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-pipeline",
-  "version": "0.9.0",
+  "version": "0.9.1-staging.ee54ba693a",
   "description": "Pipeline plugin for Composer",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -81,6 +81,7 @@
   "types": "dist/types/src/index.d.ts",
   "files": [
     "dist",
+    "dx.config.ts",
     "src",
     "PLUGIN.mdl"
   ],
@@ -88,57 +89,57 @@
     "@radix-ui/react-compose-refs": "1.1.1",
     "@radix-ui/react-context": "1.1.1",
     "@radix-ui/react-slot": "1.1.2",
-    "effect": "3.21.3",
-    "@dxos/app-toolkit": "0.9.0",
-    "@dxos/compute": "0.9.0",
-    "@dxos/echo": "0.9.0",
-    "@dxos/echo-query": "0.9.0",
-    "@dxos/devtools": "0.9.0",
-    "@dxos/app-framework": "0.9.0",
-    "@dxos/effect": "0.9.0",
-    "@dxos/keys": "0.9.0",
-    "@dxos/log": "0.9.0",
-    "@dxos/plugin-client": "0.9.0",
-    "@dxos/plugin-graph": "0.9.0",
-    "@dxos/plugin-markdown": "0.9.0",
-    "@dxos/plugin-inbox": "0.9.0",
-    "@dxos/react-client": "0.9.0",
-    "@dxos/react-ui-attention": "0.9.0",
-    "@dxos/react-ui-form": "0.9.0",
-    "@dxos/react-ui-list": "0.9.0",
-    "@dxos/plugin-space": "0.9.0",
-    "@dxos/react-ui-menu": "0.9.0",
-    "@dxos/react-ui-mosaic": "0.9.0",
-    "@dxos/schema": "0.9.0",
-    "@dxos/react-ui-stack": "0.9.0",
-    "@dxos/types": "0.9.0",
-    "@dxos/util": "0.9.0"
+    "effect": "3.21.4",
+    "@dxos/app-framework": "0.9.1-staging.ee54ba693a",
+    "@dxos/app-toolkit": "0.9.1-staging.ee54ba693a",
+    "@dxos/client": "0.9.1-staging.ee54ba693a",
+    "@dxos/compute": "0.9.1-staging.ee54ba693a",
+    "@dxos/devtools": "0.9.1-staging.ee54ba693a",
+    "@dxos/echo-query": "0.9.1-staging.ee54ba693a",
+    "@dxos/effect": "0.9.1-staging.ee54ba693a",
+    "@dxos/log": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-graph": "0.9.1-staging.ee54ba693a",
+    "@dxos/keys": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-inbox": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-markdown": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-space": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-attention": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-list": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-menu": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-form": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-mosaic": "0.9.1-staging.ee54ba693a",
+    "@dxos/echo": "0.9.1-staging.ee54ba693a",
+    "@dxos/schema": "0.9.1-staging.ee54ba693a",
+    "@dxos/types": "0.9.1-staging.ee54ba693a",
+    "@dxos/util": "0.9.1-staging.ee54ba693a"
   },
   "devDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
-    "@types/react": "~19.2.7",
+    "@types/react": "~19.2.17",
     "@types/react-dom": "~19.2.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
     "vite": "^8.0.16",
-    "@dxos/plugin-inbox": "0.9.0",
-    "@dxos/plugin-preview": "0.9.0",
-    "@dxos/plugin-attention": "0.9.0",
-    "@dxos/plugin-theme": "0.9.0",
-    "@dxos/echo-client": "0.9.0",
-    "@dxos/random": "0.9.0",
-    "@dxos/plugin-testing": "0.9.0",
-    "@dxos/react-ui": "0.9.0",
-    "@dxos/ui-theme": "0.9.0",
-    "@dxos/storybook-utils": "0.9.0"
+    "@dxos/echo-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-attention": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-preview": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-testing": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-inbox": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-theme": "0.9.1-staging.ee54ba693a",
+    "@dxos/storybook-utils": "0.9.1-staging.ee54ba693a",
+    "@dxos/random": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui": "0.9.1-staging.ee54ba693a",
+    "@dxos/ui-theme": "0.9.1-staging.ee54ba693a"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
-    "effect": "3.21.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.9.0",
-    "@dxos/ui-theme": "0.9.0"
+    "effect": "3.21.4",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
+    "@dxos/react-ui": "0.9.1-staging.ee54ba693a",
+    "@dxos/ui-theme": "0.9.1-staging.ee54ba693a"
   },
   "publishConfig": {
     "access": "public"

package/src/PipelinePlugin.node.ts

@@ -6,11 +6,10 @@ import { Plugin } from '@dxos/app-framework';
 import { AppPlugin } from '@dxos/app-toolkit';
 import { Pipeline } from '@dxos/types';
 
-import { AppGraphBuilder, CreateObject } from '#capabilities';
+import { CreateObject } from '#capabilities';
 import { meta } from '#meta';
 
 export const PipelinePlugin = Plugin.define(meta).pipe(
-  AppPlugin.addAppGraphModule({ activate: AppGraphBuilder }),
   AppPlugin.addCreateObjectModule({ activate: CreateObject }),
   AppPlugin.addSchemaModule({ schema: [Pipeline.Pipeline] }),
   Plugin.make,

package/src/PipelinePlugin.test.ts

@@ -11,7 +11,7 @@ import { PipelinePlugin } from '#plugin';
 
 import { meta } from './meta';
 
-const moduleId = (name: string) => `${meta.id}.module.${name}`;
+const moduleId = (name: string) => `${meta.profile.key}.module.${name}`;
 
 describe('PipelinePlugin', () => {
   test('modules activate on the expected events', async ({ expect }) => {
@@ -19,9 +19,7 @@ describe('PipelinePlugin', () => {
       plugins: [ClientPlugin({}), PipelinePlugin()],
     });
 
-    // After autoStart: AppGraphBuilder, CreateObject, schema all auto-cascade.
-    expect(harness.manager.getActive()).toEqual(
-      expect.arrayContaining([moduleId('AppGraphBuilder'), moduleId('CreateObject'), moduleId('schema')]),
-    );
+    // After autoStart: CreateObject and schema auto-cascade.
+    expect(harness.manager.getActive()).toEqual(expect.arrayContaining([moduleId('CreateObject'), moduleId('schema')]));
   });
 });

package/src/PipelinePlugin.tsx

@@ -6,7 +6,7 @@ import { Plugin } from '@dxos/app-framework';
 import { AppPlugin } from '@dxos/app-toolkit';
 import { Pipeline } from '@dxos/types';
 
-import { AppGraphBuilder, CreateObject, ReactSurface } from '#capabilities';
+import { CreateObject, ReactSurface } from '#capabilities';
 import { meta } from '#meta';
 import { translations } from '#translations';
 
@@ -14,13 +14,12 @@ import { translations } from '#translations';
 import pluginSpec from '../PLUGIN.mdl?raw';
 
 export const PipelinePlugin = Plugin.define(meta).pipe(
-  AppPlugin.addAppGraphModule({ activate: AppGraphBuilder }),
   AppPlugin.addCreateObjectModule({ activate: CreateObject }),
   AppPlugin.addSchemaModule({ schema: [Pipeline.Pipeline] }),
   AppPlugin.addSurfaceModule({ activate: ReactSurface }),
   AppPlugin.addTranslationsModule({ translations }),
   AppPlugin.addPluginAssetModule({
-    asset: { pluginId: meta.id, path: 'PLUGIN.mdl', content: pluginSpec, mimeType: 'application/x-mdl' },
+    asset: { pluginId: meta.profile.key, path: 'PLUGIN.mdl', content: pluginSpec, mimeType: 'application/x-mdl' },
   }),
   Plugin.make,
 );

package/src/capabilities/create-object.ts

@@ -21,7 +21,6 @@ export default Capability.makeModule(
           return yield* Operation.invoke(SpaceOperation.AddObject, {
             object,
             target: options.target,
-            hidden: true,
             targetNodeId: options.targetNodeId,
           });
         }),

package/src/capabilities/index.ts

@@ -4,6 +4,5 @@
 
 import { Capability } from '@dxos/app-framework';
 
-export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
 export const CreateObject = Capability.lazy('CreateObject', () => import('./create-object'));
 export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));

package/src/capabilities/react-surface.tsx

@@ -8,9 +8,6 @@ import React from 'react';
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface } from '@dxos/app-toolkit/ui';
-import { InvocationTraceContainer } from '@dxos/devtools';
-import { Obj } from '@dxos/echo';
-import { Panel } from '@dxos/react-ui';
 import { Pipeline } from '@dxos/types';
 
 import { PipelineArticle, PipelineProperties } from '#containers';
@@ -25,28 +22,10 @@ export default Capability.makeModule(() =>
           <PipelineArticle role={role} subject={data.subject} attendableId={data.attendableId} />
         ),
       }),
-      Surface.create({
-        id: 'companion.invocations',
-        filter: AppSurface.allOf(
-          AppSurface.literal(AppSurface.Article, 'invocations'),
-          AppSurface.companion(AppSurface.Article, Pipeline.Pipeline),
-        ),
-        component: ({ data, role }) => {
-          const db = Obj.getDatabase(data.companionTo);
-          // TODO(wittjosiah): Filter the invocations to those relevant to the project.
-          return (
-            <Panel.Root role={role} className='dx-document'>
-              <Panel.Content asChild>
-                <InvocationTraceContainer db={db} detailAxis='block' />
-              </Panel.Content>
-            </Panel.Root>
-          );
-        },
-      }),
       Surface.create({
         id: 'objectProperties',
         filter: AppSurface.object(AppSurface.ObjectProperties, Pipeline.Pipeline),
-        component: ({ data }) => <PipelineProperties pipeline={data.subject} />,
+        component: ({ data }) => <PipelineProperties subject={data.subject} />,
       }),
     ]),
   ),

package/src/components/PipelineComponent/PipelineColumn.tsx

@@ -8,8 +8,8 @@ import React, { forwardRef, useMemo, useRef, useState } from 'react';
 import { resolveSchemaWithRegistry } from '@dxos/app-toolkit/query';
 import { Filter, Obj, Query, Type } from '@dxos/echo';
 import { useObject } from '@dxos/react-client/echo';
-import { Panel, Toolbar, useAsyncEffect, useTranslation } from '@dxos/react-ui';
-import { Card } from '@dxos/react-ui';
+import { Panel, useAsyncEffect, useTranslation } from '@dxos/react-ui';
+import { Card, Icon, IconButton } from '@dxos/react-ui';
 import { Menu } from '@dxos/react-ui-menu';
 import { Board, Focus, Mosaic, type MosaicTileProps } from '@dxos/react-ui-mosaic';
 import { ProjectionModel, createEchoChangeCallback } from '@dxos/schema';
@@ -29,7 +29,7 @@ export type PipelineColumnProps = Pick<MosaicTileProps<Pipeline.Column>, 'classN
 
 // TODO(wittjosiah): Support item DnD reordering (ordering needs to be stored on the view presentation collection).
 export const PipelineColumn = ({ data: column, location, classNames, debug }: PipelineColumnProps) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const [dragHandle, setDragHandle] = useState<HTMLButtonElement | null>(null);
   // Subscribe to the view target for reactivity.
   const [viewSnapshot] = useObject(column.view);
@@ -88,7 +88,7 @@ export const PipelineColumn = ({ data: column, location, classNames, debug }: Pi
         <Panel.Toolbar asChild>
           <Board.Column.Header
             classNames='_opacity-10'
-            label={column.name || t('untitled-view.title')}
+            label={column.name || t('untitled-column.title')}
             dragHandleRef={setDragHandle}
           />
         </Panel.Toolbar>
@@ -125,20 +125,17 @@ const ItemTile = forwardRef<HTMLDivElement, ItemTileProps>(
           <Focus.Item asChild>
             <Card.Root classNames={classNames} ref={composedRef}>
               <Card.Header>
-                <Card.Icon icon={icon} />
+                <Card.Block>
+                  <Icon icon={icon} />
+                </Card.Block>
                 <Card.Title>{Obj.getLabel(data, { fallback: 'typename' })}</Card.Title>
                 {/* TODO(wittjosiah): Reconcile with Card.Menu. */}
-                <Card.IconBlock>
+                <Card.Block end>
                   <Menu.Trigger asChild>
-                    <Toolbar.IconButton
-                      iconOnly
-                      variant='ghost'
-                      icon='ph--dots-three-vertical--regular'
-                      label='Actions'
-                    />
+                    <IconButton iconOnly variant='ghost' icon='ph--dots-three-vertical--regular' label='Actions' />
                   </Menu.Trigger>
                   <Menu.Content />
-                </Card.IconBlock>
+                </Card.Block>
               </Card.Header>
               <Card.Body>
                 <Item {...itemProps} />

package/src/components/PipelineComponent/PipelineComponent.tsx

@@ -112,7 +112,7 @@ PipelineColumns.displayName = PIPELINE_COLUMNS_NAME;
 const PIPELINE_TOOLBAR_NAME = 'Pipeline.Toolbar';
 
 export const PipelineToolbar = composable<HTMLDivElement, ToolbarRootProps>(({ children, ...props }, forwardedRef) => {
-  const { t } = useTranslation(meta.id);
+  const { t } = useTranslation(meta.profile.key);
   const { onAddColumn } = usePipeline(PIPELINE_TOOLBAR_NAME);
 
   return (
@@ -137,4 +137,4 @@ export const PipelineComponent = {
 
 export { usePipeline };
 
-export type { ItemProps, PipelineContextValue, PipelineRootProps, PipelineContentProps, PipelineColumnsProps };
+export type { ItemProps, PipelineColumnsProps, PipelineContentProps, PipelineContextValue, PipelineRootProps };

package/src/containers/PipelineArticle/PipelineArticle.stories.tsx

@@ -4,12 +4,10 @@
 
 import { type Meta, type StoryObj } from '@storybook/react-vite';
 import * as Effect from 'effect/Effect';
-import * as Layer from 'effect/Layer';
 import React from 'react';
 
 import { withPluginManager } from '@dxos/app-framework/testing';
 import { Collection, Database, Feed, Filter, JsonSchema, Obj, Query, Ref, Scope, Tag, View } from '@dxos/echo';
-import { createFeedServiceLayer } from '@dxos/echo-client';
 import { ClientPlugin } from '@dxos/plugin-client/plugin';
 import { initializeIdentity } from '@dxos/plugin-client/testing';
 import { InboxPlugin } from '@dxos/plugin-inbox/plugin';
@@ -17,7 +15,6 @@ import { PreviewPlugin } from '@dxos/plugin-preview/testing';
 import { StorybookPlugin, corePlugins } from '@dxos/plugin-testing';
 import { random } from '@dxos/random';
 import { useDatabase, useQuery } from '@dxos/react-client/echo';
-import { translations as stackTranslations } from '@dxos/react-ui-stack/translations';
 import { withLayout } from '@dxos/react-ui/testing';
 import { ViewModel } from '@dxos/schema';
 import { createObjectFactory } from '@dxos/schema/testing';
@@ -42,7 +39,9 @@ const DefaultStory = () => {
   return (
     <div className='grow grid grid-cols-[1fr_350px] overflow-hidden h-full w-full'>
       <PipelineArticle role='article' subject={pipeline} attendableId='test' />
-      <PipelineProperties pipeline={pipeline} classNames='border-s border-separator' />
+      <div className='overflow-y-auto border-is border-separator'>
+        <PipelineProperties subject={pipeline} />
+      </div>
     </div>
   );
 };
@@ -200,11 +199,7 @@ const meta = {
                   }),
                 );
               }
-            }).pipe(
-              Effect.provide(
-                Layer.merge(Database.layer(personalSpace.db), createFeedServiceLayer(personalSpace.queues)),
-              ),
-            );
+            }).pipe(Effect.provide(Database.layer(personalSpace.db)));
           }),
         }),
         InboxPlugin(),
@@ -214,7 +209,7 @@ const meta = {
   ],
   parameters: {
     layout: 'fullscreen',
-    translations: [...translations, ...stackTranslations],
+    translations,
   },
 } satisfies Meta<typeof PipelineArticle>;
 

package/src/containers/PipelineArticle/PipelineArticle.tsx

@@ -73,7 +73,7 @@ const PipelineItem = ({ item, projectionModel }: ItemProps) => {
 
   return (
     <Surface.Surface
-      type={AppSurface.Card}
+      type={AppSurface.CardContent}
       data={{
         subject: item,
         projection: projectionModel,

package/src/containers/PipelineProperties/PipelineProperties.stories.tsx

@@ -0,0 +1,145 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import * as Effect from 'effect/Effect';
+import React from 'react';
+
+import { withPluginManager } from '@dxos/app-framework/testing';
+import { Collection, Database, Feed, Filter, JsonSchema, Obj, Query, Ref, Scope, Tag, View } from '@dxos/echo';
+import { ClientPlugin } from '@dxos/plugin-client/plugin';
+import { initializeIdentity } from '@dxos/plugin-client/testing';
+import { PreviewPlugin } from '@dxos/plugin-preview/testing';
+import { corePlugins } from '@dxos/plugin-testing';
+import { random } from '@dxos/random';
+import { useQuery, useSpaces } from '@dxos/react-client/echo';
+import { ObjectProperties } from '@dxos/react-ui-form';
+import { translations as formTranslations } from '@dxos/react-ui-form/translations';
+import { Loading, withLayout, withTheme } from '@dxos/react-ui/testing';
+import { ViewModel } from '@dxos/schema';
+import { createObjectFactory } from '@dxos/schema/testing';
+import { Message, Organization, Person, Pipeline, Task } from '@dxos/types';
+
+import { translations } from '#translations';
+
+import { PipelineProperties } from './PipelineProperties';
+
+random.seed(0);
+
+const DefaultStory = () => {
+  const [space] = useSpaces();
+  const pipelines = useQuery(space?.db, Filter.type(Pipeline.Pipeline));
+  const pipeline = pipelines.find((pipeline) => (pipeline.columns?.length ?? 0) > 0);
+  if (!pipeline) {
+    return <Loading data={{ pipelines: pipelines.length }} />;
+  }
+
+  return (
+    <ObjectProperties object={pipeline}>
+      <PipelineProperties subject={pipeline} />
+    </ObjectProperties>
+  );
+};
+
+const meta = {
+  title: 'plugins/plugin-pipeline/containers/PipelineProperties',
+  render: DefaultStory,
+  decorators: [
+    withTheme(),
+    withLayout({ layout: 'column' }),
+    withPluginManager({
+      plugins: [
+        ...corePlugins(),
+        ClientPlugin({
+          types: [
+            Tag.Tag,
+            Feed.Feed,
+            Pipeline.Pipeline,
+            View.View,
+            Collection.Collection,
+            Organization.Organization,
+            Task.Task,
+            Person.Person,
+            Message.Message,
+          ],
+          onClientInitialized: Effect.fnUntraced(function* ({ client }) {
+            const { personalSpace } = yield* initializeIdentity(client);
+
+            yield* Effect.gen(function* () {
+              const tag = yield* Database.add(Tag.make({ label: 'important', hue: 'green' }));
+              const tagUri = Obj.getURI(tag);
+
+              // Create a view for Contacts.
+              const personView = ViewModel.make({
+                query: Query.select(Filter.type(Person.Person)),
+                jsonSchema: JsonSchema.toJsonSchema(Person.Person),
+              });
+
+              // Create a view for Organizations.
+              const organizationView = ViewModel.make({
+                query: Query.select(Filter.type(Organization.Organization)).select(Filter.tag(tagUri)),
+                jsonSchema: JsonSchema.toJsonSchema(Organization.Organization),
+              });
+
+              // Create a view for Tasks.
+              const taskView = ViewModel.make({
+                query: Query.select(Filter.type(Task.Task)).select(Filter.tag(tagUri)),
+                jsonSchema: JsonSchema.toJsonSchema(Task.Task),
+              });
+
+              // Create a feed for Messages.
+              const messageFeed = yield* Database.add(Feed.make({ name: 'Messages' }));
+              const messageView = ViewModel.make({
+                query: Query.select(Filter.type(Message.Message)).from(Scope.feed(Obj.getURI(messageFeed))),
+                jsonSchema: JsonSchema.toJsonSchema(Message.Message),
+              });
+
+              // Create pipeline with columns.
+              const pipeline = Pipeline.make({
+                columns: [
+                  {
+                    name: 'Contacts',
+                    view: Ref.make(personView),
+                    order: [],
+                  },
+                  {
+                    name: 'Organizations',
+                    view: Ref.make(organizationView),
+                    order: [],
+                  },
+                  {
+                    name: 'Tasks',
+                    view: Ref.make(taskView),
+                    order: [],
+                  },
+                  {
+                    name: 'Messages',
+                    view: Ref.make(messageView),
+                    order: [],
+                  },
+                ],
+              });
+              yield* Database.add(pipeline);
+
+              // Generate sample Contacts.
+              const factory = createObjectFactory(personalSpace.db, random as any);
+              yield* Effect.promise(() => factory([{ type: Person.Person, count: 12 }]));
+            }).pipe(Effect.provide(Database.layer(personalSpace.db)));
+          }),
+        }),
+        PreviewPlugin(),
+      ],
+    }),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+    translations: [...translations, ...formTranslations],
+  },
+} satisfies Meta<typeof PipelineProperties>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};