crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactored unnecessary Hero props

Browse Source
This commit is contained in:
Piotr Janosz
2019-07-10 13:38:58 +02:00
committed by fabioberger
parent 338de4ffa1
commit 829eeb2374
5 changed files with 44 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
packages/website/ts/pages/docs/guides.tsx
View File

@@ -13,41 +13,20 @@ export const DocsGuides: React.FC = () => {
return (
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={false} title="Guides" />
<Hero title="Guides" />
<Section maxWidth={'1030px'} isPadded={false} padding="0 0">
<Columns>
<Filters groups={filterGroups} />
<article>
<Resource
heading="0x Mesh - your gateway to networked liquidity"
description="The Radar Relay SDK is a software development kit that simplifies the interactions with Radar Relay’s APIs"
tags={[{ label: 'Relayer' }]}
url="/docs/guides/usage"
/>
<Resource
heading="0x Mesh - your gateway to networked liquidity"
description="Learn about the 0x peer-to-peer network for sharing orders and how you can use it to tap into networked liquidity."
tags={[{ label: 'Relayer' }]}
url="/docs/guides/usage"
/>
<Resource
heading="0x Mesh - your gateway to networked liquidity"
description="Learn about the 0x peer-to-peer network for sharing orders and how you can use it to tap into networked liquidity."
tags={[{ label: 'Relayer' }]}
url="/docs/guides/usage"
/>
<Resource
heading="0x Mesh - your gateway to networked liquidity"
description="Learn about the 0x peer-to-peer network for sharing orders and how you can use it to tap into networked liquidity."
tags={[{ label: 'Relayer' }]}
url="/docs/guides/usage"
/>
<Resource
heading="0x Mesh - your gateway to networked liquidity"
description="The Radar Relay SDK is a software development kit that simplifies the interactions with Radar Relay’s APIs"
tags={[{ label: 'Community Maintained', isInverted: true }, { label: 'Relayer' }]}
url="/docs/guides/usage"
/>
{resources.map((resource, index) => (
<Resource
key={`resource-${index}`}
heading={resource.heading}
description={resource.description}
tags={resource.tags}
url={resource.url}
/>
))}
</article>
</Columns>
</Section>
@@ -104,3 +83,20 @@ const filterGroups: FilterGroup[] = [
],
},
];
const resources = [
{
heading: '0x Mesh - your gateway to networked liquidity',
description:
'Learn about the 0x peer-to-peer network for sharing orders and how you can use it to tap into networked liquidity.',
tags: [{ label: 'Relayer' }],
url: 'https://0x.org',
},
{
heading: '0x Mesh - your gateway to networked liquidity',
description:
'The Radar Relay SDK is a software development kit that simplifies the interactions with Radar Relay’s APIs',
tags: [{ label: 'Community Maintained', isInverted: true }, { label: 'Relayer' }],
url: 'https://0x.org',
},
];

2
packages/website/ts/pages/docs/home.tsx
View File

@@ -20,7 +20,7 @@ export const DocsHome: React.FC = () => {
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={true} title="0x Docs" />
<Section maxWidth="1150px" isPadded={false} padding="0">
<Section maxWidth="1150px" isPadded={false}>
<ShortcutsWrapper>
{shortcuts.map((shortcut, index) => (
<ShortcutLink key={`shortcut-${index}`} {...shortcut} />

4
packages/website/ts/pages/docs/page_template.tsx
View File

@@ -29,8 +29,8 @@ export const DocsPageTemplate: React.FC = () => {
return (
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={false} title={`Page Template`} description="This a subheader for the page" />
<Section maxWidth="1030px" isPadded={false} padding="0">
<Hero title={`Page Template`} description="This a subheader for the page" />
<Section maxWidth="1030px" isPadded={false}>
<Columns>
<aside>
<Filters groups={filterGroups} />

2
packages/website/ts/pages/docs/tools.tsx
View File

@@ -16,7 +16,7 @@ export const DocsTools: React.FC = () => {
return (
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={false} title="Tools" />
<Hero title="Tools" />
<Section maxWidth="1030px" isPadded={false}>
<Columns>
<Filters groups={filterGroups} />

27
packages/website/ts/pages/docs/view.tsx
View File

@@ -3,7 +3,7 @@ import { match } from 'react-router-dom';
import styled from 'styled-components';
import { utils } from '@0x/react-shared';
import _ from 'lodash';
import capitalize from 'lodash/capitalize';
import { MDXProvider } from '@mdx-js/react';
@@ -41,19 +41,18 @@ interface IDocsViewProps {
}
interface IDocsViewState {
title: string;
Component: React.ReactNode;
}
export const DocsView: React.FC<IDocsViewProps> = props => {
const { page } = props.match.params;
const [state, setState] = useState<IDocsViewState>({
title: _.capitalize(utils.convertDashesToSpaces(page)),
Component: null,
});
const { title, Component } = state;
const { Component } = state;
const { page } = props.match.params;
const title = capitalize(utils.convertDashesToSpaces(page));
useEffect(() => {
void loadPageAsync(page);
@@ -61,20 +60,20 @@ export const DocsView: React.FC<IDocsViewProps> = props => {
const loadPageAsync = async (fileName: string) => {
const component = await import(`../../../md/new-docs/${fileName}.mdx`);
// if (component) {
// setState({
// title: component.meta.title,
// Component: component.default,
// });
// }
if (component) {
setState({
// title: component.meta.title,
Component: component.default,
});
}
// @TODO: add error handling, loading
};
return (
<SiteWrap theme="light">
<DocumentTitle {...documentConstants.DOCS} />
<Hero isHome={false} title={title} />
<Section maxWidth="1030px" isPadded={false} padding="0 0">
<Hero title={title} />
<Section maxWidth="1030px" isPadded={false}>
{Component ? (
<Columns>
<aside>