@dxos/plugin-debug 0.8.4-main.bc674ce → 0.8.4-main.bcb3aa67d6

package/src/components/DebugSettings.tsx

@@ -1,185 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { useEffect, useState } from 'react';
-
-import { Common } from '@dxos/app-framework';
-import { useCapabilities } from '@dxos/app-framework/react';
-import { type ConfigProto, SaveConfig, Storage, defs } from '@dxos/config';
-import { log } from '@dxos/log';
-import { useClient } from '@dxos/react-client';
-import { Icon, IconButton, Input, Select, Toast, useFileDownload, useTranslation } from '@dxos/react-ui';
-import { ControlGroup, ControlItemInput, ControlPage, ControlSection } from '@dxos/react-ui-form';
-import { setDeep } from '@dxos/util';
-
-import { meta } from '../meta';
-import { type DebugSettingsProps } from '../types';
-
-type Toast = {
-  title: string;
-  description?: string;
-};
-
-const StorageAdapters = {
-  opfs: defs.Runtime.Client.Storage.StorageDriver.WEBFS,
-  idb: defs.Runtime.Client.Storage.StorageDriver.IDB,
-} as const;
-
-export type DebugSettingsComponentProps = {
-  settings: DebugSettingsProps;
-  onSettingsChange: (fn: (current: DebugSettingsProps) => DebugSettingsProps) => void;
-};
-
-export const DebugSettings = ({ settings, onSettingsChange }: DebugSettingsComponentProps) => {
-  const { t } = useTranslation(meta.id);
-  const [toast, setToast] = useState<Toast>();
-  const client = useClient();
-  const download = useFileDownload();
-  // TODO(mykola): Get updates from other places that change Config.
-  const [storageConfig, setStorageConfig] = useState<ConfigProto>({});
-  const [upload] = useCapabilities(Common.Capability.FileUploader);
-
-  useEffect(() => {
-    void Storage().then((config) => setStorageConfig(config));
-  }, []);
-
-  const handleToast = (toast: Toast) => {
-    setToast(toast);
-    const t = setTimeout(() => setToast(undefined), 5_000);
-    return () => clearTimeout(t);
-  };
-
-  const handleDownload = async () => {
-    const data = await client.diagnostics();
-    const file = new Blob([JSON.stringify(data, undefined, 2)], {
-      type: 'text/plain',
-    });
-    const fileName = `composer-${new Date().toISOString().replace(/\W/g, '-')}.json`;
-    download(file, fileName);
-
-    if (upload) {
-      const info = await upload(client.spaces.default.db, new File([file], fileName));
-      if (!info) {
-        log.error('diagnostics failed to upload to IPFS');
-        return;
-      }
-      handleToast({
-        title: t('settings uploaded'),
-        description: t('settings uploaded to clipboard'),
-      });
-
-      // TODO(nf): move to IpfsPlugin?
-      const url = client.config.values.runtime!.services!.ipfs!.gateway + '/' + info.cid;
-      void navigator.clipboard.writeText(url);
-      handleToast({
-        title: t('settings uploaded'),
-        description: t('settings uploaded to clipboard'),
-      });
-      log.info('diagnostics', { url });
-    }
-  };
-
-  const handleRepair = async () => {
-    try {
-      const info = await client.repair();
-      setStorageConfig(await Storage());
-      handleToast({
-        title: t('settings repair success'),
-        description: JSON.stringify(info, undefined, 2),
-      });
-    } catch (err: any) {
-      handleToast({
-        title: t('settings repair failed'),
-        description: err.message,
-      });
-    }
-  };
-
-  return (
-    <ControlPage>
-      <ControlSection title={t('settings title', { ns: meta.id })}>
-        <ControlGroup>
-          <ControlItemInput title={t('settings wireframe')}>
-            <Input.Switch
-              checked={settings.wireframe}
-              onCheckedChange={(checked) => onSettingsChange((s) => ({ ...s, wireframe: !!checked }))}
-            />
-          </ControlItemInput>
-          <ControlItemInput title={t('settings download diagnostics')}>
-            <IconButton
-              icon='ph--download-simple--regular'
-              iconOnly
-              label={t('settings download diagnostics')}
-              onClick={handleDownload}
-            />
-          </ControlItemInput>
-          <ControlItemInput title={t('settings repair')}>
-            <IconButton
-              icon='ph--first-aid-kit--regular'
-              iconOnly
-              label={t('settings repair')}
-              onClick={handleRepair}
-            />
-          </ControlItemInput>
-
-          {/* TODO(burdon): Move to layout? */}
-          {toast && (
-            <Toast.Root>
-              <Toast.Body>
-                <Toast.Title>
-                  <Icon icon='ph--gift--duotone' size={5} classNames='inline mr-1' />
-                  <span>{toast.title}</span>
-                </Toast.Title>
-                {toast.description && <Toast.Description>{toast.description}</Toast.Description>}
-              </Toast.Body>
-            </Toast.Root>
-          )}
-
-          <ControlItemInput title={t('settings choose storage adaptor')}>
-            <Select.Root
-              value={
-                Object.entries(StorageAdapters).find(
-                  ([_name, value]) => value === storageConfig?.runtime?.client?.storage?.dataStore,
-                )?.[0]
-              }
-              onValueChange={(value) => {
-                if (confirm(t('settings storage adapter changed alert'))) {
-                  updateConfig(
-                    storageConfig,
-                    setStorageConfig,
-                    ['runtime', 'client', 'storage', 'dataStore'],
-                    StorageAdapters[value as keyof typeof StorageAdapters],
-                  );
-                }
-              }}
-            >
-              <Select.TriggerButton placeholder={t('settings data store label')} />
-              <Select.Portal>
-                <Select.Content>
-                  <Select.Viewport>
-                    {Object.keys(StorageAdapters).map((key) => (
-                      <Select.Option key={key} value={key}>
-                        {t(`settings storage adaptor ${key} label`)}
-                      </Select.Option>
-                    ))}
-                  </Select.Viewport>
-                  <Select.Arrow />
-                </Select.Content>
-              </Select.Portal>
-            </Select.Root>
-          </ControlItemInput>
-        </ControlGroup>
-      </ControlSection>
-    </ControlPage>
-  );
-};
-
-const updateConfig = (config: ConfigProto, setConfig: (newConfig: ConfigProto) => void, path: string[], value: any) => {
-  const storageConfigCopy = JSON.parse(JSON.stringify(config ?? {}));
-  setDeep(storageConfigCopy, path, value);
-  setConfig(storageConfigCopy);
-  queueMicrotask(async () => {
-    await SaveConfig(storageConfigCopy);
-  });
-};

package/src/components/DevtoolsOverviewContainer.tsx

@@ -1,20 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React from 'react';
-
-import { Surface } from '@dxos/app-framework/react';
-import { StatsPanel, useStats } from '@dxos/devtools';
-
-export const DevtoolsOverviewContainer = () => {
-  const [stats, refreshStats] = useStats();
-
-  return (
-    <StatsPanel stats={stats} onRefresh={refreshStats}>
-      <Surface role='devtools-overview' />
-    </StatsPanel>
-  );
-};
-
-export default DevtoolsOverviewContainer;

package/src/components/SpaceGenerator/SpaceGenerator.stories.tsx

@@ -1,54 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import * as Effect from 'effect/Effect';
-import React from 'react';
-
-import { OperationPlugin } from '@dxos/app-framework';
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { ClientPlugin } from '@dxos/plugin-client';
-import { useSpaces } from '@dxos/react-client/echo';
-import { withTheme } from '@dxos/react-ui/testing';
-import { render } from '@dxos/storybook-utils';
-
-import { SpaceGenerator } from './SpaceGenerator';
-
-const DefaultStory = () => {
-  const [space] = useSpaces();
-  if (!space) {
-    return null;
-  }
-
-  return <SpaceGenerator space={space} />;
-};
-
-const meta = {
-  title: 'plugins/plugin-debug/SpaceGenerator',
-  component: SpaceGenerator as any,
-  render: render(DefaultStory),
-  decorators: [
-    withTheme,
-    withPluginManager({
-      plugins: [
-        ClientPlugin({
-          onClientInitialized: ({ client }) =>
-            Effect.gen(function* () {
-              yield* Effect.promise(() => client.halo.createIdentity());
-            }),
-        }),
-        OperationPlugin(),
-      ],
-    }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-  },
-} satisfies Meta<typeof DefaultStory>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/components/SpaceGenerator/SpaceGenerator.tsx

@@ -1,127 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React, { useCallback, useMemo, useState } from 'react';
-
-import { useOperationInvoker } from '@dxos/app-framework/react';
-import { ComputeGraph } from '@dxos/conductor';
-import { Filter, Obj, type Type } from '@dxos/echo';
-import { Markdown } from '@dxos/plugin-markdown/types';
-import { Sheet } from '@dxos/plugin-sheet/types';
-import { Diagram } from '@dxos/plugin-sketch/types';
-import { useClient } from '@dxos/react-client';
-import { type Space } from '@dxos/react-client/echo';
-import { IconButton, Input, Toolbar, useAsyncEffect } from '@dxos/react-ui';
-import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
-import { Organization, Person, Task } from '@dxos/types';
-import { jsonKeyReplacer, sortKeys } from '@dxos/util';
-
-import { type ObjectGenerator, createGenerator, staticGenerators } from './ObjectGenerator';
-import { generator } from './presets';
-import { SchemaTable } from './SchemaTable';
-
-export type SpaceGeneratorProps = {
-  space: Space;
-  onCreateObjects?: (objects: Obj.Unknown[]) => void;
-};
-
-export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps) => {
-  const { invokePromise } = useOperationInvoker();
-  const client = useClient();
-  const staticTypes = [Markdown.Document, Diagram.Diagram, Sheet.Sheet, ComputeGraph]; // TODO(burdon): Make extensible.
-  const recordTypes: Type.Obj.Any[] = [Organization.Organization, Person.Person, Task.Task];
-  const [count, setCount] = useState(1);
-  const [info, setInfo] = useState<any>({});
-  const presets = useMemo(() => generator(), []);
-
-  // Register types.
-  useAsyncEffect(async () => {
-    await client.addTypes([...staticTypes, ...recordTypes, ...presets.schemas]);
-  }, [client]);
-
-  // Create type generators.
-  const typeMap = useMemo(() => {
-    const recordGenerators = new Map<string, ObjectGenerator<any>>(
-      recordTypes.map((type) => [type.typename, createGenerator(client, invokePromise, type)]),
-    );
-
-    return new Map([...staticGenerators, ...presets.items, ...recordGenerators]);
-  }, [client, recordTypes, invokePromise]);
-
-  // Query space to get info.
-  const updateInfo = async () => {
-    // Create schema map.
-    const echoSchema = await space.db.schemaRegistry.query().run();
-    const staticSchema = await space.db.graph.schemaRegistry.query().run();
-
-    // Create object map.
-    const objects = await space.db.query(Filter.everything()).run();
-    const objectMap = sortKeys(
-      objects.reduce<Record<string, number>>((map, obj) => {
-        const type = Obj.getTypename(obj);
-        if (type) {
-          const count = map[type] ?? 0;
-          map[type] = count + 1;
-        }
-
-        return map;
-      }, {}),
-    );
-
-    setInfo({
-      schema: {
-        static: staticSchema.length,
-        mutable: echoSchema.length,
-      },
-      objects: objectMap,
-    });
-  };
-
-  useAsyncEffect(updateInfo, [space]);
-
-  const handleCreateData = useCallback(
-    async (typename: string) => {
-      const constructor = typeMap.get(typename);
-      if (constructor) {
-        // TODO(burdon): Input to specify number of objects.
-        await constructor(space, count, onCreateObjects);
-        await updateInfo();
-      }
-    },
-    [typeMap, count],
-  );
-
-  return (
-    <div role='none' className='flex flex-col grow overflow-hidden'>
-      <Toolbar.Root classNames='border-be border-subduedSeparator'>
-        <IconButton icon='ph--arrow-clockwise--regular' iconOnly label='Refresh' onClick={updateInfo} />
-        <Toolbar.Separator variant='gap' />
-        <Input.Root>
-          <Input.TextInput
-            type='number'
-            min={1}
-            max={100}
-            placeholder={'Count'}
-            classNames='!w-[4rem] !text-right'
-            size={8}
-            value={count}
-            onChange={(ev) => setCount(parseInt(ev.target.value))}
-          />
-        </Input.Root>
-      </Toolbar.Root>
-
-      <div className='flex flex-col overflow-y-auto divide-y divide-separator'>
-        <SchemaTable types={staticTypes} objects={info.objects} label='Static Types' onClick={handleCreateData} />
-        <SchemaTable types={recordTypes} objects={info.objects} label='Record Types' onClick={handleCreateData} />
-        <SchemaTable types={presets.types} objects={info.objects} label='Presets' onClick={handleCreateData} />
-
-        <div>
-          <SyntaxHighlighter language='json' classNames='text-xs'>
-            {JSON.stringify({ space, ...info }, jsonKeyReplacer({ truncate: true }), 2)}
-          </SyntaxHighlighter>
-        </div>
-      </div>
-    </div>
-  );
-};