@dxos/plugin-kanban 0.8.4-main.e8ec1fe → 0.8.4-main.effb148878

package/dist/types/src/components/KanbanContainer.stories.d.ts

@@ -1,41 +0,0 @@
-import { type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-import { Kanban } from '@dxos/react-ui-kanban/types';
-declare const meta: {
-    title: string;
-    component: () => React.JSX.Element | null;
-    render: () => React.JSX.Element;
-    decorators: import("@storybook/react").Decorator[];
-    parameters: {
-        layout: string;
-        translations: [{
-            readonly 'en-US': {
-                readonly [Kanban.Kanban.typename]: {
-                    readonly 'typename label': "Kanban";
-                    readonly 'typename label_zero': "Kanbans";
-                    readonly 'typename label_one': "Kanban";
-                    readonly 'typename label_other': "Kanbans";
-                    readonly 'object name placeholder': "New kanban";
-                };
-                readonly [meta.id]: {
-                    readonly 'plugin name': "Kanban";
-                    readonly 'kanban title label': "Title";
-                    readonly 'column title label': "Column title";
-                    readonly 'column title placeholder': "New column";
-                    readonly 'item title label': "Item title";
-                    readonly 'item title placeholder': "New item";
-                    readonly 'add column label': "Add column";
-                    readonly 'add item label': "Add card";
-                    readonly 'delete column label': "Delete column";
-                    readonly 'delete item label': "Delete card";
-                    readonly 'card field deleted label': "Card field deleted";
-                    readonly 'card deleted label': "Card deleted";
-                };
-            };
-        }];
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-//# sourceMappingURL=KanbanContainer.stories.d.ts.map

package/dist/types/src/components/KanbanContainer.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"KanbanContainer.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/KanbanContainer.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAA2C,MAAM,OAAO,CAAC;AAkBhE,OAAO,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAyHrD,QAAA,MAAM,IAAI;;;;;;;;;yBAzIyC,CAAQ,MAAM,CAAC,MAC9D,CAAC,QAAQ,CAAC;;;;;;;yBAIK,CAAQ,IAAI,CAAC,EAAE,CAAC;;;;;;;;;;;;;;;;;CA+KK,CAAC;AAEzC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}

package/dist/types/src/components/KanbanViewEditor.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { type View } from '@dxos/schema';
-type KanbanViewEditorProps = {
-    view: View.View;
-};
-export declare const KanbanViewEditor: ({ view }: KanbanViewEditorProps) => React.JSX.Element;
-export {};
-//# sourceMappingURL=KanbanViewEditor.d.ts.map

package/dist/types/src/components/KanbanViewEditor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"KanbanViewEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/KanbanViewEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAQpD,OAAO,EAAmB,KAAK,IAAI,EAAwB,MAAM,cAAc,CAAC;AAEhF,KAAK,qBAAqB,GAAG;IAAE,IAAI,EAAE,IAAI,CAAC,IAAI,CAAA;CAAE,CAAC;AAEjD,eAAO,MAAM,gBAAgB,GAAI,UAAU,qBAAqB,sBA+C/D,CAAC"}

package/src/capabilities/intent-resolver.ts

@@ -1,71 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Capabilities, type PluginContext, contributes, createResolver } from '@dxos/app-framework';
-import { invariant } from '@dxos/invariant';
-import { ClientCapabilities } from '@dxos/plugin-client';
-import { getSpace } from '@dxos/react-client/echo';
-import { Kanban } from '@dxos/react-ui-kanban/types';
-import { ProjectionModel, getTypenameFromQuery } from '@dxos/schema';
-
-import { meta } from '../meta';
-import { KanbanAction } from '../types';
-
-export default (context: PluginContext) =>
-  contributes(Capabilities.IntentResolver, [
-    createResolver({
-      intent: KanbanAction.Create,
-      resolve: async ({ space, name, typename, initialPivotColumn }) => {
-        const client = context.getCapability(ClientCapabilities.Client);
-        const { view } = await Kanban.makeView({
-          client,
-          space,
-          name,
-          typename,
-          pivotFieldName: initialPivotColumn,
-        });
-        return { data: { object: view } };
-      },
-    }),
-    createResolver({
-      intent: KanbanAction.DeleteCardField,
-      resolve: async ({ view, fieldId, deletionData }, undo) => {
-        const schema = getSpace(view)?.db.schemaRegistry.getSchema(getTypenameFromQuery(view.query.ast)!);
-        invariant(schema);
-        const projection = new ProjectionModel(schema.jsonSchema, view.projection);
-
-        if (!undo) {
-          const { deleted, index } = projection.deleteFieldProjection(fieldId);
-          return {
-            undoable: {
-              message: ['card field deleted label', { ns: meta.id }],
-              data: { deletionData: { ...deleted, index } },
-            },
-          };
-        } else if (undo && deletionData) {
-          const { field, props, index } = deletionData;
-          projection.setFieldProjection({ field, props }, index);
-        }
-      },
-    }),
-    createResolver({
-      intent: KanbanAction.DeleteCard,
-      resolve: ({ card }, undo) => {
-        const space = getSpace(card);
-        invariant(space);
-
-        if (!undo) {
-          space.db.remove(card);
-          return {
-            undoable: {
-              message: ['card deleted label', { ns: meta.id }],
-              data: { card },
-            },
-          };
-        } else {
-          space.db.add(card);
-        }
-      },
-    }),
-  ]);

package/src/components/KanbanContainer.stories.tsx

@@ -1,194 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import React, { useCallback, useEffect, useState } from 'react';
-
-import { IntentPlugin, SettingsPlugin } from '@dxos/app-framework';
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { Obj, type QueryAST, Type } from '@dxos/echo';
-import { invariant } from '@dxos/invariant';
-import { ClientPlugin } from '@dxos/plugin-client';
-import { PreviewPlugin } from '@dxos/plugin-preview';
-import { useGlobalFilteredObjects } from '@dxos/plugin-search';
-import { SpacePlugin } from '@dxos/plugin-space';
-import { StorybookLayoutPlugin } from '@dxos/plugin-storybook-layout';
-import { ThemePlugin } from '@dxos/plugin-theme';
-import { faker } from '@dxos/random';
-import { useClient } from '@dxos/react-client';
-import { Filter, useQuery, useSchema, useSpaces } from '@dxos/react-client/echo';
-import { withTheme } from '@dxos/react-ui/testing';
-import { ViewEditor } from '@dxos/react-ui-form';
-import { Kanban as KanbanComponent, useKanbanModel } from '@dxos/react-ui-kanban';
-import { Kanban } from '@dxos/react-ui-kanban/types';
-import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
-import { defaultTx } from '@dxos/react-ui-theme';
-import { ProjectionModel, View, getTypenameFromQuery } from '@dxos/schema';
-import { Organization, Person } from '@dxos/types';
-
-import { translations } from '../translations';
-
-faker.seed(0);
-
-//
-// Story components.
-//
-
-const rollOrg = () => ({
-  name: faker.commerce.productName(),
-  description: faker.lorem.paragraph(),
-  image: faker.image.url(),
-  website: faker.internet.url(),
-  status: faker.helpers.arrayElement(Organization.StatusOptions).id as Organization.Organization['status'],
-});
-
-const StorybookKanban = () => {
-  const client = useClient();
-  const spaces = useSpaces();
-  const space = spaces[spaces.length - 1];
-  const views = useQuery(space, Filter.type(View.View));
-  const [view, setView] = useState<View.View>();
-  const [projection, setProjection] = useState<ProjectionModel>();
-  const typename = view?.query ? getTypenameFromQuery(view.query.ast) : undefined;
-  const schema = useSchema(client, space, typename);
-
-  useEffect(() => {
-    if (views.length && !view) {
-      const view = views[0];
-      setView(view);
-    }
-  }, [views]);
-
-  useEffect(() => {
-    if (view?.projection && schema) {
-      const jsonSchema = Type.toJsonSchema(schema);
-      setProjection(new ProjectionModel(jsonSchema, view.projection));
-    }
-    // TODO(ZaymonFC): Is there a better way to get notified about deep changes in the json schema?
-    //  @dmaretskyi? Once resolved, update in multiple places (e.g., storybooks).
-  }, [view?.projection, schema, JSON.stringify(schema ? Type.toJsonSchema(schema) : {})]);
-
-  const objects = useQuery(space, schema ? Filter.type(schema) : Filter.nothing());
-  const filteredObjects = useGlobalFilteredObjects(objects);
-
-  const model = useKanbanModel({
-    view,
-    schema,
-    projection,
-    items: filteredObjects,
-  });
-
-  const handleAddCard = useCallback(
-    (columnValue: string | undefined) => {
-      const path = model?.columnFieldPath;
-      if (space && schema && path) {
-        const card = Obj.make(schema, {
-          ...rollOrg(),
-          [path]: columnValue,
-        });
-
-        space.db.add(card);
-        return card.id;
-      }
-    },
-    [space, schema, model],
-  );
-
-  const handleRemoveCard = useCallback((card: { id: string }) => space.db.remove(card), [space]);
-
-  const handleUpdateQuery = useCallback(
-    (newQuery: QueryAST.Query) => {
-      invariant(schema);
-      invariant(Type.isMutable(schema));
-      invariant(view);
-
-      schema.updateTypename(getTypenameFromQuery(newQuery));
-      view.query.ast = newQuery;
-    },
-    [view, schema],
-  );
-
-  if (!schema || !view) {
-    return null;
-  }
-
-  return (
-    <div className='grow grid grid-cols-[1fr_350px]'>
-      {model ? <KanbanComponent model={model} onAddCard={handleAddCard} onRemoveCard={handleRemoveCard} /> : <div />}
-      <div className='flex flex-col bs-full border-is border-separator overflow-y-auto'>
-        <ViewEditor
-          registry={space?.db.schemaRegistry}
-          schema={schema}
-          view={view}
-          onQueryChanged={handleUpdateQuery}
-          onDelete={(fieldId: string) => {
-            console.log('[ViewEditor]', 'onDelete', fieldId);
-          }}
-        />
-        <SyntaxHighlighter language='json' className='text-xs'>
-          {JSON.stringify({ view, schema }, null, 2)}
-        </SyntaxHighlighter>
-      </div>
-    </div>
-  );
-};
-
-type StoryProps = {
-  rows?: number;
-};
-
-//
-// Story definitions.
-//
-
-const meta = {
-  title: 'plugins/plugin-kanban/Kanban',
-  component: StorybookKanban,
-  render: () => <StorybookKanban />,
-  decorators: [
-    withTheme,
-    withPluginManager({
-      plugins: [
-        ClientPlugin({
-          types: [Organization.Organization, Person.Person, View.View, Kanban.Kanban],
-          onClientInitialized: async ({ client }) => {
-            await client.halo.createIdentity();
-            const space = await client.spaces.create();
-            await space.waitUntilReady();
-            const { view } = await Kanban.makeView({
-              client,
-              space,
-              typename: Organization.Organization.typename,
-              pivotFieldName: 'status',
-            });
-            space.db.add(view);
-
-            // TODO(burdon): Replace with sdk/schema/testing.
-            Array.from({ length: 80 }).map(() => {
-              return space.db.add(Obj.make(Organization.Organization, rollOrg()));
-            });
-          },
-        }),
-        SpacePlugin({}),
-        IntentPlugin(),
-        SettingsPlugin(),
-
-        // UI
-        ThemePlugin({ tx: defaultTx }),
-        PreviewPlugin(),
-        StorybookLayoutPlugin({}),
-      ],
-    }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-    translations,
-  },
-} satisfies Meta<typeof StorybookKanban>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/components/KanbanContainer.tsx

@@ -1,96 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-
-import { createIntent } from '@dxos/app-framework';
-import { useIntentDispatcher } from '@dxos/app-framework/react';
-import { Filter, Obj, Type } from '@dxos/echo';
-import { EchoSchema, type TypedObject } from '@dxos/echo/internal';
-import { useGlobalFilteredObjects } from '@dxos/plugin-search';
-import { useClient } from '@dxos/react-client';
-import { getSpace, useQuery } from '@dxos/react-client/echo';
-import { Kanban, useKanbanModel } from '@dxos/react-ui-kanban';
-import { StackItem } from '@dxos/react-ui-stack';
-import { ProjectionModel, type View, getTypenameFromQuery } from '@dxos/schema';
-
-import { KanbanAction } from '../types';
-
-export const KanbanContainer = ({ view }: { view: View.View; role: string }) => {
-  const client = useClient();
-  const [cardSchema, setCardSchema] = useState<TypedObject<any, any>>();
-  const [projection, setProjection] = useState<ProjectionModel>();
-  const space = getSpace(view);
-  const { dispatchPromise: dispatch } = useIntentDispatcher();
-  const typename = view.query ? getTypenameFromQuery(view.query.ast) : undefined;
-
-  const jsonSchema = useMemo(() => {
-    if (!cardSchema) {
-      return undefined;
-    }
-    return cardSchema instanceof EchoSchema ? cardSchema.jsonSchema : Type.toJsonSchema(cardSchema);
-  }, [cardSchema]);
-
-  useEffect(() => {
-    const staticSchema = client.graph.schemaRegistry.schemas.find((schema) => Type.getTypename(schema) === typename);
-    if (staticSchema) {
-      setCardSchema(() => staticSchema as TypedObject<any, any>);
-    }
-    if (!staticSchema && typename && space) {
-      const query = space.db.schemaRegistry.query({ typename });
-      const unsubscribe = query.subscribe(
-        () => {
-          const [schema] = query.results;
-          if (schema) {
-            setCardSchema(schema);
-          }
-        },
-        { fire: true },
-      );
-      return unsubscribe;
-    }
-  }, [typename, space]);
-
-  useEffect(() => {
-    if (jsonSchema) {
-      setProjection(new ProjectionModel(jsonSchema, view.projection));
-    }
-    // TODO(ZaymonFC): Is there a better way to get notified about deep changes in the json schema?
-  }, [view.projection, JSON.stringify(jsonSchema)]);
-
-  const objects = useQuery(space, cardSchema ? Filter.type(cardSchema) : Filter.nothing());
-  const filteredObjects = useGlobalFilteredObjects(objects);
-
-  const model = useKanbanModel({
-    view,
-    schema: cardSchema,
-    projection,
-    items: filteredObjects,
-  });
-
-  const handleAddCard = useCallback(
-    (columnValue: string | undefined) => {
-      const path = model?.columnFieldPath;
-      if (space && cardSchema && path) {
-        const card = Obj.make(cardSchema, { [path]: columnValue });
-        space.db.add(card);
-        return card.id;
-      }
-    },
-    [space, cardSchema, model],
-  );
-
-  const handleRemoveCard = useCallback(
-    (card: { id: string }) => {
-      void dispatch(createIntent(KanbanAction.DeleteCard, { card }));
-    },
-    [dispatch],
-  );
-
-  return (
-    <StackItem.Content>
-      {model && <Kanban model={model} onAddCard={handleAddCard} onRemoveCard={handleRemoveCard} />}
-    </StackItem.Content>
-  );
-};

package/src/components/KanbanViewEditor.tsx

@@ -1,64 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { useCallback, useMemo } from 'react';
-
-import { Type } from '@dxos/echo';
-import { EchoSchema, FormatEnum } from '@dxos/echo/internal';
-import { useClient } from '@dxos/react-client';
-import { getSpace, useSchema } from '@dxos/react-client/echo';
-import { type CustomInputMap, Form, SelectInput } from '@dxos/react-ui-form';
-import { Kanban } from '@dxos/react-ui-kanban/types';
-import { ProjectionModel, type View, getTypenameFromQuery } from '@dxos/schema';
-
-type KanbanViewEditorProps = { view: View.View };
-
-export const KanbanViewEditor = ({ view }: KanbanViewEditorProps) => {
-  const client = useClient();
-  const space = getSpace(view);
-  const currentTypename = view.query ? getTypenameFromQuery(view.query.ast) : undefined;
-  const schema = useSchema(client, space, currentTypename);
-
-  const projection = useMemo(() => {
-    if (schema) {
-      const jsonSchema = schema instanceof EchoSchema ? schema.jsonSchema : Type.toJsonSchema(schema);
-      const projection = new ProjectionModel(jsonSchema, view.projection);
-      projection.normalizeView();
-      return projection;
-    }
-  }, [view.projection, JSON.stringify(schema)]);
-
-  const fieldProjections = projection?.getFieldProjections() || [];
-  const selectFields = fieldProjections
-    .filter((field) => field.props.format === FormatEnum.SingleSelect)
-    .map(({ field }) => ({ value: field.id, label: field.path }));
-
-  const handleSave = useCallback(
-    (values: Partial<{ columnFieldId: string }>) => {
-      view.projection.pivotFieldId = values.columnFieldId;
-    },
-    [view],
-  );
-
-  const initialValues = useMemo(
-    () => ({ columnFieldId: view.projection.pivotFieldId }),
-    [view.projection.pivotFieldId],
-  );
-  const custom: CustomInputMap = useMemo(
-    () => ({ columnFieldId: (props) => <SelectInput {...props} options={selectFields} /> }),
-    [selectFields],
-  );
-
-  return (
-    <Form
-      Custom={custom}
-      schema={Kanban.SettingsSchema}
-      values={initialValues}
-      onSave={handleSave}
-      autoSave
-      outerSpacing={false}
-      classNames='pbs-inputSpacingBlock'
-    />
-  );
-};