@open-mercato/documents 0.6.8-develop.7016.1.4ed7b1e49d

package/src/modules/documents/backend/documents/[id]/VersionPreviewDialog.tsx

@@ -0,0 +1,197 @@
+"use client"
+
+import * as React from 'react'
+import { EditorContent, useEditor } from '@tiptap/react'
+import { RotateCcw } from 'lucide-react'
+import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { LoadingMessage, ErrorMessage } from '@open-mercato/ui/backend/detail'
+import { Button } from '@open-mercato/ui/primitives/button'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@open-mercato/ui/primitives/dialog'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { cn } from '@open-mercato/shared/lib/utils'
+import { getDocumentEditorExtensions } from '../../../lib/editorConfig'
+import { firstSafeDocumentsDisplayLabel } from '../../../lib/displayLabels'
+import { sanitizeDocumentVersionLabel } from '../../../lib/versionLabels'
+import { readRecord, readString } from '../documentUi'
+import { DOCUMENT_EDITOR_CONTENT_CLASS } from './editorTypes'
+
+export type VersionPreview = {
+  id: string
+  label: string | null
+  creatorLabel: string
+  createdAt: string
+  contentHtml: string
+}
+
+type VersionPreviewDialogProps = {
+  documentId: string
+  versionId: string | null
+  canRestore: boolean
+  isRestoring: boolean
+  onOpenChange: (open: boolean) => void
+  onRestore: (version: VersionPreview) => void | Promise<void>
+}
+
+export function normalizeVersionPreview(
+  payload: unknown,
+  fallbackCreatorLabel?: string,
+): VersionPreview | null {
+  const root = readRecord(payload)
+  const record = readRecord(root?.item) ?? readRecord(root?.data) ?? root
+  if (!record) return null
+  const id = readString(record, 'id')
+  const creatorLabel = firstSafeDocumentsDisplayLabel(
+    readString(record, 'creatorLabel', 'creator_label'),
+    fallbackCreatorLabel,
+  )
+  const createdAt = readString(record, 'createdAt', 'created_at')
+  if (!id || !creatorLabel || !createdAt) return null
+  return {
+    id,
+    creatorLabel,
+    createdAt,
+    label: sanitizeDocumentVersionLabel(readString(record, 'label')),
+    contentHtml: readString(record, 'contentHtml', 'content_html') ?? '',
+  }
+}
+
+function ReadOnlyVersion({ contentHtml, fallbackLabel }: { contentHtml: string; fallbackLabel: string }) {
+  const editor = useEditor({
+    extensions: getDocumentEditorExtensions({ entityRefFallbackLabel: fallbackLabel }),
+    content: contentHtml,
+    editable: false,
+    editorProps: { attributes: { class: 'min-h-64 text-base leading-7 text-foreground focus-visible:outline-none' } },
+  }, [contentHtml])
+  React.useEffect(() => { editor?.commands.setContent(contentHtml) }, [contentHtml, editor])
+  // Share the live editor's typography so tables keep their grid lines and
+  // headings/lists read the same in the preview as on the canvas.
+  return <EditorContent editor={editor} className={cn(DOCUMENT_EDITOR_CONTENT_CLASS, 'rounded-md border border-border bg-card p-4')} />
+}
+
+export function VersionPreviewDialog({
+  documentId,
+  versionId,
+  canRestore,
+  isRestoring,
+  onOpenChange,
+  onRestore,
+}: VersionPreviewDialogProps) {
+  const t = useT()
+  const [preview, setPreview] = React.useState<VersionPreview | null>(null)
+  const [error, setError] = React.useState<string | null>(null)
+  const [loading, setLoading] = React.useState(false)
+  const [loadAttempt, setLoadAttempt] = React.useState(0)
+  const [confirmingRestore, setConfirmingRestore] = React.useState(false)
+  const cancelRestoreRef = React.useRef<HTMLButtonElement>(null)
+
+  React.useEffect(() => {
+    setConfirmingRestore(false)
+    if (!versionId) { setPreview(null); setError(null); return }
+    let active = true
+    setLoading(true)
+    setError(null)
+    void apiCall<unknown>(`/api/documents/${encodeURIComponent(documentId)}/versions/${encodeURIComponent(versionId)}`)
+      .then((call) => {
+        if (!active) return
+        const next = call.ok
+          ? normalizeVersionPreview(call.result, t('documents.users.unknown'))
+          : null
+        if (!next) setError(t('documents.versions.preview.error'))
+        setPreview(next)
+      })
+      .catch(() => { if (active) setError(t('documents.versions.preview.error')) })
+      .finally(() => { if (active) setLoading(false) })
+    return () => { active = false }
+  }, [documentId, loadAttempt, t, versionId])
+
+  React.useEffect(() => {
+    if (confirmingRestore) cancelRestoreRef.current?.focus()
+  }, [confirmingRestore])
+
+  const requestRestore = React.useCallback(() => {
+    if (!canRestore || !preview || isRestoring) return
+    setConfirmingRestore(true)
+  }, [canRestore, isRestoring, preview])
+
+  const confirmRestore = React.useCallback(() => {
+    if (!canRestore || !preview || isRestoring) return
+    void onRestore(preview)
+  }, [canRestore, isRestoring, onRestore, preview])
+
+  const handleOpenChange = React.useCallback((open: boolean) => {
+    if (!open) setConfirmingRestore(false)
+    onOpenChange(open)
+  }, [onOpenChange])
+
+  return (
+    <Dialog open={versionId !== null} onOpenChange={handleOpenChange}>
+      <DialogContent size="xl" onKeyDown={(event) => {
+        if (event.key === 'Escape') {
+          if (confirmingRestore) {
+            event.preventDefault()
+            event.stopPropagation()
+            if (!isRestoring) setConfirmingRestore(false)
+          } else {
+            onOpenChange(false)
+          }
+        }
+        if ((event.metaKey || event.ctrlKey) && event.key === 'Enter' && canRestore && preview && !isRestoring) {
+          event.preventDefault()
+          if (confirmingRestore) confirmRestore()
+          else requestRestore()
+        }
+      }}>
+        <DialogHeader>
+          <DialogTitle>
+            {confirmingRestore
+              ? t('documents.versions.restore.confirmTitle')
+              : preview?.label ?? t('documents.versions.preview.title')}
+          </DialogTitle>
+          <DialogDescription aria-live={confirmingRestore ? 'assertive' : undefined}>
+            {confirmingRestore
+              ? t('documents.versions.restore.confirmBody')
+              : preview
+                ? t('documents.versions.preview.description', { creator: preview.creatorLabel, date: new Date(preview.createdAt).toLocaleString() })
+                : t('documents.versions.preview.loading')}
+          </DialogDescription>
+        </DialogHeader>
+        {!confirmingRestore && loading ? <LoadingMessage label={t('documents.versions.preview.loading')} /> : null}
+        {!confirmingRestore && error ? (
+          <ErrorMessage
+            label={error}
+            action={<Button type="button" size="sm" variant="outline" onClick={() => setLoadAttempt((current) => current + 1)}>{t('documents.actions.retry')}</Button>}
+          />
+        ) : null}
+        {!confirmingRestore && preview && !loading && !error ? <ReadOnlyVersion contentHtml={preview.contentHtml} fallbackLabel={t('documents.editor.entityRef.fallbackLabel')} /> : null}
+        <DialogFooter>
+          {confirmingRestore ? (
+            <>
+              <Button ref={cancelRestoreRef} type="button" variant="outline" onClick={() => setConfirmingRestore(false)} disabled={isRestoring}>
+                {t('documents.actions.cancel')}
+              </Button>
+              <Button type="button" onClick={confirmRestore} disabled={isRestoring}>
+                <RotateCcw />{t('documents.versions.actions.restore')}
+              </Button>
+            </>
+          ) : (
+            <>
+              <Button type="button" variant="outline" onClick={() => onOpenChange(false)}>{t('documents.actions.close')}</Button>
+              {canRestore && preview ? (
+                <Button type="button" onClick={requestRestore} disabled={isRestoring}>
+                  <RotateCcw />{t('documents.versions.actions.restore')}
+                </Button>
+              ) : null}
+            </>
+          )}
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}

package/src/modules/documents/backend/documents/[id]/commentTypes.ts

@@ -0,0 +1,192 @@
+import type { DocumentCommentAnchor } from '../../../data/validators'
+import { isChangedDocumentCommentAnchor, normalizeDocumentCommentAnchor } from '../../../lib/commentAnchors'
+import {
+  firstSafeDocumentsDisplayLabel,
+  sanitizeDocumentsDisplayLabel,
+} from '../../../lib/displayLabels'
+import { readArrayPayload, readBoolean, readRecord, readString } from '../documentUi'
+
+export type CommentMention = { userId: string }
+export type UserLabel = { label: string; secondary?: string | null }
+export type UserLabels = Record<string, UserLabel>
+export type PendingMention = { userId: string; name: string }
+export type AccessCheckUser = { userId: string; label: string | null; secondary: string | null }
+export type NormalizedCommentAnchor = DocumentCommentAnchor | 'changed' | null
+
+const MENTION_WORD_CHARACTER = /[\p{L}\p{N}_]/u
+
+function isMentionTokenBoundary(body: string, index: number, tokenLength: number): boolean {
+  const before = index > 0 ? body[index - 1] ?? '' : ''
+  const after = body[index + tokenLength] ?? ''
+  return !MENTION_WORD_CHARACTER.test(before) && !MENTION_WORD_CHARACTER.test(after)
+}
+
+export function bodyContainsPendingMention(body: string, mention: PendingMention): boolean {
+  const token = `@${mention.name}`
+  let index = body.indexOf(token)
+  while (index >= 0) {
+    if (isMentionTokenBoundary(body, index, token.length)) return true
+    index = body.indexOf(token, index + token.length)
+  }
+  return false
+}
+
+export function removePendingMentionOccurrences(
+  body: string,
+  mention: PendingMention,
+  pendingMentions: PendingMention[],
+): string {
+  const token = `@${mention.name}`
+  const extendingTokens = pendingMentions
+    .map((candidate) => `@${candidate.name}`)
+    .filter((candidate) => candidate.length > token.length && candidate.startsWith(token))
+    .sort((left, right) => right.length - left.length)
+  let result = ''
+  let cursor = 0
+  while (cursor < body.length) {
+    const extending = extendingTokens.find((candidate) => (
+      body.startsWith(candidate, cursor) && isMentionTokenBoundary(body, cursor, candidate.length)
+    ))
+    if (extending) {
+      result += extending
+      cursor += extending.length
+      continue
+    }
+    if (body.startsWith(token, cursor) && isMentionTokenBoundary(body, cursor, token.length)) {
+      cursor += token.length
+      continue
+    }
+    result += body[cursor]
+    cursor += 1
+  }
+  return result
+}
+
+export type DocumentComment = {
+  id: string
+  documentId: string
+  parentCommentId: string | null
+  authorUserId: string
+  body: string
+  mentions: CommentMention[]
+  anchor: NormalizedCommentAnchor
+  resolvedAt: string | null
+  resolvedByUserId: string | null
+  createdAt: string
+  updatedAt: string
+  canResolve: boolean
+  replies: DocumentComment[]
+}
+
+function readNullableString(record: Record<string, unknown>, ...keys: string[]): string | null {
+  for (const key of keys) {
+    const value = record[key]
+    if (value === null) return null
+    if (typeof value === 'string' && value.trim().length > 0) return value
+  }
+  return null
+}
+
+function readAnchor(value: unknown): NormalizedCommentAnchor {
+  if (value === null || value === undefined) return null
+  const normalized = normalizeDocumentCommentAnchor(value)
+  return isChangedDocumentCommentAnchor(normalized) ? 'changed' : normalized
+}
+
+function readMentions(value: unknown): CommentMention[] {
+  if (!Array.isArray(value)) return []
+  return value.flatMap((entry) => {
+    const record = readRecord(entry)
+    const userId = record ? readString(record, 'userId', 'user_id') : null
+    return userId ? [{ userId: userId.toLowerCase() }] : []
+  })
+}
+
+function normalizeComment(value: unknown): DocumentComment | null {
+  const record = readRecord(value)
+  if (!record) return null
+  const id = readString(record, 'id')
+  const documentId = readString(record, 'documentId', 'document_id')
+  const authorUserId = readString(record, 'authorUserId', 'author_user_id')
+  const createdAt = readString(record, 'createdAt', 'created_at')
+  const updatedAt = readString(record, 'updatedAt', 'updated_at')
+  if (!id || !documentId || !authorUserId || !createdAt || !updatedAt) return null
+  const replies = Array.isArray(record.replies)
+    ? record.replies.map(normalizeComment).filter((reply): reply is DocumentComment => reply !== null)
+    : []
+  return {
+    id,
+    documentId,
+    parentCommentId: readNullableString(record, 'parentCommentId', 'parent_comment_id'),
+    authorUserId,
+    body: readString(record, 'body') ?? '',
+    mentions: readMentions(record.mentions),
+    anchor: readAnchor(record.anchor),
+    resolvedAt: readNullableString(record, 'resolvedAt', 'resolved_at'),
+    resolvedByUserId: readNullableString(record, 'resolvedByUserId', 'resolved_by_user_id'),
+    createdAt,
+    updatedAt,
+    canResolve: readBoolean(record, 'canResolve', 'can_resolve') ?? false,
+    replies,
+  }
+}
+
+export function readCommentItems(payload: unknown): DocumentComment[] {
+  return readArrayPayload(payload, 'items', 'data')
+    .map(normalizeComment)
+    .filter((comment): comment is DocumentComment => comment !== null)
+}
+
+export function readUserLabels(payload: unknown, fallbackLabel?: string): UserLabels {
+  const record = readRecord(payload)
+  const rawLabels = readRecord(record?.userLabels)
+  if (!rawLabels) return {}
+  const safeFallback = sanitizeDocumentsDisplayLabel(fallbackLabel)
+  const labels: UserLabels = {}
+  for (const [userId, value] of Object.entries(rawLabels)) {
+    const labelRecord = readRecord(value)
+    const label = labelRecord
+      ? firstSafeDocumentsDisplayLabel(readString(labelRecord, 'label'), safeFallback)
+      : safeFallback
+    const secondary = labelRecord
+      ? sanitizeDocumentsDisplayLabel(readNullableString(labelRecord, 'secondary'))
+      : null
+    if (label) labels[userId.toLowerCase()] = {
+      label,
+      secondary: secondary && secondary !== label ? secondary : null,
+    }
+  }
+  return labels
+}
+
+export function readWithoutAccess(payload: unknown): AccessCheckUser[] {
+  const record = readRecord(payload)
+  if (!record) return []
+  if (Array.isArray(record.withoutAccessUsers)) {
+    return record.withoutAccessUsers.flatMap((value) => {
+      const user = readRecord(value)
+      const userId = user ? readString(user, 'userId', 'user_id', 'id') : null
+      if (!userId || !user) return []
+      const label = sanitizeDocumentsDisplayLabel(readNullableString(user, 'label'))
+      const secondary = sanitizeDocumentsDisplayLabel(readNullableString(user, 'secondary'))
+      return [{
+        userId: userId.toLowerCase(),
+        label,
+        secondary: secondary && secondary !== label ? secondary : null,
+      }]
+    })
+  }
+  if (!Array.isArray(record.withoutAccess)) return []
+  return record.withoutAccess.flatMap((value) => typeof value === 'string' ? [{
+    userId: value.toLowerCase(), label: null, secondary: null,
+  }] : [])
+}
+
+export function findCommentById(comments: DocumentComment[], commentId: string): DocumentComment | null {
+  for (const comment of comments) {
+    if (comment.id === commentId) return comment
+    const reply = findCommentById(comment.replies, commentId)
+    if (reply) return reply
+  }
+  return null
+}

package/src/modules/documents/backend/documents/[id]/componentCapabilities.ts

@@ -0,0 +1,17 @@
+export type DocumentTier = 'owner' | 'editor' | 'commenter' | 'viewer'
+
+export function resolveCommentsCapability(
+  canComment: boolean | undefined,
+  tier: DocumentTier | undefined,
+): boolean {
+  if (canComment !== undefined) return canComment
+  return tier === 'commenter' || tier === 'editor' || tier === 'owner'
+}
+
+export function resolveVersionRestoreCapability(
+  canRestore: boolean | undefined,
+  tier: DocumentTier | undefined,
+): boolean {
+  if (canRestore !== undefined) return canRestore
+  return tier === 'editor' || tier === 'owner'
+}