@dxos/react-ui-mosaic 0.4.10-main.fa5a270 → 0.4.10-main.fd4f2a3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/types/src/testing/generator.d.ts +5 -5
  2. package/dist/types/src/testing/generator.d.ts.map +1 -1
  3. package/dist/types/src/views/Kanban/testing.d.ts +0 -8
  4. package/dist/types/src/views/Kanban/testing.d.ts.map +1 -1
  5. package/package.json +19 -17
  6. package/src/testing/generator.ts +36 -28
  7. package/src/views/Demo/Echo.stories.tsx +4 -4
  8. package/src/views/Kanban/Echo.stories.tsx +23 -23
  9. package/src/views/Kanban/testing.tsx +149 -153
package/dist/types/src/testing/generator.d.ts CHANGED
@@ -1,12 +1,12 @@
1
- import { Schema } from '@dxos/client/echo';
2
- import { type TypedObject } from '@dxos/echo-schema';
1
+ import type * as S from '@effect/schema/Schema';
2
+ import * as E from '@dxos/echo-schema';
3
3
  export declare const range: <T>(fn: (i: number) => T | undefined, length: number) => T[];
4
4
  export type TestItem = {
5
5
  id: string;
6
6
  type: string;
7
7
  } & Record<string, any>;
8
- type ObjectFactory<T extends TypedObject> = {
9
- schema?: Schema;
8
+ type ObjectFactory<T extends E.EchoReactiveObject<any>> = {
9
+ schema?: S.Schema<any>;
10
10
  createObject: () => T;
11
11
  };
12
12
  type ObjectFactoryMap = {
@@ -23,7 +23,7 @@ export declare class TestObjectGenerator {
23
23
  types?: string[];
24
24
  factories?: ObjectFactoryMap;
25
25
  });
26
- get schema(): Schema[];
26
+ get schema(): S.Schema<any>[];
27
27
  createObject({ types }?: {
28
28
  types?: string[];
29
29
  }): any;
package/dist/types/src/testing/generator.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../../src/testing/generator.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAW,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAI9D,eAAO,MAAM,KAAK,cAAe,MAAM,4BAA4B,MAAM,QAG9C,CAAC;AAE5B,MAAM,MAAM,QAAQ,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAO1E,KAAK,aAAa,CAAC,CAAC,SAAS,WAAW,IAAI;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC,CAAC;CACvB,CAAC;AAEF,KAAK,gBAAgB,GAAG;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAA;CAAE,CAAC;AAW/D,eAAO,MAAM,MAAM,UAAgC,CAAC;AACpD,eAAO,MAAM,QAAQ,UAAkB,CAAC;AAiDxC;;GAEG;AACH,qBAAa,mBAAmB;IAC9B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;gBAEhC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,SAAS,CAAC,EAAE,gBAAgB,CAAA;KAAO;IASzF,IAAI,MAAM,IAAI,MAAM,EAAE,CAErB;IAED,YAAY,CAAC,EAAE,KAAK,EAAE,GAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;KAAO;IAMjD,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE;CAGtE"}
1
+ {"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../../src/testing/generator.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,KAAK,CAAC,MAAM,uBAAuB,CAAC;AAEhD,OAAO,KAAK,CAAC,MAAM,mBAAmB,CAAC;AAIvC,eAAO,MAAM,KAAK,cAAe,MAAM,4BAA4B,MAAM,QAG9C,CAAC;AAE5B,MAAM,MAAM,QAAQ,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAO1E,KAAK,aAAa,CAAC,CAAC,SAAS,CAAC,CAAC,kBAAkB,CAAC,GAAG,CAAC,IAAI;IACxD,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC,CAAC;CACvB,CAAC;AAEF,KAAK,gBAAgB,GAAG;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAA;CAAE,CAAC;AAW/D,eAAO,MAAM,MAAM,UAAgC,CAAC;AACpD,eAAO,MAAM,QAAQ,UAAkB,CAAC;AAwDxC;;GAEG;AACH,qBAAa,mBAAmB;IAC9B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;gBAEhC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,SAAS,CAAC,EAAE,gBAAgB,CAAA;KAAO;IASzF,IAAI,MAAM,IAAI,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAE5B;IAED,YAAY,CAAC,EAAE,KAAK,EAAE,GAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;KAAO;IAMjD,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE;CAGtE"}
package/dist/types/src/views/Kanban/testing.d.ts CHANGED
@@ -1,7 +1,5 @@
1
1
  import { type FC } from 'react';
2
- import { type PublicKey } from '@dxos/react-client';
3
2
  import { type KanbanProps } from './Kanban';
4
- import { TestObjectGenerator } from '../../testing';
5
3
  export type DemoKanbanProps = Omit<KanbanProps, 'columns'> & {
6
4
  types?: string[];
7
5
  count?: number;
@@ -11,10 +9,4 @@ export declare const DemoKanban: FC<DemoKanbanProps>;
11
9
  export declare const columnValues: {
12
10
  [property: string]: any[];
13
11
  };
14
- export declare const EchoKanban: ({ id, spaceKey, generator, debug, }: {
15
- id: string;
16
- spaceKey: PublicKey;
17
- generator: TestObjectGenerator;
18
- debug?: boolean | undefined;
19
- }) => JSX.Element;
20
12
  //# sourceMappingURL=testing.d.ts.map
package/dist/types/src/views/Kanban/testing.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"testing.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/testing.tsx"],"names":[],"mappings":"AAKA,OAAc,EAAE,KAAK,EAAE,EAAoB,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAKpD,OAAO,EAA6B,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEvE,OAAO,EAAE,mBAAmB,EAA+C,MAAM,eAAe,CAAC;AAWjG,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA6C1C,CAAC;AAGF,eAAO,MAAM,YAAY,EAAE;IAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,EAAE,CAAA;CAGrD,CAAC;AAEF,eAAO,MAAM,UAAU;QAMjB,MAAM;cACA,SAAS;eACR,mBAAmB;;iBA+G/B,CAAC"}
1
+ {"version":3,"file":"testing.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/testing.tsx"],"names":[],"mappings":"AAIA,OAAc,EAAE,KAAK,EAAE,EAAY,MAAM,OAAO,CAAC;AAIjD,OAAO,EAA6B,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAavE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA6C1C,CAAC;AAGF,eAAO,MAAM,YAAY,EAAE;IAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,EAAE,CAAA;CAGrD,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dxos/react-ui-mosaic",
3
- "version": "0.4.10-main.fa5a270",
3
+ "version": "0.4.10-main.fd4f2a3",
4
4
  "description": "An intermediate interface for drag-and-drop interactions.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
@@ -19,20 +19,22 @@
19
19
  "@dnd-kit/modifiers": "^6.0.0",
20
20
  "@dnd-kit/sortable": "^7.0.1",
21
21
  "@dnd-kit/utilities": "^3.2.0",
22
+ "@effect/schema": "0.64.7",
22
23
  "@preact/signals-core": "^1.6.0",
23
24
  "@radix-ui/react-compose-refs": "^1.0.0",
25
+ "effect": "2.4.9",
24
26
  "lodash.defaultsdeep": "^4.6.1",
25
27
  "lodash.pick": "^4.4.0",
26
28
  "react-resize-detector": "^7.1.2",
27
- "@dxos/invariant": "0.4.10-main.fa5a270",
28
- "@dxos/react-ui": "0.4.10-main.fa5a270",
29
- "@dxos/keys": "0.4.10-main.fa5a270",
30
- "@dxos/debug": "0.4.10-main.fa5a270",
31
- "@dxos/react-ui-theme": "0.4.10-main.fa5a270",
32
- "@dxos/react-ui-card": "0.4.10-main.fa5a270",
33
- "@dxos/util": "0.4.10-main.fa5a270",
34
- "@dxos/react-ui-types": "0.4.10-main.fa5a270",
35
- "@dxos/log": "0.4.10-main.fa5a270"
29
+ "@dxos/debug": "0.4.10-main.fd4f2a3",
30
+ "@dxos/keys": "0.4.10-main.fd4f2a3",
31
+ "@dxos/invariant": "0.4.10-main.fd4f2a3",
32
+ "@dxos/react-ui": "0.4.10-main.fd4f2a3",
33
+ "@dxos/log": "0.4.10-main.fd4f2a3",
34
+ "@dxos/react-ui-card": "0.4.10-main.fd4f2a3",
35
+ "@dxos/react-ui-theme": "0.4.10-main.fd4f2a3",
36
+ "@dxos/react-ui-types": "0.4.10-main.fd4f2a3",
37
+ "@dxos/util": "0.4.10-main.fd4f2a3"
36
38
  },
37
39
  "devDependencies": {
38
40
  "@phosphor-icons/react": "^2.0.5",
@@ -44,14 +46,14 @@
44
46
  "d3": "^7.8.5",
45
47
  "react": "^18.2.0",
46
48
  "react-dom": "^18.2.0",
47
- "vite": "^5.1.5",
49
+ "vite": "^5.1.7",
48
50
  "vite-plugin-turbosnap": "^1.0.2",
49
- "@dxos/app-graph": "0.4.10-main.fa5a270",
50
- "@dxos/echo-schema": "0.4.10-main.fa5a270",
51
- "@dxos/gem-core": "0.4.10-main.fa5a270",
52
- "@dxos/react-client": "0.4.10-main.fa5a270",
53
- "@dxos/storybook-utils": "0.4.10-main.fa5a270",
54
- "@dxos/random": "0.4.10-main.fa5a270"
51
+ "@dxos/app-graph": "0.4.10-main.fd4f2a3",
52
+ "@dxos/gem-core": "0.4.10-main.fd4f2a3",
53
+ "@dxos/react-client": "0.4.10-main.fd4f2a3",
54
+ "@dxos/echo-schema": "0.4.10-main.fd4f2a3",
55
+ "@dxos/storybook-utils": "0.4.10-main.fd4f2a3",
56
+ "@dxos/random": "0.4.10-main.fd4f2a3"
55
57
  },
56
58
  "peerDependencies": {
57
59
  "@phosphor-icons/react": "^2.0.5",
package/src/testing/generator.ts CHANGED
@@ -4,8 +4,9 @@
4
4
 
5
5
  // TODO(burdon): Reconcile with @dxos/echo-generator.
6
6
 
7
- import { Schema } from '@dxos/client/echo';
8
- import { Expando, type TypedObject } from '@dxos/echo-schema';
7
+ import type * as S from '@effect/schema/Schema';
8
+
9
+ import * as E from '@dxos/echo-schema';
9
10
  import { faker } from '@dxos/random';
10
11
 
11
12
  // TODO(burdon): Util.
@@ -17,12 +18,12 @@ export const range = <T>(fn: (i: number) => T | undefined, length: number): T[]
17
18
  export type TestItem = { id: string; type: string } & Record<string, any>;
18
19
 
19
20
  type ObjectDataGenerator = {
20
- createSchema?: () => Schema;
21
+ createSchema?: () => S.Schema<any>;
21
22
  createData: () => any;
22
23
  };
23
24
 
24
- type ObjectFactory<T extends TypedObject> = {
25
- schema?: Schema; // TODO(burdon): Support both typed and expando schema.
25
+ type ObjectFactory<T extends E.EchoReactiveObject<any>> = {
26
+ schema?: S.Schema<any>; // TODO(burdon): Support both typed and expando schema.
26
27
  createObject: () => T;
27
28
  };
28
29
 
@@ -32,7 +33,7 @@ const createFactory = ({ createSchema, createData }: ObjectDataGenerator) => {
32
33
  const schema = createSchema?.();
33
34
  return {
34
35
  schema,
35
- createObject: () => new Expando(createData(), { schema }),
36
+ createObject: () => (schema ? E.object(schema, createData()) : E.object(createData())),
36
37
  };
37
38
  };
38
39
 
@@ -57,27 +58,34 @@ const defaultGenerators: { [type: string]: ObjectDataGenerator } = {
57
58
  },
58
59
 
59
60
  project: {
60
- createSchema: () =>
61
- new Schema({
62
- props: [
63
- {
64
- id: 'title',
65
- type: Schema.PropType.STRING,
66
- },
67
- {
68
- id: 'repo',
69
- type: Schema.PropType.STRING,
70
- },
71
- {
72
- id: 'status',
73
- type: Schema.PropType.STRING,
74
- },
75
- {
76
- id: 'priority',
77
- type: Schema.PropType.NUMBER,
78
- },
79
- ],
80
- }),
61
+ // createSchema: () =>
62
+ // return object(StoredEchoSchema, {
63
+ // typename: 'Project',
64
+ // version: '0.1.0',
65
+ // jsonSchema: effectToJsonSchema(
66
+ //
67
+ // ),
68
+ // })
69
+ // new Schema({
70
+ // props: [
71
+ // {
72
+ // id: 'title',
73
+ // type: Schema.PropType.STRING,
74
+ // },
75
+ // {
76
+ // id: 'repo',
77
+ // type: Schema.PropType.STRING,
78
+ // },
79
+ // {
80
+ // id: 'status',
81
+ // type: Schema.PropType.STRING,
82
+ // },
83
+ // {
84
+ // id: 'priority',
85
+ // type: Schema.PropType.NUMBER,
86
+ // },
87
+ // ],
88
+ // }),
81
89
  createData: () => ({
82
90
  title: faker.commerce.productName(),
83
91
  repo: faker.datatype.boolean({ probability: 0.3 }) ? faker.internet.url() : undefined,
@@ -102,7 +110,7 @@ export class TestObjectGenerator {
102
110
  }, {});
103
111
  }
104
112
 
105
- get schema(): Schema[] {
113
+ get schema(): S.Schema<any>[] {
106
114
  return Object.values(this.factories).map((f) => f.schema!);
107
115
  }
108
116
 
package/src/views/Demo/Echo.stories.tsx CHANGED
@@ -6,13 +6,13 @@ import React, { type FC } from 'react';
6
6
 
7
7
  import { faker } from '@dxos/random';
8
8
  import { type PublicKey } from '@dxos/react-client';
9
- import { Expando } from '@dxos/react-client/echo';
9
+ import * as E from '@dxos/react-client/echo';
10
10
  import { ClientRepeater } from '@dxos/react-client/testing';
11
11
  import { withTheme } from '@dxos/storybook-utils';
12
12
 
13
13
  import { Mosaic } from '../../mosaic';
14
14
  import { FullscreenDecorator, TestObjectGenerator, range, Status, Priority } from '../../testing';
15
- import { EchoKanban } from '../Kanban/testing';
15
+ // import { EchoKanban } from '../Kanban/testing';
16
16
  // import { GraphTree } from '../Tree/testing';
17
17
 
18
18
  faker.seed(3);
@@ -32,7 +32,7 @@ const Story: FC<{ spaceKey: PublicKey }> = ({ spaceKey }) => {
32
32
  <div className='flex grow overflow-hidden'>
33
33
  <div className='flex shrink-0 w-[280px] overflow-hidden'>{/* <GraphTree id='graph' debug={debug} /> */}</div>
34
34
  <div className='flex grow overflow-hidden'>
35
- <EchoKanban id='projects' spaceKey={spaceKey} generator={generator} debug={debug} />
35
+ {/* <EchoKanban id='projects' spaceKey={spaceKey} generator={generator} debug={debug} /> */}
36
36
  </div>
37
37
  </div>
38
38
  </Mosaic.Root>
@@ -49,7 +49,7 @@ export default {
49
49
  const objects = [
50
50
  factory.schema,
51
51
  ...range(factory.createObject, 10),
52
- new Expando({
52
+ E.object({
53
53
  type: 'kanban',
54
54
  title: 'Projects',
55
55
  schema: factory.schema,
package/src/views/Kanban/Echo.stories.tsx CHANGED
@@ -5,16 +5,16 @@
5
5
  import React from 'react';
6
6
 
7
7
  import { type PublicKey } from '@dxos/react-client';
8
- import { Expando } from '@dxos/react-client/echo';
8
+ // import { Expando } from '@dxos/react-client/echo';
9
9
  import { ClientRepeater } from '@dxos/react-client/testing';
10
10
  import { withTheme } from '@dxos/storybook-utils';
11
11
 
12
12
  import { Kanban } from './Kanban';
13
- import { EchoKanban, columnValues } from './testing';
13
+ // import { EchoKanban, columnValues } from './testing';
14
14
  import { Mosaic } from '../../mosaic';
15
- import { FullscreenDecorator, TestObjectGenerator, range } from '../../testing';
15
+ import { FullscreenDecorator /* TestObjectGenerator, range */ } from '../../testing';
16
16
 
17
- const generator = new TestObjectGenerator();
17
+ // const generator = new TestObjectGenerator();
18
18
 
19
19
  const Story = ({
20
20
  // TODO(wittjosiah): Can't use id because of ClientSpaceDecorator.
@@ -29,7 +29,7 @@ const Story = ({
29
29
  return (
30
30
  <Mosaic.Root debug={debug}>
31
31
  <Mosaic.DragOverlay />
32
- <EchoKanban id={basePath} spaceKey={spaceKey} generator={generator} debug={debug} />
32
+ {/* <EchoKanban id={basePath} spaceKey={spaceKey} generator={generator} debug={debug} /> */}
33
33
  </Mosaic.Root>
34
34
  );
35
35
  };
@@ -39,25 +39,25 @@ export default {
39
39
  component: Kanban,
40
40
  render: () => (
41
41
  <ClientRepeater
42
- onCreateSpace={async (space) => {
43
- const factory = generator.factories.project;
44
- const objects = [
45
- factory.schema,
46
- ...range(factory.createObject, 10),
47
- new Expando({
48
- type: 'kanban',
49
- title: 'Projects',
50
- schema: factory.schema,
51
- // TODO(burdon): Standardize with other story.
52
- columnProp: 'status',
53
- columnValues: columnValues.status,
54
- objectPosition: {}, // TODO(burdon): Make this a CRDT.
55
- }),
56
- ];
42
+ // onCreateSpace={async (space) => {
43
+ // const factory = generator.factories.project;
44
+ // const objects = [
45
+ // factory.schema,
46
+ // ...range(factory.createObject, 10),
47
+ // new Expando({
48
+ // type: 'kanban',
49
+ // title: 'Projects',
50
+ // schema: factory.schema,
51
+ // // TODO(burdon): Standardize with other story.
52
+ // columnProp: 'status',
53
+ // columnValues: columnValues.status,
54
+ // objectPosition: {}, // TODO(burdon): Make this a CRDT.
55
+ // }),
56
+ // ];
57
57
 
58
- // TODO(burdon): Batch API.
59
- objects.forEach((object) => space.db.add(object));
60
- }}
58
+ // // TODO(burdon): Batch API.
59
+ // objects.forEach((object) => space.db.add(object));
60
+ // }}
61
61
  component={Story}
62
62
  createSpace
63
63
  />
package/src/views/Kanban/testing.tsx CHANGED
@@ -2,18 +2,13 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { Plus } from '@phosphor-icons/react';
6
- import React, { type FC, useRef, useState } from 'react';
5
+ import React, { type FC, useState } from 'react';
7
6
 
8
7
  import { invariant } from '@dxos/invariant';
9
- import { type PublicKey } from '@dxos/react-client';
10
- import { Schema, type TypedObject, useQuery, useSpace } from '@dxos/react-client/echo';
11
- import { Button, Select, Toolbar } from '@dxos/react-ui';
12
- import { arrayMove } from '@dxos/util';
13
8
 
14
9
  import { Kanban, type KanbanColumn, type KanbanProps } from './Kanban';
15
10
  import { Mosaic, type MosaicDropEvent, Path, swapItems } from '../../mosaic';
16
- import { TestObjectGenerator, SimpleCard, Priority, Status, type TestItem } from '../../testing';
11
+ import { TestObjectGenerator, Priority, Status, type TestItem } from '../../testing';
17
12
 
18
13
  const createKanban = ({ types, columns = 3 }: { types?: string[]; columns?: number }) => {
19
14
  const generator = new TestObjectGenerator({ types });
@@ -83,149 +78,150 @@ export const columnValues: { [property: string]: any[] } = {
83
78
  priority: ['unknown', ...Priority],
84
79
  };
85
80
 
86
- export const EchoKanban = ({
87
- id,
88
- spaceKey,
89
- generator,
90
- debug,
91
- }: {
92
- id: string;
93
- spaceKey: PublicKey;
94
- generator: TestObjectGenerator;
95
- debug?: boolean;
96
- }) => {
97
- const space = useSpace(spaceKey);
98
- // TODO(burdon): Decorator is not re-run schema is empty when returning to story after first run. Different kanban id.
99
- const [kanban] = useQuery(space, { type: 'kanban' });
100
-
101
- const getProperty = (property: string) => {
102
- const schemaProperty = kanban.schema.props.find((prop: any) => prop.id === kanban.columnProp);
103
- if (schemaProperty.type === Schema.PropType.NUMBER) {
104
- return parseInt(property);
105
- } else {
106
- return property;
107
- }
108
- };
109
-
110
- const objects = useQuery<TypedObject>(space, (object) => object.__schema === kanban.schema, {}, [kanban.schema]);
111
- const columns: KanbanColumn<TypedObject>[] = kanban.columnValues.map((value: string) => {
112
- const objectPosition = kanban.objectPosition[value] ?? [];
113
- const items =
114
- objectPosition.length > 0
115
- ? objectPosition.map((id: string) => objects.find((object) => object.id === id))
116
- : objects;
117
-
118
- // TODO(burdon): Special case for 'unknown' values?
119
- return {
120
- id: getProperty(value),
121
- title: value,
122
- items: items.filter((object: TypedObject) => object[kanban.columnProp] === value),
123
- };
124
- });
125
-
126
- // TODO(burdon): Why ref?
127
- const columnsRef = useRef<KanbanColumn<TypedObject>[]>([]);
128
- columnsRef.current = columns;
129
-
130
- // TODO(burdon): Called for each object generated (should batch?)
131
- // console.log(JSON.stringify(objects[0]));
132
-
133
- // TODO(burdon): Should views maintain an positional index map per property (to enable switching?)
134
- // TODO(burdon): Is the current index map making use of ECHO object CRDT? Need multi-peer test in this suite.
135
- const handleSetProperty = (property: string) => {
136
- kanban.columnProp = property;
137
- kanban.columnValues = columnValues[kanban.columnProp];
138
- };
139
-
140
- // TODO(burdon): Factor out util.
141
- const getOrder = (kanban: TypedObject, property: string) => {
142
- // TODO(wittjosiah): Columns is stale here.
143
- return (
144
- kanban.objectPosition[property] ??
145
- columnsRef.current.find((column) => column.id === getProperty(property))?.items.map((item) => item.id) ??
146
- []
147
- );
148
- };
149
-
150
- // TODO(burdon): Currently broken: factor out with demo story.
151
- const handleDrop = ({ active, over }: MosaicDropEvent<number>) => {
152
- // Reorder columns.
153
- // TODO(burdon): Factor out util.
154
- if (active.path === Path.create(id, active.item.id)) {
155
- // Reorder columns.
156
- const fromIndex = kanban.columnValues.findIndex((value: string) => value === active.item.id);
157
- const toIndex = kanban.columnValues.findIndex((value: string) => value === over.item.id);
158
- fromIndex !== -1 && toIndex !== -1 && arrayMove(kanban.columnValues, fromIndex, toIndex);
159
- return;
160
- }
161
-
162
- if (Path.hasDescendent(id, active.path)) {
163
- const activeProperty = Path.last(Path.parent(active.path));
164
- const overProperty = Path.length(over.path) > 2 ? Path.last(Path.parent(over.path)) : Path.last(over.path);
165
- invariant(activeProperty);
166
- invariant(overProperty);
167
-
168
- // Update property.
169
- (active.item as TypedObject)[kanban.columnProp] = getProperty(overProperty);
170
-
171
- // Update active column order.
172
- const activeOrder = getOrder(kanban, activeProperty);
173
- activeOrder.length > 0 && activeOrder.splice(active.position, 1);
174
- kanban.objectPosition[activeProperty] = activeOrder;
175
-
176
- // Update over column order.
177
- const overOrder = getOrder(kanban, overProperty);
178
- overOrder.length > 0 && Path.length(over.path) === Path.length(active.path)
179
- ? overOrder.splice(over.position, 0, active.item.id)
180
- : overOrder.push(active.item.id);
181
- kanban.objectPosition[overProperty] = overOrder;
182
- }
183
- };
184
-
185
- const handleAddData = () => {
186
- const object = generator.createObject({ types: ['project'] });
187
- space?.db.add(object);
188
- };
189
-
190
- return (
191
- <div className='flex flex-col grow'>
192
- <Toolbar.Root classNames='p-2'>
193
- <PropertySelector
194
- property={kanban.columnProp}
195
- properties={Object.keys(columnValues)}
196
- onSetProperty={handleSetProperty}
197
- />
198
- <Button title='Add Data' onClick={handleAddData}>
199
- <Plus />
200
- </Button>
201
- </Toolbar.Root>
202
- <Kanban id={id} columns={columns} Component={SimpleCard} onDrop={handleDrop} debug={debug} />
203
- </div>
204
- );
205
- };
206
-
207
- const PropertySelector: FC<{ property: string; properties: string[]; onSetProperty: (property: string) => void }> = ({
208
- property,
209
- properties,
210
- onSetProperty,
211
- }) => {
212
- return (
213
- <Select.Root value={property} onValueChange={onSetProperty}>
214
- <Select.TriggerButton placeholder='Select value' />
215
- <Select.Portal>
216
- <Select.Content>
217
- <Select.ScrollUpButton />
218
- <Select.Viewport>
219
- {properties.map((property) => (
220
- <Select.Option key={property} value={property}>
221
- {property}
222
- </Select.Option>
223
- ))}
224
- </Select.Viewport>
225
- <Select.ScrollDownButton />
226
- <Select.Arrow />
227
- </Select.Content>
228
- </Select.Portal>
229
- </Select.Root>
230
- );
231
- };
81
+ // TODO(wittjosiah): Update to use effect schema.
82
+ // export const EchoKanban = ({
83
+ // id,
84
+ // spaceKey,
85
+ // generator,
86
+ // debug,
87
+ // }: {
88
+ // id: string;
89
+ // spaceKey: PublicKey;
90
+ // generator: TestObjectGenerator;
91
+ // debug?: boolean;
92
+ // }) => {
93
+ // const space = useSpace(spaceKey);
94
+ // // TODO(burdon): Decorator is not re-run schema is empty when returning to story after first run. Different kanban id.
95
+ // const [kanban] = useQuery(space, { type: 'kanban' });
96
+
97
+ // const getProperty = (property: string) => {
98
+ // const schemaProperty = kanban.schema.props.find((prop: any) => prop.id === kanban.columnProp);
99
+ // if (schemaProperty.type === Schema.PropType.NUMBER) {
100
+ // return parseInt(property);
101
+ // } else {
102
+ // return property;
103
+ // }
104
+ // };
105
+
106
+ // const objects = useQuery<TypedObject>(space, (object) => object.__schema === kanban.schema, {}, [kanban.schema]);
107
+ // const columns: KanbanColumn<TypedObject>[] = kanban.columnValues.map((value: string) => {
108
+ // const objectPosition = kanban.objectPosition[value] ?? [];
109
+ // const items =
110
+ // objectPosition.length > 0
111
+ // ? objectPosition.map((id: string) => objects.find((object) => object.id === id))
112
+ // : objects;
113
+
114
+ // // TODO(burdon): Special case for 'unknown' values?
115
+ // return {
116
+ // id: getProperty(value),
117
+ // title: value,
118
+ // items: items.filter((object: TypedObject) => object[kanban.columnProp] === value),
119
+ // };
120
+ // });
121
+
122
+ // // TODO(burdon): Why ref?
123
+ // const columnsRef = useRef<KanbanColumn<TypedObject>[]>([]);
124
+ // columnsRef.current = columns;
125
+
126
+ // // TODO(burdon): Called for each object generated (should batch?)
127
+ // // console.log(JSON.stringify(objects[0]));
128
+
129
+ // // TODO(burdon): Should views maintain an positional index map per property (to enable switching?)
130
+ // // TODO(burdon): Is the current index map making use of ECHO object CRDT? Need multi-peer test in this suite.
131
+ // const handleSetProperty = (property: string) => {
132
+ // kanban.columnProp = property;
133
+ // kanban.columnValues = columnValues[kanban.columnProp];
134
+ // };
135
+
136
+ // // TODO(burdon): Factor out util.
137
+ // const getOrder = (kanban: TypedObject, property: string) => {
138
+ // // TODO(wittjosiah): Columns is stale here.
139
+ // return (
140
+ // kanban.objectPosition[property] ??
141
+ // columnsRef.current.find((column) => column.id === getProperty(property))?.items.map((item) => item.id) ??
142
+ // []
143
+ // );
144
+ // };
145
+
146
+ // // TODO(burdon): Currently broken: factor out with demo story.
147
+ // const handleDrop = ({ active, over }: MosaicDropEvent<number>) => {
148
+ // // Reorder columns.
149
+ // // TODO(burdon): Factor out util.
150
+ // if (active.path === Path.create(id, active.item.id)) {
151
+ // // Reorder columns.
152
+ // const fromIndex = kanban.columnValues.findIndex((value: string) => value === active.item.id);
153
+ // const toIndex = kanban.columnValues.findIndex((value: string) => value === over.item.id);
154
+ // fromIndex !== -1 && toIndex !== -1 && arrayMove(kanban.columnValues, fromIndex, toIndex);
155
+ // return;
156
+ // }
157
+
158
+ // if (Path.hasDescendent(id, active.path)) {
159
+ // const activeProperty = Path.last(Path.parent(active.path));
160
+ // const overProperty = Path.length(over.path) > 2 ? Path.last(Path.parent(over.path)) : Path.last(over.path);
161
+ // invariant(activeProperty);
162
+ // invariant(overProperty);
163
+
164
+ // // Update property.
165
+ // (active.item as TypedObject)[kanban.columnProp] = getProperty(overProperty);
166
+
167
+ // // Update active column order.
168
+ // const activeOrder = getOrder(kanban, activeProperty);
169
+ // activeOrder.length > 0 && activeOrder.splice(active.position, 1);
170
+ // kanban.objectPosition[activeProperty] = activeOrder;
171
+
172
+ // // Update over column order.
173
+ // const overOrder = getOrder(kanban, overProperty);
174
+ // overOrder.length > 0 && Path.length(over.path) === Path.length(active.path)
175
+ // ? overOrder.splice(over.position, 0, active.item.id)
176
+ // : overOrder.push(active.item.id);
177
+ // kanban.objectPosition[overProperty] = overOrder;
178
+ // }
179
+ // };
180
+
181
+ // const handleAddData = () => {
182
+ // const object = generator.createObject({ types: ['project'] });
183
+ // space?.db.add(object);
184
+ // };
185
+
186
+ // return (
187
+ // <div className='flex flex-col grow'>
188
+ // <Toolbar.Root classNames='p-2'>
189
+ // <PropertySelector
190
+ // property={kanban.columnProp}
191
+ // properties={Object.keys(columnValues)}
192
+ // onSetProperty={handleSetProperty}
193
+ // />
194
+ // <Button title='Add Data' onClick={handleAddData}>
195
+ // <Plus />
196
+ // </Button>
197
+ // </Toolbar.Root>
198
+ // <Kanban id={id} columns={columns} Component={SimpleCard} onDrop={handleDrop} debug={debug} />
199
+ // </div>
200
+ // );
201
+ // };
202
+
203
+ // const PropertySelector: FC<{ property: string; properties: string[]; onSetProperty: (property: string) => void }> = ({
204
+ // property,
205
+ // properties,
206
+ // onSetProperty,
207
+ // }) => {
208
+ // return (
209
+ // <Select.Root value={property} onValueChange={onSetProperty}>
210
+ // <Select.TriggerButton placeholder='Select value' />
211
+ // <Select.Portal>
212
+ // <Select.Content>
213
+ // <Select.ScrollUpButton />
214
+ // <Select.Viewport>
215
+ // {properties.map((property) => (
216
+ // <Select.Option key={property} value={property}>
217
+ // {property}
218
+ // </Select.Option>
219
+ // ))}
220
+ // </Select.Viewport>
221
+ // <Select.ScrollDownButton />
222
+ // <Select.Arrow />
223
+ // </Select.Content>
224
+ // </Select.Portal>
225
+ // </Select.Root>
226
+ // );
227
+ // };