Skip to content

Commit 45a51fd

Browse files
committed
update other (mostly)
1 parent 572a078 commit 45a51fd

File tree

3 files changed

+47
-55
lines changed

3 files changed

+47
-55
lines changed

docs_headless/src/content/docs/other/RecordRepresentation.md

Lines changed: 23 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,58 @@
11
---
2-
layout: default
3-
title: "The RecordRepresentation Component"
2+
title: "<RecordRepresentation>"
43
storybook_path: ra-core-controller-record-recordrepresentation--no-record-representation
54
---
65

7-
# `<RecordRepresentation>`
8-
9-
Render the current record as text, leveraging the [`<Resource recordRepresentation>`](./Resource.md#recordrepresentation) prop.
6+
Render the current record as text, leveraging the [`<Resource recordRepresentation>`](../app-configuration/Resource.md#recordrepresentation) prop.
107

118
You can also use its hook version: [`useGetRecordRepresentation`](./useGetRecordRepresentation.md).
129

1310
## Usage
1411

15-
`<RecordRepresentation>` doesn't require any argument. It reads the current record from the parent [`RecordContext`](./useRecordContext.md) and the current resource from the parent `ResourceContext`.
12+
`<RecordRepresentation>` doesn't require any argument. It reads the current record from the parent [`RecordContext`](../common/useRecordContext.md) and the current resource from the parent `ResourceContext`.
1613

1714
The component uses the [`useGetRecordRepresentation`](./useGetRecordRepresentation.md) hook and the same [rules](./useGetRecordRepresentation.md#default-representation) are therefore applied.
1815

19-
{% raw %}
2016
```tsx
2117
// in src/posts/PostBreadcrumbs.tsx
2218
import * as React from 'react';
23-
import { Breadcrumbs, Typography } from '@mui/material';
24-
import { Link, RecordRepresentation } from 'react-admin';
19+
import { Link } from 'react-router-dom';
20+
import { RecordRepresentation } from 'ra-core';
2521

2622
export const PostBreadcrumbs = () => {
2723
return (
28-
<div role="presentation">
29-
<Breadcrumbs aria-label="breadcrumb">
30-
<Link underline="hover" color="inherit" to="/">
31-
Home
32-
</Link>
33-
<Link underline="hover" color="inherit" to="/posts">
34-
Posts
35-
</Link>
36-
<Typography sx={{ color: "text.primary" }}>
24+
<nav aria-label="breadcrumb">
25+
<ol className="breadcrumb">
26+
<li className="breadcrumb-item">
27+
<Link to="/">Home</Link>
28+
</li>
29+
<li className="breadcrumb-item">
30+
<Link to="/posts">Posts</Link>
31+
</li>
32+
<li className="breadcrumb-item active" aria-current="page">
3733
<RecordRepresentation />
38-
</Typography>
39-
</Breadcrumbs>
40-
</div>
34+
</li>
35+
</ol>
36+
</nav>
4137
);
4238
}
4339

4440
// in src/posts/PostEdit.tsx
45-
import { EditBase, EditView, SimpleForm, TextInput } from 'react-admin';
41+
import { EditBase, Form } from 'ra-core';
42+
import { TextInput } from './TextInput';
4643
import { PostBreadcrumbs } from './PostBreadcrumbs';
4744

4845
const PostEdit = () => (
4946
<EditBase>
5047
<PostBreadcrumbs />
51-
<EditView>
52-
<SimpleForm>
48+
<div>
49+
<Form>
5350
<TextInput source="title" />
54-
</SimpleForm>
55-
</EditView>
51+
</Form>
52+
</div>
5653
</EditBase>
5754
)
5855
```
59-
{% endraw %}
6056

6157
## Props
6258

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
layout: default
3-
title: "The useCheckForApplicationUpdate Hook"
3+
title: "useCheckForApplicationUpdate"
44
---
55

66
TODO

docs_headless/src/content/docs/other/useGetRecordRepresentation.md

Lines changed: 23 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,63 +1,59 @@
11
---
2-
layout: default
3-
title: "The useGetRecordRepresentation Hook"
2+
title: "useGetRecordRepresentation"
43
---
54

6-
# `useGetRecordRepresentation`
7-
8-
Get a function that returns the record representation, leveraging the [`<Record recordRepresentation>`](./Resource.md#recordrepresentation) prop.
5+
Get a function that returns the record representation, leveraging the [`<Record recordRepresentation>`](../app-configuration/Resource.md#recordrepresentation) prop.
96

107
You can also use the component version: [`<RecordRepresentation>`](./RecordRepresentation.md).
118

129
## Usage
1310

14-
{% raw %}
1511
```tsx
1612
// in src/posts/PostBreadcrumbs.tsx
1713
import * as React from 'react';
18-
import { Breadcrumbs, Typography } from '@mui/material';
19-
import { Link, useGetRecordRepresentation, useRecordContext } from 'react-admin';
14+
import { Link } from 'react-router-dom';
15+
import { useGetRecordRepresentation, useRecordContext } from 'ra-core';
2016

2117
export const PostBreadcrumbs = () => {
2218
const record = useRecordContext();
2319
const getRecordRepresentation = useGetRecordRepresentation('posts');
2420
return (
25-
<div role="presentation">
26-
<Breadcrumbs aria-label="breadcrumb">
27-
<Link underline="hover" color="inherit" to="/">
28-
Home
29-
</Link>
30-
<Link underline="hover" color="inherit" to="/posts">
31-
Posts
32-
</Link>
33-
<Typography sx={{ color: "text.primary" }}>
21+
<nav aria-label="breadcrumb">
22+
<ol className="breadcrumb">
23+
<li className="breadcrumb-item">
24+
<Link to="/">Home</Link>
25+
</li>
26+
<li className="breadcrumb-item">
27+
<Link to="/posts">Posts</Link>
28+
</li>
29+
<li className="breadcrumb-item active" aria-current="page">
3430
{getRecordRepresentation(record)}
35-
</Typography>
36-
</Breadcrumbs>
37-
</div>
31+
</li>
32+
</ol>
33+
</nav>
3834
);
3935
}
4036

4137
// in src/posts/PostEdit.tsx
42-
import { EditBase, EditView, SimpleForm, TextInput } from 'react-admin';
38+
import { EditBase, Form } from 'ra-core';
39+
import { TextInput } from './TextInput';
4340
import { PostBreadcrumbs } from './PostBreadcrumbs';
4441

4542
const PostEdit = () => (
4643
<EditBase>
4744
<PostBreadcrumbs />
48-
<EditView>
49-
<SimpleForm>
45+
<div>
46+
<Form>
5047
<TextInput source="title" />
51-
</SimpleForm>
52-
</EditView>
48+
</Form>
49+
</div>
5350
</EditBase>
5451
)
5552
```
56-
{% endraw %}
5753

5854
## Default Representation
5955

60-
When [`<Resource recordRepresentation>`](./Resource.md#recordrepresentation) is not defined, `useGetRecordRepresentation` will return the first non-empty field from this list:
56+
When [`<Resource recordRepresentation>`](../app-configuration/Resource.md#recordrepresentation) is not defined, `useGetRecordRepresentation` will return the first non-empty field from this list:
6157
1. `name`
6258
2. `title`
6359
3. `label`

0 commit comments

Comments
 (0)