@dxos/plugin-thread 0.7.4 → 0.7.5-main.9d26e3a

package/src/ThreadPlugin.tsx

@@ -5,10 +5,12 @@
 import React from 'react';
 
 import {
+  createIntent,
+  createResolver,
+  createSurface,
   type IntentPluginProvides,
   isLayoutParts,
   LayoutAction,
-  type LocationProvides,
   NavigationAction,
   parseIntentPlugin,
   parseMetadataResolverPlugin,
@@ -18,33 +20,28 @@ import {
   resolvePlugin,
 } from '@dxos/app-framework';
 import { type UnsubscribeCallback } from '@dxos/async';
+import { Ref } from '@dxos/echo-schema';
 import { LocalStorageStore } from '@dxos/local-storage';
 import { log } from '@dxos/log';
-import { parseClientPlugin } from '@dxos/plugin-client';
-import { type ActionGroup, createExtension, isActionGroup, toSignal } from '@dxos/plugin-graph';
-import { ObservabilityAction } from '@dxos/plugin-observability/meta';
-import { memoizeQuery, SpaceAction } from '@dxos/plugin-space';
+import { parseClientPlugin } from '@dxos/plugin-client/types';
+import { createExtension, toSignal } from '@dxos/plugin-graph';
+import { ObservabilityAction } from '@dxos/plugin-observability/types';
+import { memoizeQuery } from '@dxos/plugin-space';
 import { ChannelType, MessageType, ThreadType } from '@dxos/plugin-space/types';
 import {
   create,
   fullyQualifiedId,
   getSpace,
   getTypename,
-  loadObjectReferences,
+  makeRef,
   parseId,
   type ReactiveEchoObject,
+  RefArray,
   SpaceState,
 } from '@dxos/react-client/echo';
 import { translations as threadTranslations } from '@dxos/react-ui-thread';
 
-import {
-  ChatContainer,
-  ChatHeading,
-  ThreadArticle,
-  ThreadComplementary,
-  ThreadMain,
-  ThreadSettings,
-} from './components';
+import { ThreadArticle, ThreadComplementary, ThreadSettings } from './components';
 import { threads } from './extensions';
 import meta, { THREAD_ITEM, THREAD_PLUGIN } from './meta';
 import translations from './translations';
@@ -73,7 +70,6 @@ export const ThreadPlugin = (): PluginDefinition<
     return viewStore[subjectId];
   };
 
-  let navigationPlugin: Plugin<LocationProvides> | undefined;
   let intentPlugin: Plugin<IntentPluginProvides> | undefined;
 
   const unsubscribeCallbacks = [] as UnsubscribeCallback[];
@@ -91,8 +87,7 @@ export const ThreadPlugin = (): PluginDefinition<
         },
       };
     },
-    ready: async (plugins) => {
-      navigationPlugin = resolvePlugin(plugins, parseNavigationPlugin);
+    ready: async ({ plugins }) => {
       intentPlugin = resolvePlugin(plugins, parseIntentPlugin)!;
     },
     unload: async () => {
@@ -103,15 +98,15 @@ export const ThreadPlugin = (): PluginDefinition<
       metadata: {
         records: {
           [ChannelType.typename]: {
-            createObject: ThreadAction.CREATE,
+            createObject: (props: { name?: string }) => createIntent(ThreadAction.Create, props),
             placeholder: ['channel name placeholder', { ns: THREAD_PLUGIN }],
             icon: 'ph--chat--regular',
             // TODO(wittjosiah): Move out of metadata.
-            loadReferences: (channel: ChannelType) => loadObjectReferences(channel, (channel) => channel.threads),
+            loadReferences: async (channel: ChannelType) => await RefArray.loadAll(channel.threads ?? []),
           },
           [ThreadType.typename]: {
             // TODO(wittjosiah): Move out of metadata.
-            loadReferences: (thread: ThreadType) => loadObjectReferences(thread, (thread) => thread.messages),
+            loadReferences: async (thread: ThreadType) => await RefArray.loadAll(thread.messages ?? []),
           },
           [MessageType.typename]: {
             // TODO(wittjosiah): Move out of metadata.
@@ -144,7 +139,7 @@ export const ThreadPlugin = (): PluginDefinition<
       graph: {
         builder: (plugins) => {
           const client = resolvePlugin(plugins, parseClientPlugin)?.provides.client;
-          const dispatch = resolvePlugin(plugins, parseIntentPlugin)?.provides.intent.dispatch;
+          const dispatch = resolvePlugin(plugins, parseIntentPlugin)?.provides.intent.dispatchPromise;
           const metadataResolver = resolvePlugin(plugins, parseMetadataResolverPlugin)?.provides.metadata.resolver;
           if (!client || !dispatch || !metadataResolver) {
             return [];
@@ -221,16 +216,15 @@ export const ThreadPlugin = (): PluginDefinition<
                 const [spaceId, objectId] = dataId.split(':');
 
                 const viewState = getViewState(dataId);
-                const toggle = () => {
+                const toggle = async () => {
                   const newToggleState = !viewState.showResolvedThreads;
                   viewState.showResolvedThreads = newToggleState;
-                  void dispatch({
-                    action: ObservabilityAction.SEND_EVENT,
-                    data: {
+                  await dispatch(
+                    createIntent(ObservabilityAction.SendEvent, {
                       name: 'threads.toggle-show-resolved',
                       properties: { spaceId, threadId: objectId, showResolved: newToggleState },
-                    },
-                  });
+                    }),
+                  );
                 };
 
                 return [
@@ -248,405 +242,265 @@ export const ThreadPlugin = (): PluginDefinition<
                 ];
               },
             }),
-            createExtension({
-              id: ThreadAction.CREATE,
-              filter: (node): node is ActionGroup =>
-                !!settings.values.standalone && isActionGroup(node) && node.id.startsWith(SpaceAction.ADD_OBJECT),
-              actions: ({ node }) => {
-                const id = node.id.split('/').at(-1);
-                const [spaceId, objectId] = id?.split(':') ?? [];
-                const space = client.spaces.get().find((space) => space.id === spaceId);
-                const object = objectId && space?.db.getObjectById(objectId);
-                const target = objectId ? object : space;
-                if (!target) {
-                  return;
-                }
-
-                return [
-                  {
-                    id: `${THREAD_PLUGIN}/create/${node.id}`,
-                    data: async () => {
-                      await dispatch([
-                        { plugin: THREAD_PLUGIN, action: ThreadAction.CREATE },
-                        { action: SpaceAction.ADD_OBJECT, data: { target } },
-                        { action: NavigationAction.OPEN },
-                      ]);
-                    },
-                    properties: {
-                      label: ['create channel label', { ns: THREAD_PLUGIN }],
-                      icon: 'ph--chat--regular',
-                      testId: 'threadPlugin.createObject',
-                    },
-                  },
-                ];
-              },
-            }),
           ];
         },
       },
       surface: {
-        component: ({ data, role }) => {
-          switch (role) {
-            case 'main': {
-              return data.active instanceof ChannelType && data.active.threads[0] ? (
-                <ThreadMain thread={data.active.threads[0]} />
-              ) : null;
-            }
-
-            case 'settings': {
-              return data.plugin === meta.id ? <ThreadSettings settings={settings.values} /> : null;
-            }
-
-            case 'article': {
-              const location = navigationPlugin?.provides.location;
-
-              if (data.object instanceof ChannelType && data.object.threads[0]) {
-                const channel = data.object;
+        definitions: ({ plugins }) => {
+          const location = resolvePlugin(plugins, parseNavigationPlugin)?.provides.location;
+          return [
+            createSurface({
+              id: `${THREAD_PLUGIN}/channel`,
+              role: 'article',
+              filter: (data): data is { subject: ChannelType } =>
+                data.subject instanceof ChannelType && !!data.subject.threads[0],
+              component: ({ data }) => {
+                const channel = data.subject;
+                const thread = channel.threads[0].target!;
                 // TODO(zan): Maybe we should have utility for positional main object ids.
                 if (isLayoutParts(location?.active) && location.active.main) {
                   const layoutEntries = location.active.main;
                   const currentPosition = layoutEntries.findIndex((entry) => channel.id === entry.id);
                   if (currentPosition > 0) {
                     const objectToTheLeft = layoutEntries[currentPosition - 1];
-                    const context = getSpace(data.object)?.db.getObjectById(objectToTheLeft.id);
-                    return <ThreadArticle thread={data.object.threads[0]} context={context} />;
+                    const context = getSpace(channel)?.db.getObjectById(objectToTheLeft.id);
+                    return <ThreadArticle thread={thread} context={context} />;
                   }
                 }
 
-                return <ThreadArticle thread={data.object.threads[0]} />;
-              }
-
-              if (data.subject instanceof ThreadType) {
-                return (
-                  <>
-                    <ChatHeading attendableId={data.subject.id} />
-                    <ChatContainer thread={data.subject} />
-                  </>
-                );
-              }
-
-              break;
-            }
-
-            case 'complementary--comments': {
-              if (
-                data.subject &&
+                return <ThreadArticle thread={thread} />;
+              },
+            }),
+            createSurface({
+              id: `${THREAD_PLUGIN}/thread`,
+              role: 'complementary--comments',
+              filter: (data): data is { subject: { threads: Ref<ThreadType>[] } } =>
+                !!data.subject &&
                 typeof data.subject === 'object' &&
                 'threads' in data.subject &&
                 Array.isArray(data.subject.threads) &&
-                !(data.subject instanceof ChannelType)
-              ) {
+                !(data.subject instanceof ChannelType),
+              component: ({ data }) => {
                 const { showResolvedThreads } = getViewState(fullyQualifiedId(data.subject));
                 return (
                   <ThreadComplementary
-                    role={role}
                     subject={data.subject}
                     drafts={state.drafts[fullyQualifiedId(data.subject)]}
                     current={state.current}
                     showResolvedThreads={showResolvedThreads}
                   />
                 );
-              }
-
-              break;
-            }
-          }
-
-          return null;
+              },
+            }),
+            createSurface({
+              id: `${THREAD_PLUGIN}/settings`,
+              role: 'settings',
+              filter: (data): data is any => data.plugin === THREAD_PLUGIN,
+              component: () => <ThreadSettings settings={settings.values} />,
+            }),
+          ];
         },
       },
       intent: {
-        resolver: async (intent) => {
-          switch (intent.action) {
-            case ThreadAction.CREATE: {
-              if (intent.data && intent.data.cursor !== undefined) {
-                const { cursor, name, subject } = intent.data;
-
-                // Seed the threads array if it does not exist.
-                if (subject?.threads === undefined) {
-                  try {
-                    // Static schema will throw an error if subject does not support threads array property.
-                    subject.threads = [];
-                  } catch (err) {
-                    log.error('Subject does not support threads array', subject?.typename);
-                    return;
-                  }
-                }
-
-                const subjectId = fullyQualifiedId(subject);
-                const thread = create(ThreadType, { name, anchor: cursor, messages: [], status: 'staged' });
-                const draft = state.drafts[subjectId];
-                if (draft) {
-                  draft.push(thread);
-                } else {
-                  state.drafts[subjectId] = [thread];
+        resolvers: () => [
+          createResolver(ThreadAction.Create, ({ name, cursor, subject }) => {
+            if (cursor && subject) {
+              // Seed the threads array if it does not exist.
+              if (subject?.threads === undefined) {
+                try {
+                  // Static schema will throw an error if subject does not support threads array property.
+                  subject.threads = [];
+                } catch (err) {
+                  log.error('Subject does not support threads array', subject?.typename);
+                  return;
                 }
+              }
 
-                return {
-                  data: thread,
-                  intents: [
-                    [
-                      {
-                        action: ThreadAction.SELECT,
-                        data: { current: fullyQualifiedId(thread) },
-                      },
-                    ],
-                    [
-                      {
-                        action: NavigationAction.OPEN,
-                        data: {
-                          activeParts: { complementary: 'comments' },
-                        },
-                      },
-                    ],
-                    [
-                      {
-                        action: LayoutAction.SET_LAYOUT,
-                        data: {
-                          element: 'complementary',
-                          state: true,
-                        },
-                      },
-                    ],
-                  ],
-                };
+              const subjectId = fullyQualifiedId(subject);
+              const thread = create(ThreadType, { name, anchor: cursor, messages: [], status: 'staged' });
+              const draft = state.drafts[subjectId];
+              if (draft) {
+                draft.push(thread);
               } else {
-                // NOTE: This is the standalone thread creation case.
-                return {
-                  data: create(ChannelType, { threads: [create(ThreadType, { messages: [] })] }),
-                };
+                state.drafts[subjectId] = [thread];
               }
-            }
-
-            case ThreadAction.SELECT: {
-              state.current = intent.data?.current;
 
               return {
-                data: true,
-                intents: !intent.data?.skipOpen
-                  ? [
-                      [
-                        {
-                          action: NavigationAction.OPEN,
-                          data: {
-                            activeParts: { complementary: 'comments' },
-                          },
-                        },
-                      ],
-                    ]
-                  : [],
+                data: { object: thread },
+                intents: [
+                  createIntent(ThreadAction.Select, { current: fullyQualifiedId(thread) }),
+                  createIntent(NavigationAction.Open, { activeParts: { complementary: 'comments' } }),
+                  createIntent(LayoutAction.SetLayout, { element: 'complementary', state: true }),
+                ],
+              };
+            } else {
+              // NOTE: This is the standalone thread creation case.
+              return {
+                data: { object: create(ChannelType, { threads: [makeRef(create(ThreadType, { messages: [] }))] }) },
               };
             }
+          }),
+          createResolver(ThreadAction.Select, ({ current, skipOpen }) => {
+            state.current = current;
+
+            return {
+              intents: !skipOpen
+                ? [createIntent(NavigationAction.Open, { activeParts: { complementary: 'comments' } })]
+                : undefined,
+            };
+          }),
+          createResolver(ThreadAction.ToggleResolved, ({ thread }) => {
+            if (thread.status === 'active' || thread.status === undefined) {
+              thread.status = 'resolved';
+            } else if (thread.status === 'resolved') {
+              thread.status = 'active';
+            }
 
-            case ThreadAction.TOGGLE_RESOLVED: {
-              const { thread } = intent.data ?? {};
-              if (!(thread instanceof ThreadType)) {
+            const space = getSpace(thread);
+            const spaceId = space?.id;
+
+            return {
+              intents: [
+                createIntent(ObservabilityAction.SendEvent, {
+                  name: 'threads.toggle-resolved',
+                  properties: { threadId: thread.id, spaceId },
+                }),
+              ],
+            };
+          }),
+          createResolver(ThreadAction.Delete, ({ subject, thread }, undo) => {
+            const subjectId = fullyQualifiedId(subject);
+            const draft = state.drafts[subjectId];
+            if (draft) {
+              // Check if we're deleting a draft; if so, remove it.
+              const index = draft.findIndex((t) => t.id === thread.id);
+              if (index !== -1) {
+                draft.splice(index, 1);
                 return;
               }
+            }
+
+            const space = getSpace(thread);
+            if (!space || !subject.threads) {
+              return;
+            }
 
-              if (thread.status === 'active' || thread.status === undefined) {
-                thread.status = 'resolved';
-              } else if (thread.status === 'resolved') {
-                thread.status = 'active';
+            if (!undo) {
+              const index = subject.threads.findIndex((t: any) => t?.id === thread.id);
+              const cursor = subject.threads[index]?.anchor;
+              if (index !== -1) {
+                subject.threads?.splice(index, 1);
               }
 
-              const space = getSpace(thread);
-              const spaceId = space?.id;
+              space.db.remove(thread);
 
               return {
-                data: true,
+                undoable: {
+                  message: ['thread deleted label', { ns: THREAD_PLUGIN }],
+                  data: { cursor },
+                },
                 intents: [
-                  [
-                    {
-                      action: ObservabilityAction.SEND_EVENT,
-                      data: { name: 'threads.toggle-resolved', properties: { threadId: thread.id, spaceId } },
-                    },
-                  ],
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'threads.delete',
+                    properties: { threadId: thread.id, spaceId: space.id },
+                  }),
                 ],
               };
-            }
-
-            case ThreadAction.DELETE: {
-              const { subject, thread } = intent.data ?? {};
-              if (
-                !(thread instanceof ThreadType) ||
-                !(subject && typeof subject === 'object' && 'threads' in subject)
-              ) {
-                return;
-              }
+            } else {
+              // TODO(wittjosiah): SDK should do this automatically.
+              const savedThread = space.db.add(thread);
+              subject.threads.push(savedThread);
 
-              const subjectId = fullyQualifiedId(subject);
-              const draft = state.drafts[subjectId];
-              if (draft) {
-                // Check if we're deleting a draft; if so, remove it.
-                const index = draft.findIndex((t) => t.id === thread.id);
-                if (index !== -1) {
-                  draft.splice(index, 1);
-                  return { data: true };
-                }
-              }
+              return {
+                intents: [
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'threads.undo-delete',
+                    properties: { threadId: thread.id, spaceId: space.id },
+                  }),
+                ],
+              };
+            }
+          }),
+          createResolver(ThreadAction.OnMessageAdd, ({ thread, subject }) => {
+            const subjectId = fullyQualifiedId(subject);
+            const space = getSpace(subject);
+            const intents = [];
+            const analyticsProperties = { threadId: thread.id, spaceId: space?.id };
+
+            if (state.drafts[subjectId]?.find((t) => t === thread)) {
+              // Move draft to document.
+              thread.status = 'active';
+              subject.threads ? subject.threads.push(makeRef(thread)) : (subject.threads = [makeRef(thread)]);
+              state.drafts[subjectId] = state.drafts[subjectId]?.filter(({ id }) => id !== thread.id);
+              intents.push(
+                createIntent(ObservabilityAction.SendEvent, {
+                  name: 'threads.thread-created',
+                  properties: analyticsProperties,
+                }),
+              );
+            }
 
-              const space = getSpace(thread);
-              if (!space || !subject.threads) {
+            intents.push(
+              createIntent(ObservabilityAction.SendEvent, {
+                name: 'threads.message-added',
+                properties: { ...analyticsProperties, threadLength: thread.messages.length },
+              }),
+            );
+
+            return { intents };
+          }),
+          createResolver(ThreadAction.DeleteMessage, ({ subject, thread, messageId, message, messageIndex }, undo) => {
+            const space = getSpace(subject);
+
+            if (!undo) {
+              const messageIndex = thread.messages.findIndex(Ref.hasObjectId(messageId));
+              const message = thread.messages[messageIndex]?.target;
+              if (!message) {
                 return;
               }
 
-              if (!intent.undo) {
-                const index = subject.threads.findIndex((t: any) => t?.id === thread.id);
-                const cursor = subject.threads[index]?.anchor;
-                if (index !== -1) {
-                  subject.threads?.splice(index, 1);
-                }
-
-                space.db.remove(thread);
-
-                return {
-                  undoable: {
-                    message: translations[0]['en-US'][THREAD_PLUGIN]['thread deleted label'],
-                    data: { cursor },
-                  },
-                  intents: [
-                    [
-                      {
-                        action: ObservabilityAction.SEND_EVENT,
-                        data: { name: 'threads.delete', properties: { threadId: thread.id, spaceId: space.id } },
-                      },
-                    ],
-                  ],
-                };
-              } else if (intent.undo) {
-                // TODO(wittjosiah): SDK should do this automatically.
-                const savedThread = space.db.add(thread);
-                subject.threads.push(savedThread);
-
+              if (messageIndex === 0 && thread.messages.length === 1) {
+                // If the message is the only message in the thread, delete the thread.
                 return {
-                  data: true,
-                  intents: [
-                    [
-                      {
-                        action: ObservabilityAction.SEND_EVENT,
-                        data: { name: 'threads.undo-delete', properties: { threadId: thread.id, spaceId: space.id } },
-                      },
-                    ],
-                  ],
+                  intents: [createIntent(ThreadAction.Delete, { subject, thread })],
                 };
+              } else {
+                thread.messages.splice(messageIndex, 1);
               }
-              break;
-            }
-
-            case ThreadAction.ON_MESSAGE_ADD: {
-              const { thread, subject } = intent.data ?? {};
-              if (
-                !(thread instanceof ThreadType) ||
-                !(subject && typeof subject === 'object' && 'threads' in subject && Array.isArray(subject.threads))
-              ) {
-                return;
-              }
-
-              const subjectId = fullyQualifiedId(subject);
-              const space = getSpace(subject);
-              const intents = [];
-              const analyticsProperties = { threadId: thread.id, spaceId: space?.id };
-
-              if (state.drafts[subjectId]?.find((t) => t === thread)) {
-                // Move draft to document.
-                thread.status = 'active';
-                subject.threads ? subject.threads.push(thread) : (subject.threads = [thread]);
-                state.drafts[subjectId] = state.drafts[subjectId]?.filter(({ id }) => id !== thread.id);
-                intents.push({
-                  action: ObservabilityAction.SEND_EVENT,
-                  data: { name: 'threads.thread-created', properties: analyticsProperties },
-                });
-              }
-
-              intents.push({
-                action: ObservabilityAction.SEND_EVENT,
-                data: {
-                  name: 'threads.message-added',
-                  properties: { ...analyticsProperties, threadLength: thread.messages.length },
-                },
-              });
 
               return {
-                data: thread,
-                intents: [intents],
+                undoable: {
+                  message: ['message deleted label', { ns: THREAD_PLUGIN }],
+                  data: { message, messageIndex },
+                },
+                intents: [
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'threads.message.delete',
+                    properties: { threadId: thread.id, spaceId: space?.id },
+                  }),
+                ],
               };
-            }
-
-            case ThreadAction.DELETE_MESSAGE: {
-              const { subject, thread, messageId } = intent.data ?? {};
-              const space = getSpace(subject);
-
-              if (
-                !(thread instanceof ThreadType) ||
-                !(subject && typeof subject === 'object' && 'threads' in subject)
-              ) {
+            } else {
+              if (!messageIndex || !message) {
                 return;
               }
 
-              if (!intent.undo) {
-                const message = thread.messages.find((m) => m?.id === messageId);
-                const messageIndex = thread.messages.findIndex((m) => m?.id === messageId);
-                if (messageIndex === -1 || !message) {
-                  return undefined;
-                }
-
-                if (messageIndex === 0 && thread.messages.length === 1) {
-                  // If the message is the only message in the thread, delete the thread.
-                  return {
-                    intents: [[{ action: ThreadAction.DELETE, data: { subject, thread } }]],
-                  };
-                } else {
-                  thread.messages.splice(messageIndex, 1);
-                }
-
-                return {
-                  undoable: {
-                    message: translations[0]['en-US'][THREAD_PLUGIN]['message deleted label'],
-                    data: { message, messageIndex },
-                  },
-                  intents: [
-                    [
-                      {
-                        action: ObservabilityAction.SEND_EVENT,
-                        data: {
-                          name: 'threads.message.delete',
-                          properties: { threadId: thread.id, spaceId: space?.id },
-                        },
-                      },
-                    ],
-                  ],
-                };
-              } else if (intent.undo) {
-                const message = intent.data?.message;
-                const messageIndex = intent.data?.messageIndex;
-                if (!(message instanceof MessageType) || !(typeof messageIndex === 'number')) {
-                  return;
-                }
-
-                thread.messages.splice(messageIndex, 0, message);
-                return {
-                  data: true,
-                  intents: [
-                    [
-                      {
-                        action: ObservabilityAction.SEND_EVENT,
-                        data: {
-                          name: 'threads.message.undo-delete',
-                          properties: { threadId: thread.id, spaceId: space?.id },
-                        },
-                      },
-                    ],
-                  ],
-                };
-              }
+              thread.messages.splice(messageIndex, 0, makeRef(message));
+              return {
+                intents: [
+                  createIntent(ObservabilityAction.SendEvent, {
+                    name: 'threads.message.undo-delete',
+                    properties: { threadId: thread.id, spaceId: space?.id },
+                  }),
+                ],
+              };
             }
-          }
-        },
+          }),
+        ],
       },
       markdown: {
         extensions: ({ document: doc }) => {
-          return threads(state, doc, intentPlugin?.provides.intent.dispatch);
+          return threads(state, doc, intentPlugin?.provides.intent.dispatchPromise);
         },
       },
     },