diff --git a/packages/ra-core/src/dataProvider/useCreate.ts b/packages/ra-core/src/dataProvider/useCreate.ts index 3b34cb63948..4aae973adfa 100644 --- a/packages/ra-core/src/dataProvider/useCreate.ts +++ b/packages/ra-core/src/dataProvider/useCreate.ts @@ -39,9 +39,10 @@ import { RaRecord, CreateParams } from '../types'; * * @example // set params when calling the create callback * - * import { useCreate } from 'react-admin'; + * import { useCreate, useRecordContext } from 'react-admin'; * - * const LikeButton = ({ record }) => { + * const LikeButton = () => { + * const record = useRecordContext(); * const like = { postId: record.id }; * const [create, { isLoading, error }] = useCreate(); * const handleClick = () => { @@ -53,9 +54,10 @@ import { RaRecord, CreateParams } from '../types'; * * @example // set params when calling the hook * - * import { useCreate } from 'react-admin'; + * import { useCreate, useRecordContext } from 'react-admin'; * - * const LikeButton = ({ record }) => { + * const LikeButton = () => { + * const record = useRecordContext(); * const like = { postId: record.id }; * const [create, { isLoading, error }] = useCreate('likes', { data: like }); * if (error) { return

ERROR

; } diff --git a/packages/ra-core/src/dataProvider/useDelete.ts b/packages/ra-core/src/dataProvider/useDelete.ts index d881ef2c557..da72dd49fc9 100644 --- a/packages/ra-core/src/dataProvider/useDelete.ts +++ b/packages/ra-core/src/dataProvider/useDelete.ts @@ -48,9 +48,10 @@ import { * * @example // set params when calling the deleteOne callback * - * import { useDelete } from 'react-admin'; + * import { useDelete, useRecordContext } from 'react-admin'; * - * const DeleteButton = ({ record }) => { + * const DeleteButton = () => { + * const record = useRecordContext(); * const [deleteOne, { isLoading, error }] = useDelete(); * const handleClick = () => { * deleteOne('likes', { id: record.id, previousData: record }) @@ -61,9 +62,10 @@ import { * * @example // set params when calling the hook * - * import { useDelete } from 'react-admin'; + * import { useDelete, useRecordContext } from 'react-admin'; * - * const DeleteButton = ({ record }) => { + * const DeleteButton = () => { + * const record = useRecordContext(); * const [deleteOne, { isLoading, error }] = useDelete('likes', { id: record.id, previousData: record }); * if (error) { return

ERROR

; } * return ; diff --git a/packages/ra-core/src/dataProvider/useGetManyAggregate.ts b/packages/ra-core/src/dataProvider/useGetManyAggregate.ts index 34c1309a744..a3efc92ff9a 100644 --- a/packages/ra-core/src/dataProvider/useGetManyAggregate.ts +++ b/packages/ra-core/src/dataProvider/useGetManyAggregate.ts @@ -49,9 +49,10 @@ import { useDataProvider } from './useDataProvider'; * * @example * - * import { useGetManyAggregate } from 'react-admin'; + * import { useGetManyAggregate, useRecordContext } from 'react-admin'; * - * const PostTags = ({ record }) => { + * const PostTags = () => { + * const record = useRecordContext(); * const { data, isLoading, error } = useGetManyAggregate('tags', { ids: record.tagIds }); * if (isLoading) { return ; } * if (error) { return

ERROR

; } diff --git a/packages/ra-core/src/dataProvider/useGetManyReference.ts b/packages/ra-core/src/dataProvider/useGetManyReference.ts index 35131eafbd1..fb2d159c35a 100644 --- a/packages/ra-core/src/dataProvider/useGetManyReference.ts +++ b/packages/ra-core/src/dataProvider/useGetManyReference.ts @@ -39,14 +39,14 @@ import { useDataProvider } from './useDataProvider'; * @prop params.filter The request filters, e.g. { title: 'hello, world' } * @prop params.meta Optional meta parameters * - * * @returns The current request state. Destructure as { data, total, error, isLoading, refetch }. * * @example * - * import { useGetManyReference } from 'react-admin'; + * import { useGetManyReference, useRecordContext } from 'react-admin'; * - * const PostComments = ({ record }) => { + * const PostComments = () => { + * const record = useRecordContext(); * // fetch all comments related to the current record * const { data, isLoading, error } = useGetManyReference( * 'comments', diff --git a/packages/ra-core/src/dataProvider/useGetOne.ts b/packages/ra-core/src/dataProvider/useGetOne.ts index b36ab4462a0..b0eace49c38 100644 --- a/packages/ra-core/src/dataProvider/useGetOne.ts +++ b/packages/ra-core/src/dataProvider/useGetOne.ts @@ -31,9 +31,10 @@ import { useDataProvider } from './useDataProvider'; * * @example * - * import { useGetOne } from 'react-admin'; + * import { useGetOne, useRecordContext } from 'react-admin'; * - * const UserProfile = ({ record }) => { + * const UserProfile = () => { + * const record = useRecordContext(); * const { data, isLoading, error } = useGetOne('users', { id: record.id }); * if (isLoading) { return ; } * if (error) { return

ERROR

; } diff --git a/packages/ra-core/src/dataProvider/useUpdate.ts b/packages/ra-core/src/dataProvider/useUpdate.ts index e876b9aa449..e0ea0504667 100644 --- a/packages/ra-core/src/dataProvider/useUpdate.ts +++ b/packages/ra-core/src/dataProvider/useUpdate.ts @@ -50,9 +50,10 @@ import { * * @example // set params when calling the update callback * - * import { useUpdate } from 'react-admin'; + * import { useUpdate, useRecordContext } from 'react-admin'; * - * const IncreaseLikeButton = ({ record }) => { + * const IncreaseLikeButton = () => { + * const record = useRecordContext(); * const diff = { likes: record.likes + 1 }; * const [update, { isLoading, error }] = useUpdate(); * const handleClick = () => { @@ -64,9 +65,10 @@ import { * * @example // set params when calling the hook * - * import { useUpdate } from 'react-admin'; + * import { useUpdate, useRecordContext } from 'react-admin'; * - * const IncreaseLikeButton = ({ record }) => { + * const IncreaseLikeButton = () => { + * const record = useRecordContext(); * const diff = { likes: record.likes + 1 }; * const [update, { isLoading, error }] = useUpdate('likes', { id: record.id, data: diff, previousData: record }); * if (error) { return

ERROR

; } diff --git a/packages/ra-core/src/dataProvider/useUpdateMany.ts b/packages/ra-core/src/dataProvider/useUpdateMany.ts index 9d2ef8eb6d9..f1705001855 100644 --- a/packages/ra-core/src/dataProvider/useUpdateMany.ts +++ b/packages/ra-core/src/dataProvider/useUpdateMany.ts @@ -50,9 +50,10 @@ import { Identifier } from '..'; * * @example // set params when calling the updateMany callback * - * import { useUpdateMany } from 'react-admin'; + * import { useUpdateMany, useListContext } from 'react-admin'; * - * const BulkResetViewsButton = ({ selectedIds }) => { + * const BulkResetViewsButton = () => { + * const { selectedIds } = useListContext(); * const [updateMany, { isLoading, error }] = useUpdateMany(); * const handleClick = () => { * updateMany('posts', { ids: selectedIds, data: { views: 0 } }); @@ -63,9 +64,10 @@ import { Identifier } from '..'; * * @example // set params when calling the hook * - * import { useUpdateMany } from 'react-admin'; + * import { useUpdateMany, useListContext } from 'react-admin'; * - * const BulkResetViewsButton = ({ selectedIds }) => { + * const BulkResetViewsButton = () => { + * const { selectedIds } = useListContext(); * const [updateMany, { isLoading, error }] = useUpdateMany('posts', { ids: selectedIds, data: { views: 0 } }); * if (error) { return

ERROR

; } * return ; diff --git a/packages/ra-ui-materialui/src/button/ShowButton.tsx b/packages/ra-ui-materialui/src/button/ShowButton.tsx index 9fa2b776a46..5b772d43c08 100644 --- a/packages/ra-ui-materialui/src/button/ShowButton.tsx +++ b/packages/ra-ui-materialui/src/button/ShowButton.tsx @@ -16,11 +16,14 @@ import { Button, ButtonProps } from './Button'; * Opens the Show view of a given record * * @example // basic usage - * import { ShowButton } from 'react-admin'; + * import { ShowButton, useRecordContext } from 'react-admin'; * - * const CommentShowButton = ({ record }) => ( - * - * ); + * const CommentShowButton = () => { + * const record = useRecordContext(); + * return ( + * + * ); + * }; */ const ShowButton = ( props: ShowButtonProps diff --git a/packages/ra-ui-materialui/src/detail/EditActions.tsx b/packages/ra-ui-materialui/src/detail/EditActions.tsx index 99313905d5f..d8705838e1b 100644 --- a/packages/ra-ui-materialui/src/detail/EditActions.tsx +++ b/packages/ra-ui-materialui/src/detail/EditActions.tsx @@ -14,11 +14,11 @@ import TopToolbar from '../layout/TopToolbar'; * * @example * import Button from '@mui/material/Button'; - * import { TopToolbar, ShowButton, Edit } from 'react-admin'; + * import { TopToolbar, EditButton, Edit } from 'react-admin'; * - * const PostEditActions = ({ record, resource }) => ( + * const PostEditActions = () => ( * - * + * * // Add your custom actions here * * diff --git a/packages/ra-ui-materialui/src/detail/ShowActions.tsx b/packages/ra-ui-materialui/src/detail/ShowActions.tsx index 9ffc382e902..887630b6df6 100644 --- a/packages/ra-ui-materialui/src/detail/ShowActions.tsx +++ b/packages/ra-ui-materialui/src/detail/ShowActions.tsx @@ -14,11 +14,11 @@ import TopToolbar from '../layout/TopToolbar'; * * @example * import Button from '@mui/material/Button'; - * import { TopToolbar, EditButton, Show } from 'react-admin'; + * import { TopToolbar, ShowButton, Show } from 'react-admin'; * - * const PostShowActions = ({ record, resource }) => ( + * const PostShowActions = () => ( * - * + * * // Add your custom actions here // * * diff --git a/packages/ra-ui-materialui/src/field/ArrayField.tsx b/packages/ra-ui-materialui/src/field/ArrayField.tsx index 0722981f328..83d5bf1539c 100644 --- a/packages/ra-ui-materialui/src/field/ArrayField.tsx +++ b/packages/ra-ui-materialui/src/field/ArrayField.tsx @@ -61,13 +61,16 @@ import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; * to write your own component: * * @example - * const TagsField = ({ record }) => ( - *
    - * {record.tags.map(item => ( - *
  • {item.name}
  • - * ))} - *
- * ); + * const TagsField = () => { + * const record = useRecordContext(); + * return ( + *
    + * {record.tags.map(item => ( + *
  • {item.name}
  • + * ))} + *
+ * ); + * }; */ export const ArrayField: FC = memo(props => { const { children, resource, source } = props; diff --git a/packages/ra-ui-materialui/src/field/SelectField.tsx b/packages/ra-ui-materialui/src/field/SelectField.tsx index cb2692d0a14..6c4d4beb552 100644 --- a/packages/ra-ui-materialui/src/field/SelectField.tsx +++ b/packages/ra-ui-materialui/src/field/SelectField.tsx @@ -55,7 +55,10 @@ import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; * { id: 123, first_name: 'Leo', last_name: 'Tolstoi' }, * { id: 456, first_name: 'Jane', last_name: 'Austen' }, * ]; - * const FullNameField = ({ record }) => {record.first_name} {record.last_name}; + * const FullNameField = () => { + * const record = useRecordContext(); + * return ({record.first_name} {record.last_name}) + * }; * }/> * * The current choice is translated by default, so you can use translation identifiers as choices: diff --git a/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx b/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx index 268bc259a54..42bb459c7c4 100644 --- a/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx +++ b/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx @@ -60,7 +60,10 @@ import { LinearProgress } from '../layout'; * { id: 123, first_name: 'Leo', last_name: 'Tolstoi' }, * { id: 456, first_name: 'Jane', last_name: 'Austen' }, * ]; - * const FullNameField = ({ record }) => {record.first_name} {record.last_name}; + * const FullNameField = () => { + * const record = useRecordContext(); + * return ({record.first_name} {record.last_name}) + * }; * }/> * * The choices are translated by default, so you can use translation identifiers as choices: diff --git a/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx b/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx index 3c2b8632d13..bc7e8131f3d 100644 --- a/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx +++ b/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx @@ -71,7 +71,10 @@ import { * { id: 123, first_name: 'Leo', last_name: 'Tolstoi' }, * { id: 456, first_name: 'Jane', last_name: 'Austen' }, * ]; - * const FullNameField = ({ record }) => {record.first_name} {record.last_name}; + * const FullNameField = () => { + * const record = useRecordContext(); + * return ({record.first_name} {record.last_name}) + * }; * }/> * * The choices are translated by default, so you can use translation identifiers as choices: