diff --git a/docs/SimpleForm.md b/docs/SimpleForm.md index ffeb4d3ff93..28d00641c22 100644 --- a/docs/SimpleForm.md +++ b/docs/SimpleForm.md @@ -846,3 +846,47 @@ const ProductEdit = () => ( ); ``` + +`@react-admin/ra-rbac` `` also accepts a `showReadOnly` prop. If set to `true`, inputs for which users have only `read` access will be displayed but will be read only: + +```tsx +import { Edit, TextInput } from 'react-admin'; +import { SimpleForm } from '@react-admin/ra-rbac'; + +const authProvider = { + // ... + canAccess: async ({ action, record, resource }) => + canAccessWithPermissions({ + permissions: [ + // 'delete' is missing + { action: ['list', 'edit'], resource: 'products' }, + { action: 'write', resource: 'products.reference' }, + { action: 'write', resource: 'products.width' }, + { action: 'write', resource: 'products.height' }, + // 'products.description' is read-only + { action: 'read', resource: 'products.description' }, + { action: 'write', resource: 'products.thumbnail' }, + // 'products.image' is missing + ] + action, + record, + resource, + }), +}; + +const ProductEdit = () => ( + + + + + + {/* read-only */} + + {/* not displayed */} + + + {/* no delete button */} + + +); +``` diff --git a/docs/TabbedForm.md b/docs/TabbedForm.md index 85eaa1356f1..d29987d0292 100644 --- a/docs/TabbedForm.md +++ b/docs/TabbedForm.md @@ -1024,3 +1024,56 @@ const ProductEdit = () => ( ); ``` + +`@react-admin/ra-rbac` `` also accepts a `showReadOnly` prop. If set to `true`, inputs for which users have only `read` access will be displayed but will be read only: + +```tsx +import { Edit, TextInput } from 'react-admin'; +import { TabbedForm } from '@react-admin/ra-rbac'; + +const authProvider = { + // ... + canAccess: async ({ action, record, resource }) => + canAccessWithPermissions({ + permissions: [ + { action: ['list', 'edit'], resource: 'products' }, + { action: 'write', resource: 'products.reference' }, + { action: 'write', resource: 'products.width' }, + { action: 'write', resource: 'products.height' }, + // 'products.description' is read-only + { action: 'read', resource: 'products.description' }, + { action: 'write', resource: 'products.thumbnail' }, + // 'products.image' is missing + { action: 'write', resource: 'products.tab.description' }, + // 'products.tab.stock' is missing + { action: 'write', resource: 'products.tab.images' }, + ], + action, + record, + resource, + }) +}; + +const ProductEdit = () => ( + + + + + + + {/* Input Description is read-only */} + + + {/* Tab Stock is not displayed */} + + + + + {/* Input Image is not displayed */} + + + + + +); +``` \ No newline at end of file