From f834e2e42ee026a561335317c8a89aebb6a784c5 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Fri, 8 Feb 2019 14:22:40 +0100 Subject: [PATCH] files reorganization --- src/Routes.tsx | 14 ++++---- .../templates/Route.module.scss} | 2 +- .../templates/Route.tsx} | 18 +++++----- src/data/menu.json | 4 +++ src/pages/Home.module.scss | 32 ------------------ src/{pages => routes}/About.tsx | 4 +-- src/{pages => routes}/Details.tsx | 6 ++-- src/routes/Home.module.scss | 18 ++++++++++ src/{pages => routes}/Home.tsx | 33 ++++++++----------- src/{pages => routes}/NotFound.tsx | 4 +-- src/{pages => routes}/Publish.tsx | 6 ++-- src/{pages => routes}/Search.tsx | 6 ++-- src/{pages => routes}/Styleguide.tsx | 6 ++-- 13 files changed, 69 insertions(+), 84 deletions(-) rename src/{templates/Page.module.scss => components/templates/Route.module.scss} (69%) rename src/{templates/Page.tsx => components/templates/Route.tsx} (65%) delete mode 100644 src/pages/Home.module.scss rename src/{pages => routes}/About.tsx (54%) rename src/{pages => routes}/Details.tsx (95%) create mode 100644 src/routes/Home.module.scss rename src/{pages => routes}/Home.tsx (51%) rename src/{pages => routes}/NotFound.tsx (53%) rename src/{pages => routes}/Publish.tsx (97%) rename src/{pages => routes}/Search.tsx (92%) rename src/{pages => routes}/Styleguide.tsx (91%) diff --git a/src/Routes.tsx b/src/Routes.tsx index 55a1401..b7d6699 100644 --- a/src/Routes.tsx +++ b/src/Routes.tsx @@ -1,13 +1,13 @@ import React from 'react' import { Route, Switch } from 'react-router-dom' -import About from './pages/About' -import Details from './pages/Details' -import Home from './pages/Home' -import NotFound from './pages/NotFound' -import Publish from './pages/Publish' -import Search from './pages/Search' -import Styleguide from './pages/Styleguide' +import About from './routes/About' +import Details from './routes/Details' +import Home from './routes/Home' +import NotFound from './routes/NotFound' +import Publish from './routes/Publish' +import Search from './routes/Search' +import Styleguide from './routes/Styleguide' const Routes = () => ( diff --git a/src/templates/Page.module.scss b/src/components/templates/Route.module.scss similarity index 69% rename from src/templates/Page.module.scss rename to src/components/templates/Route.module.scss index 6136c48..95d74ef 100644 --- a/src/templates/Page.module.scss +++ b/src/components/templates/Route.module.scss @@ -1,4 +1,4 @@ -@import '../styles/variables'; +@import '../../styles/variables'; .header { margin-bottom: $spacer; diff --git a/src/templates/Page.tsx b/src/components/templates/Route.tsx similarity index 65% rename from src/templates/Page.tsx rename to src/components/templates/Route.tsx index 6feb4e3..087c7da 100644 --- a/src/templates/Page.tsx +++ b/src/components/templates/Route.tsx @@ -1,19 +1,21 @@ import React from 'react' import Helmet from 'react-helmet' -import Content from '../components/Content' -import styles from './Page.module.scss' -import meta from '../data/meta.json' +import Content from '../Content' +import styles from './Route.module.scss' +import meta from '../../data/meta.json' -const Page = ({ +const Route = ({ title, wide, - children + children, + className }: { title: string children: any wide?: boolean + className?: string }) => ( - <> +
{title} @@ -25,7 +27,7 @@ const Page = ({ {children} - +
) -export default Page +export default Route diff --git a/src/data/menu.json b/src/data/menu.json index 8100a67..7cc7ee8 100644 --- a/src/data/menu.json +++ b/src/data/menu.json @@ -10,5 +10,9 @@ { "title": "About", "link": "/about" + }, + { + "title": "Styleguide", + "link": "/styleguide" } ] diff --git a/src/pages/Home.module.scss b/src/pages/Home.module.scss deleted file mode 100644 index 5f1bb57..0000000 --- a/src/pages/Home.module.scss +++ /dev/null @@ -1,32 +0,0 @@ -@import '../styles/variables'; - -.home { - background: $brand-black; - color: $brand-white; - min-height: calc(100vh - #{$page-frame} * 2); - display: flex; - align-items: center; - justify-content: center; - flex-wrap: wrap; - padding-top: 4rem; - padding-bottom: 4rem; - - > div { - text-align: center; - width: 100%; - } -} - -.form { - width: 100%; - background: $brand-grey-lighter; - margin: 0 auto; - max-width: 40rem; - padding: $spacer; - margin-top: 4rem; - - fieldset { - border: 0; - padding: 0; - } -} diff --git a/src/pages/About.tsx b/src/routes/About.tsx similarity index 54% rename from src/pages/About.tsx rename to src/routes/About.tsx index 1f61c2c..8242af2 100644 --- a/src/pages/About.tsx +++ b/src/routes/About.tsx @@ -1,9 +1,9 @@ import React, { Component } from 'react' -import Page from '../templates/Page' +import Route from '../components/templates/Route' class About extends Component { public render() { - return Hello About + return Hello About } } diff --git a/src/pages/Details.tsx b/src/routes/Details.tsx similarity index 95% rename from src/pages/Details.tsx rename to src/routes/Details.tsx index ff2a67c..f8d9baf 100644 --- a/src/pages/Details.tsx +++ b/src/routes/Details.tsx @@ -1,6 +1,6 @@ import { Logger } from '@oceanprotocol/squid' import React, { Component } from 'react' -import Page from '../templates/Page' +import Route from '../components/templates/Route' import Button from '../components/atoms/Button' import { User } from '../context/User' @@ -65,13 +65,13 @@ export default class Details extends Component { public render() { return ( - + {this.state.metadata ? ( this.showDetails(this.state.ddo) ) : (
Loading
)} - + ) } } diff --git a/src/routes/Home.module.scss b/src/routes/Home.module.scss new file mode 100644 index 0000000..4262b15 --- /dev/null +++ b/src/routes/Home.module.scss @@ -0,0 +1,18 @@ +@import '../styles/variables'; + +.home { + // background: $brand-black; + // color: $brand-white; + // min-height: calc(100vh - #{$page-frame} * 2); + // display: flex; + // align-items: center; + // justify-content: center; + // flex-wrap: wrap; + // padding-top: 4rem; + // padding-bottom: 4rem; + + // > div { + // text-align: center; + // width: 100%; + // } +} diff --git a/src/pages/Home.tsx b/src/routes/Home.tsx similarity index 51% rename from src/pages/Home.tsx rename to src/routes/Home.tsx index ae94d7e..a99d73e 100644 --- a/src/pages/Home.tsx +++ b/src/routes/Home.tsx @@ -1,9 +1,8 @@ import React, { ChangeEvent, Component, FormEvent } from 'react' -import { Link } from 'react-router-dom' import Button from '../components/atoms/Button' import Form from '../components/atoms/Form/Form' import Input from '../components/atoms/Form/Input' -import Content from '../components/Content' +import Route from '../components/templates/Route' import styles from './Home.module.scss' interface HomeState { @@ -19,24 +18,18 @@ class Home extends Component { public render() { return ( -
- - Styleguide - -
-
- - -
-
- -
+ +
+ + +
+ ) } diff --git a/src/pages/NotFound.tsx b/src/routes/NotFound.tsx similarity index 53% rename from src/pages/NotFound.tsx rename to src/routes/NotFound.tsx index 39d6da9..684af7b 100644 --- a/src/pages/NotFound.tsx +++ b/src/routes/NotFound.tsx @@ -1,9 +1,9 @@ import React, { Component } from 'react' -import Page from '../templates/Page' +import Route from '../components/templates/Route' class NotFound extends Component { public render() { - return Not Found + return Not Found } } diff --git a/src/pages/Publish.tsx b/src/routes/Publish.tsx similarity index 97% rename from src/pages/Publish.tsx rename to src/routes/Publish.tsx index 2547473..82222d0 100644 --- a/src/pages/Publish.tsx +++ b/src/routes/Publish.tsx @@ -1,5 +1,5 @@ import React, { ChangeEvent, Component, FormEvent } from 'react' -import Page from '../templates/Page' +import Route from '../components/templates/Route' import Button from '../components/atoms/Button' import Form from '../components/atoms/Form/Form' import Input from '../components/atoms/Form/Input' @@ -116,7 +116,7 @@ class Publish extends Component<{}, PublishState> { const entries = Object.entries(form.fields) return ( - +
{ }
- + ) } } diff --git a/src/pages/Search.tsx b/src/routes/Search.tsx similarity index 92% rename from src/pages/Search.tsx rename to src/routes/Search.tsx index 7f465d8..4b45138 100644 --- a/src/pages/Search.tsx +++ b/src/routes/Search.tsx @@ -1,7 +1,7 @@ import queryString from 'query-string' import React, { Component } from 'react' import { Link } from 'react-router-dom' -import Page from '../templates/Page' +import Route from '../components/templates/Route' import { provideOcean } from '../ocean' interface SearchState { @@ -46,13 +46,13 @@ export default class Search extends Component { public render() { return ( - + {this.state.results.length ? ( this.state.results.map(asset => this.renderAssetBox(asset)) ) : (
No data sets yet
)} - + ) } } diff --git a/src/pages/Styleguide.tsx b/src/routes/Styleguide.tsx similarity index 91% rename from src/pages/Styleguide.tsx rename to src/routes/Styleguide.tsx index 8520426..d98222d 100644 --- a/src/pages/Styleguide.tsx +++ b/src/routes/Styleguide.tsx @@ -2,7 +2,7 @@ import React, { Component } from 'react' import Button from '../components/atoms/Button' import Form from '../components/atoms/Form/Form' import Input from '../components/atoms/Form/Input' -import Page from '../templates/Page' +import Route from '../components/templates/Route' import form from '../data/form-styleguide.json' @@ -24,7 +24,7 @@ class Styleguide extends Component { public render() { const entries = Object.entries(form.fields) return ( - +