update: The interface for ordinary users to view resources has been replaced (#2018)

Author: zyd123-cmd

moon/apps/web/components/NoteEditor/NoteContent.tsx

@@ -140,7 +140,13 @@ export const NoteContent = memo(
     })
 
     return (
-      <div ref={containerRef} className={cn('relative', { 'opacity-50': isSyncError })}>
+      <div
+        ref={containerRef}
+        className={cn('relative', {
+          'opacity-50': isSyncError,
+          '[&_.ProseMirror]:cursor-default [&_.ProseMirror]:caret-transparent': editable !== 'all'
+        })}
+      >
         <LayeredHotkeys
           keys={ADD_ATTACHMENT_SHORTCUT}
           callback={() => {

moon/apps/web/components/NoteView/index.tsx

@@ -28,6 +28,7 @@ import { SubjectEspcapeLayeredHotkeys } from '@/components/Subject'
 import { ProjectAccessoryBreadcrumbIcon } from '@/components/Titlebar/BreadcrumbPageIcons'
 import { BreadcrumbLabel } from '@/components/Titlebar/BreadcrumbTitlebar'
 import { useScope } from '@/contexts/scope'
+import { useGetNotesPermissions } from '@/hooks/admin/useGetNotesPermissions'
 import { useCreateNoteView } from '@/hooks/useCreateNoteView'
 import { useGetNote } from '@/hooks/useGetNote'
 import { useGetNoteComments } from '@/hooks/useGetNoteComments'
@@ -85,6 +86,15 @@ function InnerNoteView({ note }: { note: Note }) {
   useCreateLingerNoteView(note.id, !!note)
   useLiveNoteUpdates(note)
 
+  // Get permissions for this note
+  const { data: notesPermissions } = useGetNotesPermissions({
+    notes: [note],
+    enabled: true
+  })
+
+  const permission = notesPermissions?.[note.id]
+  const hasWritePermission = permission?.hasWrite ?? note.viewer_can_edit
+
   // prefetch comments
   useGetNoteComments({ noteId: note.id })
   useGetNoteTimelineEvents({ noteId: note.id, enabled: true })
@@ -108,6 +118,7 @@ function InnerNoteView({ note }: { note: Note }) {
       </InboxSplitViewTitleBar>
 
       <PublicVisibilityBanner note={note} />
+      {!hasWritePermission && note.viewer_can_edit && <NoWritePermissionBanner />}
 
       <ScrollableContainer id='note-scroll-container'>
         <div
@@ -118,7 +129,7 @@ function InnerNoteView({ note }: { note: Note }) {
             <NoteEditor
               // key by note.id in order to reset tiptap editor state
               key={note.id}
-              note={note}
+              note={{ ...note, viewer_can_edit: hasWritePermission }}
             />
           )}
         </div>
@@ -146,6 +157,17 @@ function PublicVisibilityBanner({ note }: { note: Note }) {
   )
 }
 
+function NoWritePermissionBanner() {
+  return (
+    <div className='flex w-full items-center justify-center gap-3 border-b border-amber-100/60 bg-amber-50 px-4 py-2.5 text-sm text-amber-700 dark:border-amber-900/35 dark:bg-amber-900/20 dark:text-amber-200'>
+      <LockIcon size={18} className='flex-none' strokeWidth='2' />
+      <UIText weight='font-medium' inherit>
+        You have read-only access to this document
+      </UIText>
+    </div>
+  )
+}
+
 function useCreateLingerNoteView(noteId: string, isLoaded: boolean) {
   const { mutate: create } = useCreateNoteView()
   const hasMarkedSeen = useRef(false)

moon/apps/web/components/NotesIndex/NoteRow.tsx

@@ -2,7 +2,7 @@ import { memo } from 'react'
 import { format } from 'date-fns'
 
 import { Note } from '@gitmono/types'
-import { GlobeIcon, HighlightedCommandItem, NoteFilledIcon, Tooltip, UIText } from '@gitmono/ui'
+import { GlobeIcon, HighlightedCommandItem, LockIcon, NoteFilledIcon, Tooltip, UIText } from '@gitmono/ui'
 import { cn } from '@gitmono/ui/src/utils'
 
 import { NoteOverflowMenu } from '@/components/NoteOverflowMenu'
@@ -41,7 +41,7 @@ export const NoteRow = memo(({ note, display = 'default', hideProject = false, p
     const content = (
       <div
         className={cn('relative flex items-center gap-3 px-3 py-2.5', {
-          'cursor-not-allowed opacity-40': isDisabled
+          'cursor-not-allowed opacity-50': isDisabled
         })}
       >
         <NoteOverflowMenu type='context' note={note}>
@@ -53,25 +53,36 @@ export const NoteRow = memo(({ note, display = 'default', hideProject = false, p
           />
         </NoteOverflowMenu>
 
-        <div className='flex h-11 w-11 items-center justify-center rounded-full bg-blue-50 text-blue-500 dark:bg-blue-900/50'>
-          <NoteFilledIcon size={24} />
+        <div
+          className={cn(
+            'flex h-11 w-11 items-center justify-center rounded-full',
+            isDisabled
+              ? 'bg-gray-100 text-gray-400 dark:bg-gray-800 dark:text-gray-600'
+              : 'bg-blue-50 text-blue-500 dark:bg-blue-900/50'
+          )}
+        >
+          {isDisabled ? <LockIcon size={24} strokeWidth='2' /> : <NoteFilledIcon size={24} />}
         </div>
 
         <UIText weight='font-medium' className='break-anywhere line-clamp-1 max-w-lg'>
           {note.title || 'Untitled'}
         </UIText>
-
-        {isDisabled && <span className='text-xs text-gray-400'>🔒</span>}
       </div>
     )
 
-    return isDisabled ? <Tooltip label='You do not have permission to view this document'>{content}</Tooltip> : content
+    return isDisabled ? (
+      <Tooltip label='You do not have permission to view this document' side='top' align='start'>
+        {content}
+      </Tooltip>
+    ) : (
+      content
+    )
   }
 
   const content = (
     <div
       className={cn('relative flex items-center gap-3 px-3 py-2.5', {
-        'cursor-not-allowed opacity-40': isDisabled
+        'cursor-not-allowed opacity-50': isDisabled
       })}
     >
       <NoteOverflowMenu type='context' note={note}>
@@ -84,7 +95,13 @@ export const NoteRow = memo(({ note, display = 'default', hideProject = false, p
       </NoteOverflowMenu>
 
       <div className='flex flex-1 items-center gap-3'>
-        <NotePrivacyIndicator note={note} />
+        {isDisabled ? (
+          <div className='flex h-5 w-5 items-center justify-center rounded bg-gray-100 text-gray-500 dark:bg-gray-800 dark:text-gray-400'>
+            <LockIcon size={14} strokeWidth='2.5' />
+          </div>
+        ) : (
+          <NotePrivacyIndicator note={note} />
+        )}
 
         <ViewerFollowUpTag followUps={note.follow_ups} />
 
@@ -97,8 +114,6 @@ export const NoteRow = memo(({ note, display = 'default', hideProject = false, p
             {format(note.created_at, 'MMM d, yyyy')}
           </UIText>
         )}
-
-        {isDisabled && <span className='text-xs text-gray-400'>🔒</span>}
       </div>
 
       <div className='flex items-center gap-1'>
@@ -114,6 +129,12 @@ export const NoteRow = memo(({ note, display = 'default', hideProject = false, p
     </div>
   )
 
-  return isDisabled ? <Tooltip label='You do not have permission to view this document'>{content}</Tooltip> : content
+  return isDisabled ? (
+    <Tooltip label='You do not have permission to view this document' side='top' align='start'>
+      {content}
+    </Tooltip>
+  ) : (
+    content
+  )
 })
 NoteRow.displayName = 'NoteRow'

moon/apps/web/hooks/admin/useGetNotesPermissions.ts

@@ -48,9 +48,17 @@ export function useGetNotesPermissions({ notes, enabled = true }: UseGetNotesPer
       // Batch query permissions for all notes
       const permissionsPromises = notes.map(async (note) => {
         try {
-          const response = await legacyApiClient.v1
-            .getApiAdminUsersPermissionsByResourceId()
-            .request(currentUser?.username || '', 'note', note.id)
+          let response
+
+          if (isSystemAdmin) {
+            // Admin users: use admin endpoint
+            response = await legacyApiClient.v1
+              .getApiAdminUsersPermissionsByResourceId()
+              .request(currentUser?.username || '', 'note', note.id)
+          } else {
+            // Regular users: use /me endpoint
+            response = await legacyApiClient.v1.getApiPermissionsMeByResourceId().request('note', note.id)
+          }
 
           if (response?.data) {
             return {