paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 46 Packages Projects Releases Wiki Activity

Fix plugin template too

Browse Source
This commit is contained in:
Fredrik Adelöw
2020-03-07 21:40:53 +01:00
parent 62ccc37637
commit 20f70c2faa
1 changed files with 31 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/cli/templates/default-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs
+31 -47
View File
@@ -1,53 +1,37 @@
import React, { FC } from 'react';
import { Typography, Grid, makeStyles, Theme } from '@material-ui/core';
import { InfoCard, Header, Page, pageTheme } from '@spotify-backstage/core';
import { Typography, Grid } from '@material-ui/core';
import {
InfoCard,
Header,
Page,
pageTheme,
Content,
} from '@spotify-backstage/core';
import ExampleFetchComponent from '../ExampleFetchComponent';
const useStyles = makeStyles<Theme>(theme => ({
mainContentArea: {
overflowX: 'hidden',
overflowY: 'auto',
},
pageBody: {
padding: theme.spacing(3),
},
title: {
padding: theme.spacing(1, 0, 2, 0),
},
}));
const ExampleComponent: FC<{}> = () => {
const classes = useStyles();
return (
<Page theme={pageTheme.tool}>
<div className={classes.mainContentArea}>
<Header title="Welcome to {{ id }}!" subtitle="Optional subtitle" />
<Grid
container
spacing={3}
direction="column"
className={classes.pageBody}
>
<Grid item>
<Typography variant="h3">Plugin page title</Typography>
</Grid>
<Grid item>
<InfoCard title="Information card" maxWidth>
<Typography variant="body1">
All content should be wrapped in a card like this.
</Typography>
</InfoCard>
</Grid>
<Grid item>
<InfoCard title="Example User List (fetching data from randomuser.me)">
<ExampleFetchComponent />
</InfoCard>
</Grid>
const ExampleComponent: FC<{}> = () => (
<Page theme={pageTheme.tool}>
<Header title="Welcome to {{ id }}!" subtitle="Optional subtitle" />
<Content>
<Grid container spacing={3} direction="column">
<Grid item>
<Typography variant="h3">Plugin page title</Typography>
</Grid>
</div>
</Page>
);
};
<Grid item>
<InfoCard title="Information card" maxWidth>
<Typography variant="body1">
All content should be wrapped in a card like this.
</Typography>
</InfoCard>
</Grid>
<Grid item>
<InfoCard title="Example User List (fetching data from randomuser.me)">
<ExampleFetchComponent />
</InfoCard>
</Grid>
</Grid>
</Content>
</Page>
);
export default ExampleComponent;