diff --git a/front/src/App.js b/front/src/App.js index dcc11a7..d178349 100644 --- a/front/src/App.js +++ b/front/src/App.js @@ -1,7 +1,7 @@ // @flow import React, { Component } from 'react'; -import { CategoryChild, Home, NoMatch } from './components/index'; +import { Category, Home, NoMatch } from './components/index'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; class App extends Component { @@ -11,7 +11,7 @@ class App extends Component { - + diff --git a/front/src/components/Category.js b/front/src/components/Category.js index 043ce46..61bd892 100644 --- a/front/src/components/Category.js +++ b/front/src/components/Category.js @@ -1,7 +1,47 @@ // @flow import React, { Component } from 'react'; +import * as T from '../types'; +import { fetchData } from '../utils/index'; +import { If } from 'jsx-control-statements'; + +function extractUid(link : string) { + const lastOccur = link.lastIndexOf('-'); + return link.slice(lastOccur + 1); +} class Category extends Component { - + state: { + cat: T.Cat; + }; + componentWillMount() { + this.setState({ cat: [] }); + } + componentDidMount() { + const uid = extractUid(this.props.match.params.uid); + + fetchData('http://localhost:8080/haskell/api/category/'+uid) + .then(data => this.setState({cat: data})) + } + render() { + + const item = (uid, name) => { + return (
  • {name}
  • ) + } + + return ( +
    +

    { this.state.cat.title }

    + +
    + + + { this.state.cat.items.map(i => item(i.uid, i.name)) } + +
    + ) + } } + +module.exports = { Category } diff --git a/front/src/components/CategoryChild.js b/front/src/components/CategoryChild.js deleted file mode 100644 index 731f122..0000000 --- a/front/src/components/CategoryChild.js +++ /dev/null @@ -1,47 +0,0 @@ -// @flow - -import React, { Component } from 'react'; -import * as T from '../types'; -import { fetchData } from '../utils/index'; -import { If } from 'jsx-control-statements'; - -function extractUid(link : string) { - const lastOccur = link.lastIndexOf('-'); - return link.slice(lastOccur + 1); -} - -class CategoryChild extends Component { - state: { - cat: T.Cat; - }; - componentWillMount() { - this.setState({ cat: [] }); - } - componentDidMount() { - const uid = extractUid(this.props.match.params.uid); - - fetchData('http://localhost:8080/haskell/api/category/'+uid) - .then(data => this.setState({cat: data})) - } - render() { - - const item = (uid, name) => { - return (
  • {name}
  • ) - } - - return ( -
    -

    { this.state.cat.title }

    - -
    - - - { this.state.cat.items.map(i => item(i.uid, i.name)) } - -
    - ) - } -} - -module.exports = { CategoryChild } diff --git a/front/src/components/index.js b/front/src/components/index.js index 4d8a946..90244b6 100644 --- a/front/src/components/index.js +++ b/front/src/components/index.js @@ -1,13 +1,13 @@ import { GrandCategory } from './GrandCategory'; import { Tiles } from './Tiles'; -import { CategoryChild } from './CategoryChild'; +import { Category } from './Category'; import { Home } from './Home'; import { NoMatch } from './NoMatch'; module.exports = { GrandCategory, Tiles, - CategoryChild, + Category, Home, NoMatch }