@dxos/plugin-debug 0.8.0 → 0.8.1-main.013e445

package/src/components/DebugSpace/DebugSpace.tsx

@@ -1,183 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { type FC, useContext, useMemo, useState } from 'react';
-
-import { createSpaceObjectGenerator } from '@dxos/echo-generator';
-import { type ReactiveObject } from '@dxos/live-object';
-import { DocumentType } from '@dxos/plugin-markdown/types';
-import { Invitation } from '@dxos/protocols/proto/dxos/client/services';
-import { faker } from '@dxos/random';
-import { useClient } from '@dxos/react-client';
-import { Filter, type Space, useSpaceInvitation } from '@dxos/react-client/echo';
-import { InvitationEncoder } from '@dxos/react-client/invitations';
-import { useAsyncEffect } from '@dxos/react-hooks';
-import { Icon, IconButton, Input, type IconProps, type TextInputProps, Toolbar, useFileDownload } from '@dxos/react-ui';
-import { safeParseInt } from '@dxos/util';
-
-import { ObjectCreator } from './ObjectCreator';
-import { DebugContext } from '../../types';
-import { Container } from '../Container';
-
-const DEFAULT_COUNT = 100;
-const DEFAULT_PERIOD = 500;
-const DEFAULT_JITTER = 50;
-
-const useRefresh = (): [any, () => void] => {
-  const [update, setUpdate] = useState({});
-  return [update, () => setUpdate({})];
-};
-
-const CustomInput = ({ icon, ...props }: Pick<IconProps, 'icon'> & TextInputProps) => {
-  return (
-    <div role='none' className='relative'>
-      <Input.Root>
-        <Input.TextInput classNames='w-[100px] text-right pie-[22px]' size={5} {...props} />
-      </Input.Root>
-      <Icon icon={icon} size={3} classNames='absolute inline-end-1 block-start-1 mt-[6px]' />
-    </div>
-  );
-};
-
-export const DebugSpace: FC<{
-  space: Space;
-  onAddObjects?: (objects: ReactiveObject<any>[]) => void;
-}> = ({ space, onAddObjects }) => {
-  const { connect } = useSpaceInvitation(space?.key);
-  const client = useClient();
-  const [data, setData] = useState<any>({});
-
-  const [update, handleUpdate] = useRefresh();
-  useAsyncEffect(
-    async (isMounted) => {
-      const data = await client.diagnostics({ truncate: true });
-      if (isMounted()) {
-        setData(
-          data?.diagnostics?.spaces?.find(({ key }: any) => {
-            return space.key.toHex().startsWith(key);
-          }),
-        );
-      }
-    },
-    [space, update],
-  );
-
-  const download = useFileDownload();
-  const handleDownload = async () => {
-    download(
-      new Blob([JSON.stringify(data, undefined, 2)], { type: 'text/plain' }),
-      `${new Date().toISOString().replace(/\W/g, '-')}.json`,
-    );
-  };
-
-  const [mutationCount, setMutationCount] = useState(String(DEFAULT_COUNT));
-  const [mutationInterval, setMutationInterval] = useState(String(DEFAULT_PERIOD));
-  const [mutationJitter, setMutationJitter] = useState(String(DEFAULT_JITTER));
-
-  const generator = useMemo(() => createSpaceObjectGenerator(space), [space]);
-
-  // TODO(burdon): Note: this is shared across all spaces!
-  const { running, start, stop } = useContext(DebugContext);
-  const handleToggleRunning = () => {
-    if (running) {
-      stop();
-      handleUpdate();
-    } else {
-      start(
-        async () => {
-          const { objects } = await space.db.query(Filter.schema(DocumentType)).run();
-          if (objects.length) {
-            const object = faker.helpers.arrayElement(objects);
-            await generator.mutateObject(object, { count: 10, mutationSize: 10, maxContentLength: 1000 });
-          }
-        },
-        {
-          count: safeParseInt(mutationCount) ?? 0,
-          interval: safeParseInt(mutationInterval) ?? 0,
-          jitter: safeParseInt(mutationJitter) ?? 0,
-        },
-      );
-    }
-  };
-
-  const handleCreateInvitation = () => {
-    const invitation = space.share({
-      type: Invitation.Type.INTERACTIVE,
-      authMethod: Invitation.AuthMethod.NONE,
-      multiUse: true,
-    });
-
-    // TODO(burdon): Refactor.
-    // TODO(burdon): Unsubscribe?
-    connect(invitation);
-    const code = InvitationEncoder.encode(invitation.get());
-    new URL(window.origin).searchParams.set('spaceInvitationCode', code);
-    const url = `${window.origin}?spaceInvitationCode=${code}`;
-    void navigator.clipboard.writeText(url);
-  };
-
-  const handleCreateEpoch = async () => {
-    await space.internal.createEpoch();
-    handleUpdate();
-  };
-
-  return (
-    <Container
-      toolbar={
-        <Toolbar.Root classNames='p-1'>
-          <CustomInput
-            icon='ph--flag--regular'
-            autoComplete='off'
-            placeholder='Count'
-            value={mutationCount}
-            onChange={({ target: { value } }) => setMutationCount(value)}
-          />
-          <CustomInput
-            icon='ph--timer--regular'
-            autoComplete='off'
-            placeholder='Interval'
-            value={mutationInterval}
-            onChange={({ target: { value } }) => setMutationInterval(value)}
-          />
-          <CustomInput
-            icon='ph--plus-minus--regular'
-            autoComplete='off'
-            placeholder='Jitter'
-            value={mutationJitter}
-            onChange={({ target: { value } }) => setMutationJitter(value)}
-          />
-
-          <IconButton
-            icon={running ? 'ph--pause-circle--regular' : 'ph--play-circle--regular'}
-            iconOnly
-            label='Start/stop'
-            size={5}
-            onClick={handleToggleRunning}
-          />
-          <IconButton icon='ph--arrow-clockwise--regular' iconOnly label='Refresh' size={5} onClick={handleUpdate} />
-          <IconButton icon='ph--download-simple--regular' iconOnly label='Download' size={5} onClick={handleDownload} />
-
-          <Toolbar.Separator variant='gap' />
-          <IconButton
-            icon='ph--flag-pennant--regular'
-            iconOnly
-            label='Create epoch'
-            size={5}
-            onClick={handleCreateEpoch}
-          />
-          <IconButton
-            icon='ph--user-circle-plus--regular'
-            iconOnly
-            iconClassNames='text-blue-500'
-            label='Create Invitation'
-            size={5}
-            onClick={handleCreateInvitation}
-          />
-        </Toolbar.Root>
-      }
-    >
-      <ObjectCreator space={space} onAddObjects={onAddObjects} />
-    </Container>
-  );
-};

package/src/components/DebugSpace/ObjectCreator.stories.tsx

@@ -1,51 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import '@dxos-theme';
-
-import { type Meta } from '@storybook/react';
-import React from 'react';
-
-import { createSpaceObjectGenerator } from '@dxos/echo-generator';
-import { log } from '@dxos/log';
-import { useSpaces } from '@dxos/react-client/echo';
-import { withClientProvider } from '@dxos/react-client/testing';
-import { useAsyncEffect } from '@dxos/react-hooks';
-import { render, withLayout, withTheme } from '@dxos/storybook-utils';
-
-import { ObjectCreator, type ObjectCreatorProps } from './ObjectCreator';
-
-const DefaultStory = () => {
-  const [space] = useSpaces();
-  useAsyncEffect(async () => {
-    if (space) {
-      const generator = createSpaceObjectGenerator(space);
-      await generator.addSchemas();
-    }
-  }, [space]);
-
-  const handleCreate: ObjectCreatorProps['onAddObjects'] = (objects) => {
-    log.info('created', { objects });
-  };
-
-  if (!space) {
-    return null;
-  }
-
-  return <ObjectCreator space={space} onAddObjects={handleCreate} />;
-};
-
-const meta: Meta = {
-  title: 'plugins/plugin-debug/ObjectCreator',
-  component: ObjectCreator,
-  render: render(DefaultStory),
-  decorators: [withClientProvider({ createSpace: true }), withLayout({ tooltips: true }), withTheme],
-  parameters: {
-    layout: 'fullscreen',
-  },
-};
-
-export default meta;
-
-export const Default = {};

package/src/components/DebugSpace/ObjectCreator.tsx

@@ -1,100 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { useMemo, useState } from 'react';
-
-import { type MutationsProviderParams, TestSchemaType, createSpaceObjectGenerator } from '@dxos/echo-generator';
-import { type ReactiveEchoObject, type ReactiveObject, type Space } from '@dxos/react-client/echo';
-import { IconButton, Toolbar } from '@dxos/react-ui';
-import { createColumnBuilder, type TableColumnDef, Table } from '@dxos/react-ui-table/deprecated';
-
-const BATCH_SIZE = 10;
-
-export type CreateObjectsParams = {
-  schema: string;
-  enabled: boolean;
-  objects: number;
-  mutations: Pick<MutationsProviderParams, 'count' | 'mutationSize' | 'maxContentLength'>;
-};
-
-export type ObjectCreatorProps = {
-  space: Space;
-  onAddObjects?: (objects: ReactiveObject<any>[]) => void;
-};
-
-export const ObjectCreator = ({ space, onAddObjects }: ObjectCreatorProps) => {
-  const generator = useMemo(() => createSpaceObjectGenerator(space), [space]);
-
-  const [objects, setObjects] = useState<CreateObjectsParams[]>(
-    Object.values(TestSchemaType).map((schema) => ({
-      schema,
-      enabled: true,
-      objects: 10,
-      mutations: {
-        count: 10,
-        mutationSize: 10,
-        maxContentLength: 1000,
-      },
-    })),
-  );
-
-  const handleCreate = async () => {
-    for (const params of objects) {
-      if (!params.enabled) {
-        continue;
-      }
-
-      let objectsCreated = 0;
-      while (objectsCreated < params.objects) {
-        const objects = (await generator.createObjects({
-          [params.schema]: Math.min(BATCH_SIZE, params.objects - objectsCreated),
-        })) as ReactiveEchoObject<any>[];
-
-        await generator.mutateObjects(objects, params.mutations);
-        objectsCreated += objects.length;
-        onAddObjects?.(objects);
-      }
-    }
-
-    await space.db.flush();
-  };
-
-  const handleUpdate = (row: CreateObjectsParams, key: string, value: any) => {
-    const newObjects = [...objects];
-    Object.assign(newObjects.find((object) => object.schema === row.schema)!, { [key]: value });
-    setObjects(newObjects);
-  };
-
-  const { helper, builder } = createColumnBuilder<CreateObjectsParams>();
-  const columns: TableColumnDef<CreateObjectsParams>[] = [
-    helper.accessor('enabled', builder.switch({ label: 'Live', onUpdate: handleUpdate })),
-    helper.accessor('schema', builder.string({ label: 'Schema', classNames: 'font-mono' })),
-    helper.accessor('objects', builder.number({ label: 'Objects', onUpdate: handleUpdate })),
-    helper.accessor((obj) => obj.mutations.count, {
-      id: 'mutations',
-      ...builder.number({ label: 'Mutations', onUpdate: handleUpdate }),
-    }),
-    helper.accessor((obj) => obj.mutations.mutationSize, {
-      id: 'mutationSize',
-      ...builder.number({ label: 'Mut. Size', onUpdate: handleUpdate }),
-    }),
-    helper.accessor((obj) => obj.mutations.maxContentLength, {
-      id: 'mutationMaxContentLength',
-      ...builder.number({ label: 'Length', onUpdate: handleUpdate }),
-    }),
-  ];
-
-  return (
-    <>
-      <Table.Root>
-        <Table.Viewport>
-          <Table.Main<CreateObjectsParams> columns={columns} data={objects} />
-        </Table.Viewport>
-      </Table.Root>
-      <Toolbar.Root classNames='p-1'>
-        <IconButton icon='ph--plus--regular' label='Create' onClick={handleCreate} />
-      </Toolbar.Root>
-    </>
-  );
-};

package/src/components/DebugSpace/index.ts

@@ -1,7 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { DebugSpace } from './DebugSpace';
-
-export default DebugSpace;