feat: update premissions banner copy and add center prop to banner

sanity-io · Sep 26, 2024 · fa20161 · fa20161
1 parent 05a05ba
commit fa20161
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 12 deletions.
diff --git a/packages/sanity/src/structure/i18n/resources.ts b/packages/sanity/src/structure/i18n/resources.ts
@@ -104,16 +104,16 @@ const structureLocaleStrings = defineLocalesResources('structure', {
     'The type <strong>{{schemaType}}</strong> has <code>liveEdit</code> enabled, but a draft version of this document exists. Publish or discard the draft in order to continue live editing it.',
   /** The text for the permission check banner if the user only has one role, and it does not allow updating this document */
   'banners.permission-check-banner.missing-permission_create_one':
-    'Your role <Roles/> does not have permissions to publish this document.',
+    "You don't have permission to publish this document.",
   /** The text for the permission check banner if the user only has multiple roles, but they do not allow updating this document */
   'banners.permission-check-banner.missing-permission_create_other':
-    'Your roles <Roles/> do not have permissions to publish this document.',
+    "You don't have permission to publish this document.",
   /** The text for the permission check banner if the user only has one role, and it does not allow updating this document */
   'banners.permission-check-banner.missing-permission_update_one':
-    'Your role <Roles/> does not have permissions to edit this document.',
+    "You don't have permission to edit this document.",
   /** The text for the permission check banner if the user only has multiple roles, but they do not allow updating this document */
   'banners.permission-check-banner.missing-permission_update_other':
-    'Your roles <Roles/> do not have permissions to edit this document.',
+    "You don't have permission to edit this document.",
   /** The text for the request permission button that appears for viewer roles */
   'banners.permission-check-banner.request-permission-button.text': 'Ask to edit',
   /** The text for the reload button */

diff --git a/packages/sanity/src/structure/panes/document/documentPanel/banners/Banner.tsx b/packages/sanity/src/structure/panes/document/documentPanel/banners/Banner.tsx
@@ -1,8 +1,7 @@
-import {type ButtonTone, Card, type CardTone, Flex, Text} from '@sanity/ui'
+import {type ButtonMode, type ButtonTone, Card, type CardTone, Flex, Text} from '@sanity/ui'
 import {type ComponentType, type ElementType, type JSX, type ReactNode} from 'react'
 
 import {Button} from '../../../../../ui-components'
-import {SpacerButton} from '../../../../components/spacerButton'
 
 interface BannerProps {
   action?: {
@@ -11,34 +10,34 @@ interface BannerProps {
     onClick?: () => void
     text: string
     tone?: ButtonTone
+    mode?: ButtonMode
   }
   content: ReactNode
   icon?: ComponentType
   tone?: CardTone
+  center?: boolean
 }
 
 export function Banner(props: BannerProps) {
-  const {action, content, icon: Icon, tone = 'transparent', ...rest} = props
+  const {action, center, content, icon: Icon, tone = 'transparent', ...rest} = props
 
   return (
     <Card borderBottom paddingX={4} paddingY={2} tone={tone} {...rest}>
-      <Flex align="center" gap={3}>
+      <Flex align="center" justify={center ? 'center' : undefined} gap={3}>
         {Icon && (
           <Text size={0}>
             <Icon />
           </Text>
         )}
 
-        <Flex align="center" flex={1} gap={2} paddingY={3}>
+        <Flex align="center" flex={center ? undefined : 1} gap={2} paddingY={3}>
           {content}
         </Flex>
 
-        <SpacerButton />
-
         {action && (
           <Button
             as={action?.as}
-            mode="ghost"
+            mode={action.mode || 'ghost'}
             onClick={action?.onClick}
             text={action.text}
             tone={action.tone || 'default'}

diff --git a/packages/sanity/src/structure/panes/document/documentPanel/banners/PermissionCheckBanner.tsx b/packages/sanity/src/structure/panes/document/documentPanel/banners/PermissionCheckBanner.tsx
@@ -45,12 +45,14 @@ export function PermissionCheckBanner({granted, requiredPermission}: PermissionC
             />
           </Text>
         }
+        center
         action={
           isOnlyViewer
             ? {
                 onClick: () => setShowDialog(true),
                 text: t('banners.permission-check-banner.request-permission-button.text'),
                 tone: 'primary',
+                // mode: 'bleed',
               }
             : undefined
         }