Skip to content

Commit dd41f84

Browse files
committed
code review, and more paragraphs
1 parent 462999a commit dd41f84

File tree

7 files changed

+90
-6
lines changed

7 files changed

+90
-6
lines changed

docs/Datagrid.md

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1203,6 +1203,7 @@ const MyCustomList = () => {
12031203
```
12041204

12051205
## How to disable checkboxes
1206+
12061207
You can disable bulk actions altogether by passing `false` to the `bulkActionButtons` prop. In this case, the checkboxes column doesn’t show up anymore.
12071208

12081209
```tsx
@@ -1215,4 +1216,21 @@ export const PostList = () => (
12151216
</Datagrid>
12161217
</List>
12171218
);
1218-
```
1219+
```
1220+
1221+
## Disable column sorting
1222+
1223+
In a `<Datagrid>`, users can change the sort field and order by clicking on the column headers. You may want to disable this behavior for a given field (e.g. for reference or computed fields). In that case, pass a `false` value to the `sortable` prop on the field.
1224+
1225+
```jsx
1226+
const PostList = () => (
1227+
<List>
1228+
<Datagrid>
1229+
<TextField source="title" />
1230+
<ReferenceField source="author_id" sortable={false}>
1231+
<TextField source="name" />
1232+
</ReferenceField>
1233+
</Datagrid>
1234+
</List>
1235+
);
1236+
```

docs/Fields.md

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -368,6 +368,17 @@ const BookEdit = () => (
368368
);
369369
```
370370

371+
## Hiding A Field Label
372+
373+
You can opt out of the label decoration by passing `false` to the `label` prop.
374+
375+
```jsx
376+
// No label will be added
377+
<TextField source="author.name" label={false} />
378+
```
379+
380+
**Note**: This prop has no effect when rendering a field outside a `<Datagrid>`, a `<SimpleShowLayout>`, a `<TabbedShowLayout>`, a `<SimpleForm>`, or a `<TabbedForm>`.
381+
371382
## Conditional Formatting
372383

373384
If you want to format a field depending on the value, create another component wrapping this field, and set the `sx` prop depending on the field value:

docs/Inputs.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -910,3 +910,13 @@ You can find components for react-admin in third-party repositories.
910910
- [@react-page/react-admin](https://react-page.github.io/docs/#/integration-react-admin): ReactPage is a rich content editor and comes with a ready-to-use React-admin input component. [check out the demo](https://react-page.github.io/examples/reactadmin)
911911

912912
- **DEPRECATED V3** [LoicMahieu/aor-tinymce-input](https://github.com/LoicMahieu/aor-tinymce-input): a TinyMCE component, useful for editing HTML
913+
914+
## Hiding the label
915+
916+
You can set `label={false}` on an input component to hide its label.
917+
918+
```jsx
919+
<TextInput source="title" /> {/* input label is "Title" */}
920+
<TextInput source="title" label="Post title" /> {/* input label is "Post title" */}
921+
<TextInput source="title" label={false} /> {/* input has no label */}
922+
```

docs/List.md

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1009,6 +1009,7 @@ const PostList = () => (
10091009
The list will automatically update when a new record is created, or an existing record is updated or deleted.
10101010

10111011
## How to render an empty list
1012+
10121013
You can set the `empty` props value to `false` to bypass the empty page display and render an empty list instead.
10131014

10141015
```tsx
@@ -1021,8 +1022,9 @@ const ProductList = () => (
10211022
)
10221023
```
10231024

1024-
## How to remove `<ExportButton>`
1025-
You can remove the `<ExportButton>` by passing false to the exporter prop.
1025+
## How to remove the `<ExportButton>`
1026+
1027+
You can remove the `<ExportButton>` by passing `false` to the exporter prop.
10261028

10271029
```tsx
10281030
import { List } from 'react-admin';
@@ -1034,8 +1036,9 @@ const ProductList = () => (
10341036
)
10351037
```
10361038

1037-
## How to disable `storeKey`
1038-
You can disable `storeKey` feature by setting the `storeKey` prop to `false`. When disabled, parameters will not be persisted in the store.
1039+
## How to disable storing the list parameters in the Store
1040+
1041+
You can disable the `storeKey` feature by setting the `storeKey` prop to `false`. When disabled, the list parameters will not be persisted in [the Store](./Store.md).
10391042

10401043
```tsx
10411044
import { List } from 'react-admin';
@@ -1045,4 +1048,4 @@ const ProductList = () => (
10451048
...
10461049
</List>
10471050
)
1048-
```
1051+
```

docs/ReferenceField.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -301,3 +301,12 @@ React-admin accumulates and deduplicates the ids of the referenced records to ma
301301
```
302302

303303
Then react-admin renders the `<PostList>` with a loader for the `<ReferenceField>`, fetches the API for the related users in one call (`dataProvider.getMany('users', { ids: [789,735] }`), and re-renders the list once the data arrives. This accelerates the rendering and minimizes network load.
304+
305+
## Removing the link
306+
307+
You can prevent `<ReferenceField>` from adding a link to its children by setting `link` to `false`.
308+
309+
```jsx
310+
// No link
311+
<ReferenceField source="user_id" reference="users" link={false} />
312+
```

docs/ReferenceOneField.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -223,3 +223,13 @@ const BookShow = () => (
223223
);
224224
```
225225
{% endraw %}
226+
227+
## Removing the link
228+
229+
By default, `<ReferenceOneField>` links to the edition page of the related record. You can disable this behavior by setting the `link` prop to `false`.
230+
231+
```jsx
232+
<ReferenceOneField label="Genre" reference="book_details" target="book_id" link={false}>
233+
<TextField source="genre" />
234+
</ReferenceOneField>
235+
```

docs/SimpleShowLayout.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -206,6 +206,29 @@ The `<SimpleShowLayout>` component accepts the usual `className` prop but you ca
206206

207207
To override the style of all instances of `<SimpleShowLayout>` using the [Material UI style overrides](https://mui.com/material-ui/customization/theme-components/#theme-style-overrides), use the `RaSimpleShowLayout` key.
208208

209+
## Hiding the labels
210+
211+
You can disable the `<Labeled>` decoration added by `<SimpleShowLayout>` by passing setting `label={false}` on a field:
212+
213+
```jsx
214+
const PostShow = () => (
215+
<Show>
216+
<SimpleShowLayout>
217+
<TextField label={false} source="title" />
218+
</SimpleShowLayout>
219+
</Show>
220+
);
221+
222+
// translates to
223+
const PostShow = () => (
224+
<Show>
225+
<Stack>
226+
<TextField source="title" />
227+
</Stack>
228+
</Show>
229+
);
230+
```
231+
209232
## See Also
210233

211234
* [Field components](./Fields.md)

0 commit comments

Comments
 (0)