1
1
mirror of https://github.com/aelve/guide.git synced 2024-12-23 04:42:24 +03:00
This commit is contained in:
Artyom 2017-05-02 01:29:10 +03:00
parent 3221c94566
commit 2275c1eed2
No known key found for this signature in database
GPG Key ID: B8E35A33FF522710
3 changed files with 42 additions and 12 deletions

7
front/.flowconfig Normal file
View File

@ -0,0 +1,7 @@
[ignore]
[include]
[libs]
[options]

View File

@ -33,6 +33,7 @@
"eslint-plugin-react": "6.4.1", "eslint-plugin-react": "6.4.1",
"extract-text-webpack-plugin": "1.0.1", "extract-text-webpack-plugin": "1.0.1",
"file-loader": "0.10.0", "file-loader": "0.10.0",
"flow-bin": "^0.45.0",
"fs-extra": "0.30.0", "fs-extra": "0.30.0",
"html-webpack-plugin": "2.24.0", "html-webpack-plugin": "2.24.0",
"http-proxy-middleware": "0.17.3", "http-proxy-middleware": "0.17.3",
@ -52,7 +53,8 @@
"scripts": { "scripts": {
"start": "node scripts/start.js", "start": "node scripts/start.js",
"build": "node scripts/build.js", "build": "node scripts/build.js",
"test": "node scripts/test.js --env=jsdom" "test": "node scripts/test.js --env=jsdom",
"flow": "flow"
}, },
"jest": { "jest": {
"collectCoverageFrom": [ "collectCoverageFrom": [

View File

@ -1,3 +1,5 @@
// @flow
import React, { Component } from 'react'; import React, { Component } from 'react';
import renderIf from 'render-if'; import renderIf from 'render-if';
import R from 'ramda'; import R from 'ramda';
@ -6,9 +8,7 @@ function checkStatus(response) {
if (response.status >= 200 && response.status < 300) { if (response.status >= 200 && response.status < 300) {
return response; return response;
} else { } else {
var error = new Error(response.statusText); throw new Error(response.statusText);
error.response = response;
throw error;
} }
} }
@ -16,7 +16,23 @@ function parseJSON(response) {
return response.json(); return response.json();
} }
type Category = {
uid : string,
link : string,
title : string
};
type GrandCategoryT = {
title : string,
finished : Array<Category>,
wip : Array<Category>,
stubs : Array<Category>
}
class GrandCategory extends Component { class GrandCategory extends Component {
props: {
val: GrandCategoryT
};
render() { render() {
const renderBigCatLink = cat => { const renderBigCatLink = cat => {
return( return(
@ -44,27 +60,29 @@ class GrandCategory extends Component {
); );
}; };
const grand = this.props.val;
return( return(
<div className="GrandCategory" key={this.props.title}> <div className="GrandCategory" key={grand.title}>
<h1>{this.props.title}</h1> <h1>{grand.title}</h1>
<div className="finished"> <div className="finished">
{this.props.finished.map(renderBigCatLink)} {grand.finished.map(renderBigCatLink)}
</div> </div>
{renderIf(!R.isEmpty(this.props.wip))( {renderIf(!R.isEmpty(grand.wip))(
<div className="wip"> <div className="wip">
<h2>In progress</h2> <h2>In progress</h2>
<p>{R.intersperse(", ")( <p>{R.intersperse(", ")(
this.props.wip.map(renderSmallCatLink))}</p> grand.wip.map(renderSmallCatLink))}</p>
</div> </div>
)} )}
{renderIf(!R.isEmpty(this.props.stubs))( {renderIf(!R.isEmpty(grand.stubs))(
<div className="stubs"> <div className="stubs">
<h2>To be written</h2> <h2>To be written</h2>
<p>{R.intersperse(", ")( <p>{R.intersperse(", ")(
this.props.stubs.map(renderSmallCatLink))}</p> grand.stubs.map(renderSmallCatLink))}</p>
</div> </div>
)} )}
@ -97,6 +115,9 @@ class GrandCategory extends Component {
} }
class App extends Component { class App extends Component {
state: {
categories: Array<GrandCategoryT>;
};
componentWillMount() { componentWillMount() {
this.setState({ categories: [] }); this.setState({ categories: [] });
} }
@ -114,7 +135,7 @@ class App extends Component {
<div className="App"> <div className="App">
<Tiles space="1em"> <Tiles space="1em">
{this.state.categories.map(grand => { {this.state.categories.map(grand => {
return <GrandCategory {...grand} />; return <GrandCategory val={grand} />;
}) })
} }
</Tiles> </Tiles>