feat(core): add banner when the user doesn't have permissions to publ…

…ish or schedule

packages/sanity/src/core/releases/i18n/resources.ts

@@ -187,6 +187,11 @@ const releasesLocaleStrings = {
   /** Title for the release tool */
   'overview.title': 'Releases',
 
+  /** Text for when a user doesn't have publish or schedule releases */
+  'permission-missing-title': 'Limited access',
+  /** Description for when a user doesn't have publish or schedule releases */
+  'permission-missing-description':
+    'This release is not yet published. Only users with access to this release can view it.',
   /** Title for the dialog confirming the publish of a release */
   'publish-dialog.confirm-publish.title':
     'Are you sure you want to publish the release and all document versions?',

packages/sanity/src/core/releases/tool/detail/ReleaseDashboardDetails.tsx

@@ -1,4 +1,4 @@
-import {ErrorOutlineIcon, PinFilledIcon, PinIcon} from '@sanity/icons'
+import {ErrorOutlineIcon, PinFilledIcon, PinIcon, WarningOutlineIcon} from '@sanity/icons'
 import {
   Box,
   // Custom button with full radius used here
@@ -10,7 +10,7 @@ import {
   Stack,
   Text,
 } from '@sanity/ui'
-import {useCallback} from 'react'
+import {useCallback, useEffect, useState} from 'react'
 
 import {ToneIcon} from '../../../../ui-components/toneIcon/ToneIcon'
 import {TextWithTone} from '../../../components/textWithTone/TextWithTone'
@@ -19,6 +19,7 @@ import {useTranslation} from '../../../i18n'
 import {usePerspective} from '../../../perspective/usePerspective'
 import {useSetPerspective} from '../../../perspective/useSetPerspective'
 import {releasesLocaleNamespace} from '../../i18n'
+import {useReleaseOperations} from '../../store'
 import {type ReleaseDocument} from '../../store/types'
 import {getReleaseIdFromReleaseDocumentId} from '../../util/getReleaseIdFromReleaseDocumentId'
 import {getReleaseTone} from '../../util/getReleaseTone'
@@ -28,13 +29,32 @@ import {ReleaseTypePicker} from './ReleaseTypePicker'
 export function ReleaseDashboardDetails({release}: {release: ReleaseDocument}) {
   const {state} = release
   const releaseId = getReleaseIdFromReleaseDocumentId(release._id)
+  const {canSchedule, canPublish} = useReleaseOperations()
 
   const {t: tRelease} = useTranslation(releasesLocaleNamespace)
   const {selectedReleaseId} = usePerspective()
   const setPerspective = useSetPerspective()
   const isSelected = releaseId === selectedReleaseId
-  const shouldDisplayError = release.state === 'active' && typeof release.error !== 'undefined'
   const isAtTimeRelease = release?.metadata?.releaseType === 'scheduled'
+  const isActive = release.state === 'active'
+  const shouldDisplayError = isActive && typeof release.error !== 'undefined'
+  const [shouldDisplayPermissionWarning, setShouldDisplayPermissionWarning] = useState(false)
+
+  useEffect(() => {
+    // only run if the release is active
+    if (isActive) {
+      canPublish(release._id).then((response) => {
+        setShouldDisplayPermissionWarning(!response)
+      })
+
+      // if it's a release that can be scheduled, check if it can be scheduled
+      if (release.metadata.intendedPublishAt && isAtTimeRelease) {
+        canSchedule(release._id, new Date(release.metadata.intendedPublishAt)).then((response) => {
+          setShouldDisplayPermissionWarning(!response)
+        })
+      }
+    }
+  })
 
   const handlePinRelease = useCallback(() => {
     if (isSelected) {
@@ -98,6 +118,22 @@ export function ReleaseDashboardDetails({release}: {release: ReleaseDocument}) {
             </Flex>
           </Card>
         )}
+
+        {isActive && shouldDisplayPermissionWarning && (
+          <Card padding={4} radius={4} tone="caution">
+            <Flex gap={3}>
+              <Text size={1}>
+                <WarningOutlineIcon />
+              </Text>
+              <Stack space={3}>
+                <Text size={1}>{tRelease('permission-missing-title')}</Text>
+                <Text size={1} muted>
+                  {tRelease('permission-missing-description')}
+                </Text>
+              </Stack>
+            </Flex>
+          </Card>
+        )}
       </Stack>
     </Container>
   )