@lark-apaas/coding-template-nestjs-react-fullstack 0.1.60-alpha.20261105142153 → 0.1.60-beta.0

package/template/client/src/components/business-ui/comments/comments.tsx

@@ -1,670 +0,0 @@
-import type {
-  CommentsProviderProps,
-  CommentsProviderInput,
-  CommentPanelInput,
-  CommentThread,
-  CommentContent,
-  CommentDraft,
-  EntityRef,
-  UserRef,
-  CommentEntitySource,
-  CommentReaction,
-  CommentTarget,
-  CommentWriteResult,
-  CommentMessage,
-} from './contracts';
-import type {
-  CommentDataSource,
-  CommentValue,
-  MentionRef,
-  MentionOption,
-} from '../record-comments/types';
-import type {
-  DiscussionThread,
-  DiscussionDraft,
-  DiscussionReply,
-} from '../record-comments/internal/view-types';
-import {
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-  useSyncExternalStore,
-} from 'react';
-import { CommentMutations } from '../record-comments/internal/mutations';
-import {
-  DiscussionProvider,
-  DiscussionLayout,
-} from '../record-comments/internal/discussion';
-import { ReadStatus, PaginationFooter } from '../record-comments/comment-panel';
-import { withDocumentSource } from '../record-comments/extensions';
-import { DEFAULT_REACTION_EMOJIS } from '../record-comments/internal/reactions';
-import { normalizeValue } from '../record-comments/internal/model';
-
-// Encoding is private UI identity, not a backend ID conversion. Namespace stays lossless.
-const toRef = (ref: EntityRef): MentionRef => {
-  if (!ref.id || !ref.namespace) throw new Error('引用标识不能为空');
-  return ref.kind === 'user'
-    ? {
-        kind: 'user',
-        idType: 'generic',
-        id: JSON.stringify([ref.namespace, ref.id]),
-      }
-    : { kind: 'document', resourceType: ref.namespace, id: ref.id };
-};
-const fromRef = (ref: MentionRef): EntityRef => {
-  if (ref.kind === 'document')
-    return { kind: 'document', namespace: ref.resourceType, id: ref.id };
-  if (ref.idType !== 'generic')
-    return { kind: 'user', namespace: ref.idType, id: ref.id };
-  const [namespace, id] = JSON.parse(ref.id);
-  return { kind: 'user', namespace, id };
-};
-const value = (content: CommentContent): CommentValue =>
-  normalizeValue({
-    version: 1,
-    content: content.nodes.map((n) =>
-      n.type === 'mention'
-        ? { ...n, ref: toRef(n.ref) }
-        : n.type === 'unsupported'
-          ? { type: 'text', text: n.label }
-          : n,
-    ),
-  });
-const content = (v: CommentValue): CommentContent => ({
-  version: 1,
-  nodes: normalizeValue(v).content.map((n) =>
-    n.type === 'mention' ? { ...n, ref: fromRef(n.ref) } : n,
-  ),
-});
-const fail = (message: string) =>
-  Object.assign(new Error(message), { outcome: 'not-applied' });
-const reactionState = (items: CommentReaction[]) =>
-  JSON.stringify(
-    items
-      .map((r) => [r.key, r.count, r.mine])
-      .sort((a, b) => String(a[0]).localeCompare(String(b[0]))),
-  );
-const key = (ref: EntityRef) =>
-  JSON.stringify([ref.kind, ref.namespace, ref.id]);
-export function CommentsProvider(input: CommentsProviderInput) {
-  const props: CommentsProviderProps =
-    input.value !== undefined
-      ? { ...input.value.props, children: input.children }
-      : (input as CommentsProviderProps);
-  return (
-    <Session
-      key={JSON.stringify([props.scopeKey, props.subjectKey])}
-      {...props}
-    />
-  );
-}
-function Session(props: CommentsProviderProps) {
-  const latest = useRef(props);
-  latest.current = props;
-  const [mutations] = useState(
-    () =>
-      new CommentMutations({
-        opaqueIDs: true,
-        unknownDeletion: true,
-        unknownErrors: true,
-        removePending: true,
-      }),
-  );
-  useSyncExternalStore(
-    mutations.subscribe,
-    mutations.getVersion,
-    mutations.getVersion,
-  );
-  useEffect(() => {
-    mutations.activate();
-    return () => mutations.dispose();
-  }, [mutations]);
-  const abort = useRef(new AbortController());
-  useEffect(() => {
-    const controller = new AbortController();
-    abort.current = controller;
-    return () => controller.abort();
-  }, []);
-  const context = () => ({
-    operationId: crypto.randomUUID(),
-    signal: abort.current.signal,
-  });
-  const extensions = new Map(props.extensions?.map((x) => [x.type, x]));
-  if (extensions.size !== (props.extensions?.length ?? 0))
-    throw new Error('同种评论扩展只能注册一次');
-  const documents = props.extensions?.find((x) => x.type === 'documents');
-  const reactions = props.extensions?.find((x) => x.type === 'reactions');
-  const images = extensions.has('images');
-  const names = useRef(new Map<string, MentionOption>());
-  names.current = new Map();
-  for (const author of [
-    props.currentUser,
-    ...props.threads.flatMap((t) =>
-      t.messages.flatMap((m) => [
-        m.author,
-        ...(m.reactions ?? []).flatMap((r) => r.previewUsers ?? []),
-      ]),
-    ),
-  ])
-    if (author?.name)
-      names.current.set(key(author.ref), {
-        ref: toRef(author.ref),
-        label: author.name || '用户',
-        avatarUrl: author.avatarUrl,
-      });
-  const source = useMemo(() => {
-    function wrap(
-      external: CommentEntitySource | undefined,
-      user: boolean,
-    ): CommentDataSource {
-      const option = (o: import('./contracts').CommentEntityOption) => ({
-        ...o,
-        ref: toRef(o.ref),
-      });
-      const allowed = (o: import('./contracts').CommentEntityOption) =>
-        o.ref.kind === 'user'
-          ? Boolean(latest.current.input?.userMentions?.(o.ref as UserRef))
-          : true;
-      return {
-        scopeKey: props.scopeKey + (user ? ':actors' : ':documents'),
-        allowLinks: props.input?.links ?? false,
-        search: async (args) => {
-          if (user && !latest.current.input?.userMentions) return { items: [] };
-          const result = await external?.search?.(args);
-          return {
-            items: (result?.items ?? []).filter(allowed).map(option),
-            nextCursor: result?.nextCursor,
-          };
-        },
-        ...(external?.recommend
-          ? {
-              recommend: async (args) => {
-                if (user && !latest.current.input?.userMentions)
-                  return { items: [] };
-                const r = await external.recommend!(args);
-                return {
-                  items: r.items.filter(allowed).map(option),
-                  nextCursor: r.nextCursor,
-                };
-              },
-            }
-          : {}),
-        parseLink: (url) => {
-          const ref = external?.parseUrl?.(url);
-          return ref
-            ? { type: 'mention', ref: toRef(ref), href: url }
-            : undefined;
-        },
-        resolve: async (refs, signal) => {
-          const found = new Map(
-            refs.flatMap((ref) => {
-              const r = names.current.get(key(fromRef(ref)));
-              return r
-                ? [
-                    [
-                      key(fromRef(ref)),
-                      { ...r, status: 'resolved' as const },
-                    ] as const,
-                  ]
-                : [];
-            }),
-          );
-          const missing = refs.filter((r) => !found.has(key(fromRef(r))));
-          if (missing.length && external)
-            for (const r of await external.resolve(
-              missing.map(fromRef),
-              signal,
-            ))
-              found.set(key(r.ref), { ...r, ref: toRef(r.ref) } as never);
-          signal.throwIfAborted();
-          return refs.map(
-            (ref) =>
-              found.get(key(fromRef(ref))) ?? { ref, status: 'error' as const },
-          );
-        },
-      };
-    }
-    const people = wrap(props.actors, true);
-    return documents
-      ? {
-          ...withDocumentSource(people, wrap(documents.source, false)),
-          allowLinks: props.input?.links ?? false,
-        }
-      : people;
-  }, [props.actors, props.scopeKey, props.input?.links, documents?.source]);
-  const [submitted, setSubmitted] = useState<string>();
-  const [reactionVersion, setReactionVersion] = useState(0);
-  const reactionOverlays = useRef(
-    new Map<
-      string,
-      {
-        data: CommentReaction[];
-        before: CommentReaction[];
-        confirmed: boolean;
-        uncertain?: boolean;
-        key: string;
-        action: 'add' | 'remove';
-      }
-    >(),
-  );
-  const reactionBusy = useRef(new Set<string>());
-  const reactKey = (target: CommentTarget) =>
-    JSON.stringify([target.threadId, target.messageId]);
-  const dataToReaction = (data: CommentReaction[]) =>
-    data
-      .filter((r) => r.count > 0)
-      .map((r) => ({
-        key: r.key,
-        count: r.count,
-        mine: r.mine === true,
-        users: (r.previewUsers ?? []).map((u) => toRef(u.ref).id),
-      }));
-  const toMessage = (m: CommentMessage, threadId: string): DiscussionReply => {
-    const target = { threadId, messageId: m.id };
-    const overlay = reactionOverlays.current.get(reactKey(target));
-    const canEdit = Boolean(
-      m.permissions?.edit &&
-      props.actions?.update &&
-      !m.content.nodes.some((n) => n.type === 'unsupported') &&
-      (!m.attachments?.length ||
-        (images &&
-          m.attachments.every((a) => a.kind === 'image' && Boolean(a.url)))),
-    );
-    return {
-      replyID: m.id,
-      clientOperationId: m.clientOperationId,
-      author: m.author ? toRef(m.author.ref) : null,
-      createTime: m.createdAt / 1000,
-      updateTime: m.updatedAt === undefined ? undefined : m.updatedAt / 1000,
-      edited: m.edited || Boolean(m.updatedAt && m.updatedAt > m.createdAt),
-      value: value({
-        version: 1,
-        nodes: [
-          ...m.content.nodes,
-          ...(m.attachments ?? [])
-            .filter((a) => a.kind !== 'image' || !a.url)
-            .map((a) => ({
-              type: 'unsupported' as const,
-              label: `[附件暂未接入：${a.name}]`,
-            })),
-        ],
-      }),
-      images: (m.attachments ?? [])
-        .filter((a) => a.kind === 'image' && a.url)
-        .map((a) => ({ ...a, url: a.url! })),
-      reactions: dataToReaction(overlay?.data ?? m.reactions ?? []),
-      permissions: {
-        canEdit,
-        canDelete: Boolean(m.permissions?.delete && props.actions?.remove),
-        canCopyLink: Boolean(props.getMessageLink?.(target)),
-        canReact: Boolean(
-          reactions?.options.onChange &&
-          m.permissions?.react &&
-          !overlay?.uncertain &&
-          m.reactions !== undefined &&
-          !m.reactions.some((r) => r.mine === undefined),
-        ),
-      },
-    };
-  };
-  const base: DiscussionThread[] = props.threads.map((t) => ({
-    commentID: t.id,
-    canReply: t.canReply,
-    creator: t.messages[0]?.author ? toRef(t.messages[0].author.ref) : null,
-    createTime: (t.messages[0]?.createdAt ?? 0) / 1000,
-    isSolved: !!t.resolved,
-    listFooter: t.repliesPagination?.hasMore ? (
-      <PaginationFooter pagination={t.repliesPagination} />
-    ) : undefined,
-    replies: t.messages.map((m) => toMessage(m, t.id)),
-  }));
-  useEffect(() => {
-    mutations.reconcile(base);
-  });
-  useEffect(() => {
-    for (const [k, o] of reactionOverlays.current)
-      if (o.confirmed) {
-        const [tid, mid] = JSON.parse(k);
-        const data = props.threads
-          .find((t) => t.id === tid)
-          ?.messages.find((m) => m.id === mid)?.reactions;
-        if (
-          data &&
-          (reactionState(data) === reactionState(o.data) ||
-            (o.action === 'add'
-              ? data.find((r) => r.key === o.key)?.mine === true
-              : !data.some((r) => r.key === o.key) ||
-                data.find((r) => r.key === o.key)?.mine === false))
-        ) {
-          reactionOverlays.current.delete(k);
-          reactionBusy.current.delete(k);
-          setReactionVersion((v) => v + 1);
-        }
-      }
-  }, [props.threads, reactionVersion]);
-  const readDraft = (
-    draft: DiscussionDraft,
-    mode: 'create' | 'update',
-    target: Partial<CommentTarget>,
-  ): CommentDraft => {
-    const result: CommentDraft = {
-      content: content(draft.value),
-      attachments: draft.images.map((i) =>
-        i.file
-          ? { kind: 'local', localId: i.id, file: i.file }
-          : {
-              kind: 'existing',
-              attachment: {
-                id: i.id,
-                kind: 'image',
-                name: i.name,
-                url: i.url,
-                width: i.width,
-                height: i.height,
-              },
-            },
-      ),
-    };
-    const signature = (n: import('./contracts').CommentNode) =>
-      n.type === 'link'
-        ? JSON.stringify(['link', n.url])
-        : n.type === 'mention'
-          ? JSON.stringify(['mention', key(n.ref), n.href ?? ''])
-          : '';
-    const retained = new Map<string, number>();
-    if (mode === 'update')
-      for (const n of latest.current.threads
-        .find((t) => t.id === target.threadId)
-        ?.messages.find((m) => m.id === target.messageId)?.content.nodes ??
-        []) {
-        const k = signature(n);
-        if (k) retained.set(k, (retained.get(k) ?? 0) + 1);
-      }
-    for (const n of result.content.nodes) {
-      const k = signature(n),
-        remaining = retained.get(k) ?? 0;
-      const existing = remaining > 0;
-      if (existing) retained.set(k, remaining - 1);
-      if (n.type === 'link' && !latest.current.input?.links && !existing)
-        throw fail('当前接口不支持结构化链接');
-      if (
-        n.type === 'mention' &&
-        n.ref.kind === 'document' &&
-        !documents?.canInsert &&
-        !existing
-      )
-        throw fail('当前接口不支持插入文档引用');
-      if (n.type === 'unresolved-mention' || n.type === 'unsupported')
-        throw fail('请重新选择无法识别的引用');
-      if (
-        n.type === 'mention' &&
-        n.ref.kind === 'user' &&
-        !latest.current.input?.userMentions?.(n.ref as UserRef) &&
-        !existing
-      )
-        throw fail('当前接口不支持此人员引用');
-    }
-    const error = latest.current.validateDraft?.(result, { mode, ...target });
-    if (error) throw fail(error);
-    return result;
-  };
-  const accept = async (result: CommentWriteResult, target?: CommentTarget) => {
-    if (
-      target &&
-      (result.threadId !== target.threadId ||
-        result.messageId !== target.messageId)
-    )
-      throw Object.assign(new Error('写入目标不匹配'), { outcome: 'unknown' });
-    if (result.message && result.message.id !== result.messageId)
-      throw Object.assign(new Error('回读消息 ID 不匹配'), {
-        outcome: 'unknown',
-      });
-    return {
-      commentID: result.threadId,
-      replyID: result.messageId,
-      ...(result.message
-        ? { authoritativeReply: toMessage(result.message, result.threadId) }
-        : {}),
-    };
-  };
-  return (
-    <DiscussionProvider
-      panel={{
-        source,
-        currentUser: props.currentUser
-          ? toRef(props.currentUser.ref)
-          : undefined,
-        comments: mutations.view(base),
-        allowCompose: !!props.actions?.create,
-        optimisticMutations: true,
-        canMentionUser: (r) =>
-          r.kind === 'user' &&
-          Boolean(latest.current.input?.userMentions?.(fromRef(r) as UserRef)),
-        reactionEmojis: reactions
-          ? (reactions.options.catalog ?? DEFAULT_REACTION_EMOJIS).filter(
-              (e) =>
-                !reactions.options.allowedKeys ||
-                reactions.options.allowedKeys.includes(e.key),
-            )
-          : undefined,
-        showReactions: !!reactions,
-        allowReact: !!reactions?.options.onChange,
-        enablePrivateComments: false,
-        enableImages: images && !!props.actions?.create,
-        enableEditImages: images && !!props.actions?.update,
-        enableDocuments: documents?.canInsert ?? false,
-        submittedReplyID: submitted ? mutations.replyID(submitted) : undefined,
-        onScrolledToReply: () => setSubmitted(undefined),
-        onRetryMutation: (id) => mutations.retry(id),
-        autoScrollNewReplies: false,
-        listHeader: (
-          <ReadStatus
-            loading={props.loading}
-            error={props.error}
-            onRetry={props.onRetry}
-            empty={
-              !base.some((t) => t.replies.length) &&
-              !mutations.view(base).length
-            }
-            hasMore={props.pagination?.hasMore}
-          />
-        ),
-        listFooter: props.pagination ? (
-          <PaginationFooter
-            pagination={props.pagination}
-            loading={props.loading || !!props.error}
-          />
-        ) : undefined,
-        emptyState: null,
-        onMentionClick: (ref, anchor) => {
-          if (ref.kind === 'user')
-            props.onActorClick?.(fromRef(ref) as UserRef, anchor);
-        },
-        getCommentLink: (threadId, m) =>
-          props.getMessageLink?.({ threadId, messageId: m.replyID }) ?? '',
-        resolveUserRef: (id) => ({ kind: 'user', idType: 'generic', id }),
-        onSubmit: (draft) => {
-          if (
-            draft.commentID &&
-            !latest.current.threads.some(
-              (t) =>
-                t.id === draft.commentID && t.canReply !== false && !t.resolved,
-            )
-          )
-            throw fail('该讨论当前不可回复');
-          const input = readDraft(
-            draft,
-            'create',
-            draft.commentID ? { threadId: draft.commentID } : {},
-          );
-          const ctx = context();
-          const id = mutations.add(
-            base.find((t) => t.commentID === draft.commentID),
-            draft,
-            props.currentUser ? toRef(props.currentUser.ref) : undefined,
-            async () =>
-              accept(
-                await latest.current.actions!.create!(
-                  {
-                    ...input,
-                    ...(draft.commentID
-                      ? {
-                          threadId: draft.commentID,
-                          ...(draft.replyToMessageId
-                            ? { replyToMessageId: draft.replyToMessageId }
-                            : {}),
-                        }
-                      : {}),
-                  },
-                  ctx,
-                ),
-              ),
-            ctx.operationId,
-          );
-          setSubmitted(id);
-        },
-        onEdit: (threadId, messageId, v, attachments) => {
-          const input = readDraft(
-            { value: v, images: attachments, private: false },
-            'update',
-            { threadId, messageId },
-          );
-          const ctx = context();
-          mutations.edit(
-            base.find((t) => t.commentID === threadId)!,
-            messageId,
-            { value: v, images: attachments, private: false },
-            async () =>
-              accept(
-                await latest.current.actions!.update!(
-                  { ...input, threadId, messageId },
-                  ctx,
-                ),
-                { threadId, messageId },
-              ),
-          );
-        },
-        onDelete: (threadId, messageId) => {
-          if (!messageId) throw fail('未选择消息');
-          const ctx = context();
-          mutations.delete(
-            base.find((t) => t.commentID === threadId)!,
-            messageId,
-            async () => {
-              const r = await latest.current.actions!.remove!(
-                { threadId, messageId },
-                ctx,
-              );
-              return {
-                commentID: r.threadId,
-                ...(r.threadDeleted === undefined
-                  ? {}
-                  : { commentDeleted: r.threadDeleted }),
-              } as never;
-            },
-          );
-        },
-        onToggleReaction: async (threadId, messageId, emoji) => {
-          const target = { threadId, messageId };
-          const k = reactKey(target);
-          if (reactionBusy.current.has(k)) return;
-          const m = latest.current.threads
-            .find((t) => t.id === threadId)
-            ?.messages.find((m) => m.id === messageId);
-          if (
-            !m?.permissions?.react ||
-            !m.reactions ||
-            m.reactions.some((r) => r.mine === undefined) ||
-            !reactions?.options.onChange
-          )
-            throw fail('回应状态或权限未知');
-          if (
-            reactions.options.allowedKeys &&
-            !reactions.options.allowedKeys.includes(emoji)
-          )
-            throw fail('该表情未启用');
-          const before = reactionOverlays.current.get(k)?.data ?? m.reactions;
-          const old = before.find((r) => r.key === emoji);
-          const action = old?.mine ? 'remove' : 'add';
-          const next = before.filter((r) => r.key !== emoji);
-          const count = (old?.count ?? 0) + (action === 'add' ? 1 : -1);
-          if (count > 0)
-            next.push({
-              key: emoji,
-              count,
-              mine: action === 'add',
-              previewUsers:
-                action === 'add' && props.currentUser
-                  ? [
-                      props.currentUser,
-                      ...(old?.previewUsers ?? []).filter(
-                        (u) => key(u.ref) !== key(props.currentUser!.ref),
-                      ),
-                    ]
-                  : (old?.previewUsers ?? []).filter(
-                      (u) =>
-                        !props.currentUser ||
-                        key(u.ref) !== key(props.currentUser.ref),
-                    ),
-            });
-          reactionBusy.current.add(k);
-          reactionOverlays.current.set(k, {
-            data: next,
-            before,
-            confirmed: false,
-            key: emoji,
-            action,
-          });
-          setReactionVersion((v) => v + 1);
-          try {
-            const r = await reactions.options.onChange(
-              { ...target, key: emoji, action },
-              context(),
-            );
-            if (!abort.current.signal.aborted) {
-              reactionOverlays.current.set(k, {
-                data: r.reactions ?? next,
-                before,
-                confirmed: true,
-                key: emoji,
-                action,
-              });
-              setReactionVersion((v) => v + 1);
-            }
-          } catch (e) {
-            if (!abort.current.signal.aborted) {
-              if ((e as { outcome?: string })?.outcome === 'not-applied')
-                reactionOverlays.current.delete(k);
-              else
-                reactionOverlays.current.set(k, {
-                  data: next,
-                  before,
-                  confirmed: true,
-                  uncertain: true,
-                  key: emoji,
-                  action,
-                });
-              setReactionVersion((v) => v + 1);
-            }
-            throw e;
-          } finally {
-            if (!reactionOverlays.current.get(k)?.uncertain)
-              reactionBusy.current.delete(k);
-          }
-        },
-      }}
-    >
-      {props.children}
-    </DiscussionProvider>
-  );
-}
-export function CommentPanel(props: CommentPanelInput) {
-  return (
-    <CommentsProvider {...props}>
-      <div className="replica-comment-panel">
-        <DiscussionLayout />
-      </div>
-    </CommentsProvider>
-  );
-}