Skip to content

Commit 999f11b

Browse files
committed
Use common layout component for each doc page
1 parent cd71dce commit 999f11b

29 files changed

+120
-366
lines changed
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
3+
import { useRouter } from 'next/router';
4+
5+
import Grid from '@material-ui/core/Grid';
6+
import ListOfContents from '../helpers/list-of-contents';
7+
import ListOfContentsMobile from '../helpers/list-of-contents-select';
8+
9+
const DocPage = ({ children }) => {
10+
const router = useRouter();
11+
12+
return (
13+
<Grid container item>
14+
<ListOfContentsMobile file={router.pathname.replace('/', '')} />
15+
<Grid item xs={12} md={10}>
16+
{children}
17+
</Grid>
18+
<Grid item xs={false} md={2}>
19+
<ListOfContents file={router.pathname.replace('/', '')} />
20+
</Grid>
21+
</Grid>
22+
);
23+
};
24+
25+
DocPage.propTypes = {
26+
children: PropTypes.node
27+
};
28+
29+
export default DocPage;

packages/react-renderer-demo/src/helpers/list-of-contents.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,9 @@ const useStyles = makeStyles((theme) => ({
8080
contentHeader: {
8181
paddingLeft: 16,
8282
paddingRight: 16
83+
},
84+
hidden: {
85+
height: '100%'
8386
}
8487
}));
8588

@@ -114,7 +117,7 @@ const ListOfContents = ({ file }) => {
114117
const regex = /^#+ .*/gm;
115118
const found = text.match(regex) || [];
116119
return (
117-
<Hidden implementation="css" smDown>
120+
<Hidden implementation="css" smDown className={classes.hidden}>
118121
<StickyBox offsetTop={96} offsetBottom={20}>
119122
<div className={classes.fixedContainer}>
120123
<Typography className={classes.contentHeader} component="h3">

packages/react-renderer-demo/src/next.config.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,8 @@ module.exports = withBundleAnalyzer(
6464
'@docs/list-of-contents': path.resolve(__dirname, './helpers/list-of-contents'),
6565
'@docs/code-example': path.resolve(__dirname, './components/code-example'),
6666
'@docs/hooks': path.resolve(__dirname, './hooks'),
67-
'@docs/list-of-contents-select': path.resolve(__dirname, './helpers/list-of-contents-select')
67+
'@docs/list-of-contents-select': path.resolve(__dirname, './helpers/list-of-contents-select'),
68+
'@docs/doc-page': path.resolve(__dirname, './components/doc-page')
6869
};
6970

7071
config.optimization.minimizer = [

packages/react-renderer-demo/src/pages/mappers/blueprint-component-mapper.md

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
3-
import ListOfContentsMobile from '@docs/list-of-contents-select';
1+
import DocPage from '@docs/doc-page';
42

5-
<Grid container item>
6-
7-
<ListOfContentsMobile file="mappers/blueprint-component-mapper" />
8-
<Grid item xs={12} md={10}>
3+
<DocPage>
94

105
# BlueprintJS
116

@@ -88,8 +83,4 @@ const FormTemplate = ({ formFields }) => {
8883

8984
You can contribute to this mapper [here](https://github.com/data-driven-forms/react-forms/tree/master/packages/blueprint-component-mapper).
9085

91-
</Grid>
92-
<Grid item xs={false} md={2}>
93-
<ListOfContents file="mappers/blueprint-component-mapper" />
94-
</Grid>
95-
</Grid>
86+
</DocPage>

packages/react-renderer-demo/src/pages/mappers/mui-component-mapper.md

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
3-
import ListOfContentsMobile from '@docs/list-of-contents-select';
1+
import DocPage from '@docs/doc-page';
42

5-
<Grid container item>
6-
7-
<ListOfContentsMobile file="mappers/mui-component-mapper" />
8-
<Grid item xs={12} md={10}>
3+
<DocPage>
94

105
# MaterialUI mapper
116

@@ -44,8 +39,4 @@ This field will show the error immediately.
4439

4540
You can contribute to this mapper [here](https://github.com/data-driven-forms/react-forms/tree/master/packages/mui-component-mapper).
4641

47-
</Grid>
48-
<Grid item xs={false} md={2}>
49-
<ListOfContents file="mappers/mui-component-mapper" />
50-
</Grid>
51-
</Grid>
42+
</DocPage>

packages/react-renderer-demo/src/pages/mappers/pf3-component-mapper.md

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
3-
import ListOfContentsMobile from '@docs/list-of-contents-select';
1+
import DocPage from '@docs/doc-page';
42

5-
<Grid container item>
6-
7-
<ListOfContentsMobile file="mappers/pf3-component-mapper" />
8-
<Grid item xs={12} md={10}>
3+
<DocPage>
94

105
# PatternFly 3 mapper
116

@@ -44,8 +39,4 @@ This field will show the error immediately.
4439

4540
You can contribute to this mapper [here](https://github.com/data-driven-forms/react-forms/tree/master/packages/pf3-component-mapper).
4641

47-
</Grid>
48-
<Grid item xs={false} md={2}>
49-
<ListOfContents file="mappers/pf3-component-mapper" />
50-
</Grid>
51-
</Grid>
42+
</DocPage>

packages/react-renderer-demo/src/pages/mappers/pf4-component-mapper.md

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
3-
import ListOfContentsMobile from '@docs/list-of-contents-select';
1+
import DocPage from '@docs/doc-page';
42

5-
<Grid container item>
6-
7-
<ListOfContentsMobile file="mappers/pf4-component-mapper" />
8-
<Grid item xs={12} md={10}>
3+
<DocPage>
94

105
# PatternFly 4 mapper
116

@@ -29,8 +24,4 @@ PatternFly 4 has to be installed seperately. Please follow their [guidelines](ht
2924

3025
You can contribute to this mapper [here](https://github.com/data-driven-forms/react-forms/tree/master/packages/pf4-component-mapper).
3126

32-
</Grid>
33-
<Grid item xs={false} md={2}>
34-
<ListOfContents file="mappers/pf4-component-mapper" />
35-
</Grid>
36-
</Grid>
27+
</DocPage>

packages/react-renderer-demo/src/pages/mappers/suir-component-mapper.md

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
3-
import ListOfContentsMobile from '@docs/list-of-contents-select';
1+
import DocPage from '@docs/doc-page';
42

5-
<Grid container item>
6-
7-
<ListOfContentsMobile file="mappers/suir-component-mapper" />
8-
<Grid item xs={12} md={10}>
3+
<DocPage>
94

105
# Semantic UI react
116

@@ -49,8 +44,4 @@ To avoid re-refining common customization for each field in schema, check out th
4944

5045
You can contribute to this mapper [here](https://github.com/data-driven-forms/react-forms/tree/master/packages/suir-component-mapper).
5146

52-
</Grid>
53-
<Grid item xs={false} md={2}>
54-
<ListOfContents file="mappers/suir-component-mapper" />
55-
</Grid>
56-
</Grid>
47+
</DocPage>

packages/react-renderer-demo/src/pages/migration-guide.md

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,7 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import RouterLink from 'next/link';
3-
import Link from '@material-ui/core/Link';
1+
import DocPage from '@docs/doc-page';
2+
import CodeExample from '@docs/code-example';
43

5-
import ListOfContents from '@docs/list-of-contents';
6-
7-
import ListOfContentsMobile from '@docs/list-of-contents-select';
8-
9-
<Grid container item>
10-
11-
<ListOfContentsMobile file="migration-guide" />
12-
<Grid item xs={12} md={10}>
4+
<DocPage>
135

146
# Migration guide to version 2
157

@@ -166,8 +158,4 @@ import { componentMapper } from '@data-driven-forms/pf4-component-mapper'
166158
- word "validator" is removed from all validator strings, constants
167159
- i.e.: pattern-validator > pattern
168160
169-
</Grid>
170-
<Grid item xs={false} md={2}>
171-
<ListOfContents file="migration-guide" />
172-
</Grid>
173-
</Grid>
161+
</DocPage>

packages/react-renderer-demo/src/pages/renderer/action-mapper.md

Lines changed: 3 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,7 @@
1-
import Grid from '@material-ui/core/Grid'
2-
import ListOfContents from '@docs/list-of-contents';
31
import CodeExample from '@docs/code-example';
2+
import DocPage from '@docs/doc-page';
43

5-
6-
import ListOfContentsMobile from '@docs/list-of-contents-select';
7-
8-
<Grid container item>
9-
10-
<ListOfContentsMobile file="renderer/action-mapper" />
11-
12-
<Grid item xs={12} md={10}>
4+
<DocPage>
135

146
# Action Mapper
157

@@ -77,8 +69,4 @@ Then, in your schema you can map `translateLabel` action to a prop:
7769

7870
<CodeExample source="components/action-mapper" mode="preview" />
7971

80-
</Grid>
81-
<Grid item xs={false} md={2}>
82-
<ListOfContents file="renderer/action-mapper" />
83-
</Grid>
84-
</Grid>
72+
</DocPage>

0 commit comments

Comments
 (0)