@dxos/plugin-automation 0.7.5-labs.8a82073 → 0.7.5-labs.a8b535d

package/src/components/Thread/Thread.stories.tsx

@@ -1,197 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import '@dxos-theme';
-
-import { type StoryObj, type Meta } from '@storybook/react';
-import React, { useCallback, useEffect, useState } from 'react';
-
-import { type Message } from '@dxos/artifact';
-import { ObjectId } from '@dxos/echo-schema';
-import { faker } from '@dxos/random';
-import { withLayout, withSignals, withTheme } from '@dxos/storybook-utils';
-
-import { Thread, type ThreadProps } from './Thread';
-import translations from '../../translations';
-
-faker.seed(1);
-
-const Render = ({ messages: _messages, ...props }: ThreadProps) => {
-  const [streaming, setStreaming] = useState(false);
-  const [messages, setMessages] = useState<Message[]>(_messages ?? []);
-  useEffect(() => {
-    setMessages(_messages ?? []);
-  }, [_messages]);
-
-  const handleSubmit = useCallback(
-    (text: string) => {
-      const request: Message = { id: ObjectId.random(), role: 'user', content: [{ type: 'text', text }] };
-      const response: Message = {
-        id: ObjectId.random(),
-        role: 'assistant',
-        content: [{ type: 'text', disposition: 'cot', pending: true, text: faker.lorem.paragraphs(1) }],
-      };
-      setMessages([...messages, request, response]);
-      setStreaming(true);
-      setTimeout(() => {
-        response.content[0].pending = false;
-        setMessages([
-          ...messages,
-          request,
-          response,
-          {
-            id: ObjectId.random(),
-            role: 'assistant',
-            content: [{ type: 'text', text: faker.lorem.paragraphs(1) }],
-          },
-        ]);
-        setStreaming(false);
-      }, 3_000);
-    },
-    [messages],
-  );
-
-  return (
-    <div className='flex grow justify-center overflow-center bg-base'>
-      <div className='flex w-[500px] bg-white dark:bg-black'>
-        <Thread {...props} messages={messages} streaming={streaming} onSubmit={handleSubmit} onStop={() => {}} />
-      </div>
-    </div>
-  );
-};
-
-const meta: Meta<ThreadProps> = {
-  title: 'plugins/plugin-automation/Thread',
-  render: Render,
-  component: Thread,
-  decorators: [withSignals, withTheme, withLayout({ fullscreen: true, tooltips: true })],
-  parameters: {
-    translations,
-  },
-};
-
-export default meta;
-
-type Story = StoryObj<ThreadProps>;
-
-const TEST_MESSAGES: Message[] = [
-  {
-    id: ObjectId.random(),
-    role: 'user',
-    content: [
-      {
-        type: 'text',
-        text: faker.lorem.sentence(5),
-      },
-    ],
-  },
-  {
-    id: ObjectId.random(),
-    role: 'assistant',
-    content: [
-      {
-        type: 'text',
-        disposition: 'cot',
-        text: Array.from({ length: faker.number.int({ min: 3, max: 5 }) })
-          .map((_, idx) => `${idx + 1}. ${faker.lorem.paragraph()}`)
-          .join('\n'),
-      },
-      {
-        type: 'text',
-        text: Array.from({ length: faker.number.int({ min: 2, max: 5 }) })
-          .map(() => faker.lorem.paragraphs())
-          .join('\n\n'),
-      },
-      {
-        type: 'tool_use',
-        id: '1234',
-        name: 'search',
-        input: {},
-      },
-    ],
-  },
-  {
-    id: ObjectId.random(),
-    role: 'user',
-    content: [
-      {
-        type: 'tool_result',
-        toolUseId: '1234',
-        content: 'This is a tool result.',
-      },
-    ],
-  },
-  {
-    id: ObjectId.random(),
-    role: 'assistant',
-    content: [
-      {
-        type: 'tool_use',
-        id: '4567',
-        name: 'create',
-        input: {},
-      },
-    ],
-  },
-  {
-    id: ObjectId.random(),
-    role: 'user',
-    content: [
-      {
-        type: 'tool_result',
-        toolUseId: '4567',
-        content: 'This is a tool result.',
-      },
-    ],
-  },
-  {
-    id: ObjectId.random(),
-    role: 'assistant',
-    content: [
-      {
-        type: 'text',
-        text: faker.lorem.paragraphs(1),
-      },
-    ],
-  },
-];
-
-export const Default: Story = {
-  args: {
-    // debug: true,
-    messages: TEST_MESSAGES,
-  },
-};
-
-export const Input: Story = {
-  args: {
-    streaming: true,
-  },
-};
-
-export const Collapse: Story = {
-  args: {
-    collapse: true,
-    messages: TEST_MESSAGES,
-  },
-};
-
-export const Incremental: Story = {
-  render: () => {
-    const [messages, setMessages] = useState<Message[]>([]);
-    useEffect(() => {
-      let i = 0;
-      const interval = setInterval(() => {
-        setMessages((messages) => [...messages, TEST_MESSAGES[i++]]);
-        if (i >= TEST_MESSAGES.length) {
-          clearInterval(interval);
-        }
-      }, 2_000);
-
-      return () => clearInterval(interval);
-    }, []);
-
-    return <Render messages={messages} collapse />;
-  },
-};

package/src/components/Thread/Thread.tsx

@@ -1,156 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { type KeyboardEventHandler, useCallback, useMemo, useRef, useState } from 'react';
-
-import { type Message } from '@dxos/artifact';
-import { IconButton, Input, useTranslation } from '@dxos/react-ui';
-import { ScrollContainer, type ScrollController } from '@dxos/react-ui-components';
-import { Spinner } from '@dxos/react-ui-sfx';
-import { mx } from '@dxos/react-ui-theme';
-
-import { ThreadMessage, type ThreadMessageProps } from './ThreadMessage';
-import { AUTOMATION_PLUGIN } from '../../meta';
-
-export type ThreadProps = {
-  messages?: Message[];
-  streaming?: boolean;
-  onSubmit?: (message: string) => void;
-  onStop?: () => void;
-} & Pick<ThreadMessageProps, 'collapse' | 'debug' | 'onSuggest' | 'onDelete'>;
-
-// TODO(burdon): Factor out scroll logic.
-export const Thread = ({
-  messages,
-  streaming,
-  collapse,
-  debug,
-  onSubmit,
-  onStop,
-  onSuggest,
-  onDelete,
-}: ThreadProps) => {
-  const { t } = useTranslation(AUTOMATION_PLUGIN);
-  const scroller = useRef<ScrollController>(null);
-
-  const [text, setText] = useState('');
-  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(
-    (ev) => {
-      switch (ev.key) {
-        case 'Escape': {
-          setText('');
-          break;
-        }
-
-        case 'Enter': {
-          const value = text.trim();
-          if (value.length > 0) {
-            scroller.current?.scrollToBottom();
-            onSubmit?.(value);
-            setText('');
-          }
-          break;
-        }
-      }
-    },
-    [text],
-  );
-
-  /**
-   * Reduce message blocks into collections of messages that contain related contiguous blocks.
-   * For example, collapse all tool request/response pairs into a single message.
-   */
-  // TODO(dmaretskyi): This needs to be a separate type: `id` is not a valid ObjectId, this needs to accommodate messageId for deletion.
-  const { messages: lines = [] } = useMemo(() => {
-    if (!collapse) {
-      return { messages: messages ?? [] };
-    }
-
-    return (messages ?? []).reduce<{ messages: Message[]; current?: Message }>(
-      ({ current, messages }, message) => {
-        let i = 0;
-        for (const block of message.content) {
-          switch (block.type) {
-            case 'tool_use':
-            case 'tool_result': {
-              if (current) {
-                current.content.push(block);
-              } else {
-                current = {
-                  id: [message.id, i].join('_'),
-                  role: message.role,
-                  content: [block],
-                };
-                messages.push(current);
-              }
-              break;
-            }
-
-            case 'text':
-            default: {
-              current = undefined;
-              messages.push({
-                id: [message.id, i].join('_'),
-                role: message.role,
-                content: [block],
-              });
-              break;
-            }
-          }
-
-          i++;
-        }
-
-        return { current, messages };
-      },
-      { messages: [] as Message[] },
-    );
-  }, [messages, collapse]);
-
-  return (
-    <div className='flex flex-col grow overflow-hidden'>
-      <ScrollContainer ref={scroller} classNames='py-2 gap-2 overflow-x-hidden'>
-        {lines.map((message) => (
-          <ThreadMessage
-            key={message.id}
-            classNames='px-4'
-            message={message}
-            collapse={collapse}
-            debug={debug}
-            onSuggest={onSuggest}
-            onDelete={onDelete}
-          />
-        ))}
-      </ScrollContainer>
-
-      {onSubmit && (
-        <div className='flex p-4 gap-3 items-center'>
-          <Spinner active={streaming} />
-          <Input.Root>
-            <Input.TextInput
-              autoFocus
-              classNames='px-2 baseSurface rounded'
-              placeholder={t('chat input placeholder')}
-              value={text}
-              onChange={(ev) => setText(ev.target.value)}
-              onKeyDown={handleKeyDown}
-            />
-          </Input.Root>
-          {onStop && (
-            <IconButton
-              disabled={!streaming}
-              classNames={mx('!p-1 !opacity-20 transition', streaming && '!opacity-80')}
-              variant='ghost'
-              size={5}
-              onClick={onStop}
-              icon='ph--x--regular'
-              label={t('chat stop')}
-              iconOnly
-            />
-          )}
-        </div>
-      )}
-    </div>
-  );
-};

package/src/components/Thread/ThreadMessage.tsx

@@ -1,225 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React, { useEffect, useRef, useState, type FC } from 'react';
-
-import { type MessageContentBlock, type Message } from '@dxos/artifact';
-import { invariant } from '@dxos/invariant';
-import { log } from '@dxos/log';
-import { Button, ButtonGroup, Icon, type ThemedClassName } from '@dxos/react-ui';
-import { Json } from '@dxos/react-ui-syntax-highlighter';
-import { mx } from '@dxos/react-ui-theme';
-import { safeParseJson } from '@dxos/util';
-
-import { ToggleContainer, StatusLine, Tabs } from '../Box';
-import { MarkdownViewer } from '../MarkdownViewer';
-
-export type ThreadMessageProps = ThemedClassName<{
-  message: Message;
-  collapse?: boolean;
-  debug?: boolean;
-  onSuggest?: (text: string) => void;
-  onDelete?: (id: string) => void;
-}>;
-
-export const ThreadMessage: FC<ThreadMessageProps> = ({
-  classNames,
-  message,
-  collapse,
-  debug,
-  onSuggest,
-  onDelete,
-}) => {
-  if (typeof message !== 'object') {
-    return <div className={mx(classNames)}>{message}</div>;
-  }
-
-  const { role, content = [] } = message;
-
-  // TODO(burdon): Factor out tool blocks.
-  const toolBlocks = content.filter((block) => block.type === 'tool_use' || block.type === 'tool_result');
-  if (collapse && toolBlocks.length > 0) {
-    let request: (MessageContentBlock & { type: 'tool_use' }) | undefined;
-    const items = toolBlocks.map((block) => {
-      switch (block.type) {
-        case 'tool_use': {
-          request = block;
-          // TODO(burdon): Get plugin name.
-          return { title: `Calling ${block.name}...`, block };
-        }
-
-        case 'tool_result': {
-          if (!request) {
-            log.warn('unexpected message', { block });
-            return { title: 'Error', block };
-          }
-
-          return { title: `Processed ${request.name}`, block };
-        }
-
-        default: {
-          request = undefined;
-          return { title: 'Error', block };
-        }
-      }
-    });
-
-    return (
-      <div className={mx('flex', classNames)}>
-        <div className='w-full p-1 px-2 overflow-hidden rounded-md bg-baseSurface'>
-          <TabbedContainer items={items} />
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div className={mx('flex flex-col shrink-0 gap-2')}>
-      {debug && (
-        <div className='text-xs text-subdued'>
-          {message.id}{' '}
-          {onDelete && (
-            <span className='cursor-pointer underline' onClick={() => onDelete(message.id)}>
-              delete
-            </span>
-          )}
-        </div>
-      )}
-      {content.map((block, idx) => (
-        <div key={idx} className={mx('flex', classNames, block.type === 'text' && role === 'user' && 'justify-end')}>
-          <Block role={role} block={block} onSuggest={onSuggest ?? (() => {})} />
-        </div>
-      ))}
-    </div>
-  );
-};
-
-const Block = ({
-  block,
-  role,
-  onSuggest,
-}: Pick<Message, 'role'> & { block: MessageContentBlock; onSuggest: (text: string) => void }) => {
-  const Component = componentMap[block.type] ?? componentMap.default;
-  return (
-    <div
-      className={mx(
-        'p-1 px-2 overflow-hidden rounded-md',
-        (block.type !== 'text' || block.disposition) && 'w-full bg-baseSurface',
-        block.type === 'text' && role === 'user' && 'bg-primary-200 dark:bg-primary-500',
-      )}
-    >
-      <Component block={block} onSuggest={onSuggest} />
-    </div>
-  );
-};
-
-const titles: Record<string, string> = {
-  ['cot' as const]: 'Chain of thought',
-  ['artifact' as const]: 'Artifact',
-  ['tool_use' as const]: 'Tool request',
-  ['tool_result' as const]: 'Tool result',
-};
-
-type BlockComponent = FC<{ block: MessageContentBlock; onSuggest: (text: string) => void }>;
-
-const componentMap: Record<string, BlockComponent> = {
-  text: ({ block }) => {
-    invariant(block.type === 'text');
-    const title = block.disposition ? titles[block.disposition] : undefined;
-    if (!title) {
-      return (
-        <MarkdownViewer content={block.text} classNames={[block.disposition === 'cot' && 'text-sm text-subdued']} />
-      );
-    }
-
-    return (
-      <ToggleContainer
-        title={title}
-        icon={
-          block.pending ? (
-            <Icon icon={'ph--circle-notch--regular'} classNames='text-subdued ml-2 animate-spin' size={4} />
-          ) : undefined
-        }
-        open={block.disposition === 'cot'}
-      >
-        <MarkdownViewer content={block.text} classNames={[block.disposition === 'cot' && 'text-sm text-subdued']} />
-      </ToggleContainer>
-    );
-  },
-
-  json: ({ block, onSuggest }) => {
-    invariant(block.type === 'json');
-
-    switch (block.disposition) {
-      case 'suggest': {
-        const { text = '' }: { text: string } = safeParseJson(block.json ?? '{}') ?? ({} as any);
-        return <Button onClick={() => onSuggest(text)}>{text}</Button>;
-      }
-
-      case 'select': {
-        const { options = [] }: { options: string[] } = safeParseJson(block.json ?? '{}') ?? ({} as any);
-        return (
-          <ButtonGroup>
-            {options.map((option) => (
-              <Button key={option} onClick={() => onSuggest(option)}>
-                {option}
-              </Button>
-            ))}
-          </ButtonGroup>
-        );
-      }
-
-      default: {
-        const title = block.disposition ? titles[block.disposition] : undefined;
-        return (
-          <ToggleContainer title={title ?? 'JSON'}>
-            <Json data={safeParseJson(block.json ?? block)} classNames='!p-1 text-xs' />
-          </ToggleContainer>
-        );
-      }
-    }
-  },
-
-  default: ({ block }) => {
-    let title = titles[block.type];
-    if (block.type === 'tool_use') {
-      title = `Tool [${block.name}]`; // TODO(burdon): Get label from tool.
-    }
-
-    return (
-      <ToggleContainer title={title ?? 'JSON'}>
-        <Json data={block} classNames='!p-1 text-xs' />
-      </ToggleContainer>
-    );
-  },
-};
-
-const TabbedContainer = ({ items }: { items: { title: string; block: any }[] }) => {
-  const lines = items.map((item) => item.title);
-  const tabsRef = useRef<HTMLDivElement>(null);
-  const [selected, setSelected] = useState(0);
-  const [open, setOpen] = useState(false);
-  useEffect(() => {
-    if (open) {
-      tabsRef.current?.focus();
-    }
-  }, [open]);
-
-  const handleSelect = (index: number) => {
-    if (index === selected) {
-      setOpen(false);
-    } else {
-      setSelected(index);
-    }
-  };
-
-  return (
-    <ToggleContainer title={<StatusLine lines={lines} autoAdvance />} open={open} onChangeOpen={setOpen}>
-      <div className='flex gap-2 w-full'>
-        <Tabs ref={tabsRef} length={items.length} selected={selected} onSelect={handleSelect} />
-        <Json data={items[selected].block} classNames='!p-1 text-xs' />
-      </div>
-    </ToggleContainer>
-  );
-};

package/src/components/Thread/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-export * from './Thread';

package/src/hooks/email.ts

@@ -1,49 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { findObjectWithForeignKey } from '@dxos/echo-db';
-import { foreignKey } from '@dxos/echo-schema';
-import { log } from '@dxos/log';
-import { MailboxType } from '@dxos/plugin-inbox/types';
-import { MessageType } from '@dxos/plugin-space/types';
-import { type Space, Filter, create, makeRef } from '@dxos/react-client/echo';
-
-export const SOURCE_ID = 'hub.dxos.network/api/mailbox';
-
-export const handleEmail = async (space: Space, data: any) => {
-  const { messages } = data;
-
-  // Create mailbox if doesn't exist.
-  const { objects: mailboxes } = await space.db.query(Filter.schema(MailboxType)).run();
-  const mailbox = mailboxes[0] ?? space.db.add(create(MailboxType, { messages: [] }));
-
-  log.info('messages', { count: messages.length, existingMailbox: mailboxes.length > 0 });
-
-  const { objects } = await space.db.query(Filter.schema(MessageType)).run();
-  for (const message of messages) {
-    let object = findObjectWithForeignKey(objects, { source: SOURCE_ID, id: String(message.id) });
-    if (!object) {
-      object = space.db.add(
-        create(
-          MessageType,
-          {
-            sender: { email: message.from },
-            timestamp: new Date(message.created).toISOString(),
-            text: message.body,
-            properties: {
-              subject: message.subject,
-              to: [{ email: message.to }],
-            },
-          },
-          {
-            keys: [foreignKey(SOURCE_ID, String(message.id))],
-          },
-        ),
-      );
-      mailbox.messages?.push(makeRef(object));
-    }
-  }
-
-  return 200;
-};

package/src/hooks/index.ts

@@ -1,10 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-export * from './processor';
-
-export * from './useChatProcessor';
-export * from './useLocalTriggerManager';
-export * from './useMessageQueue';
-export * from './useServices';