From 683bd826dfc3885a8f15f9db4e0a8af7f158c967 Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Sat, 16 Jun 2018 18:37:01 +0300 Subject: loadReplies --- vnext/src/components/Discover.js | 12 ++---------- vnext/src/components/Spinner.js | 15 +++++++++++++++ vnext/src/components/Thread.js | 28 ++++++++++++++++++++++------ 3 files changed, 39 insertions(+), 16 deletions(-) create mode 100644 vnext/src/components/Spinner.js diff --git a/vnext/src/components/Discover.js b/vnext/src/components/Discover.js index daf2902f..fc1ab707 100644 --- a/vnext/src/components/Discover.js +++ b/vnext/src/components/Discover.js @@ -3,7 +3,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import Message from './Message'; -import Icon from './Icon'; +import Spinner from './Spinner'; export default class Discover extends React.Component { constructor(props) { @@ -43,18 +43,10 @@ export default class Discover extends React.Component { }); return this.state.msgs.length > 0 ? (
{nodes}
- ) : ( -
- ); + ) : ; } } -const centeredStyle = { - display: 'flex', - justifyContent: 'center', - alignItems: 'center' -} - Discover.propTypes = { msgs: PropTypes.array }; diff --git a/vnext/src/components/Spinner.js b/vnext/src/components/Spinner.js new file mode 100644 index 00000000..10a247f9 --- /dev/null +++ b/vnext/src/components/Spinner.js @@ -0,0 +1,15 @@ +import React from 'react'; + +import Icon from './Icon'; + +export default function Spinner(props) { + return ( +
+ ) +} + +const centeredStyle = { + display: 'flex', + justifyContent: 'center', + alignItems: 'center' +} \ No newline at end of file diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js index a17a2022..5393d7d3 100644 --- a/vnext/src/components/Thread.js +++ b/vnext/src/components/Thread.js @@ -1,6 +1,9 @@ import 'whatwg-fetch'; import React from 'react'; +import Message from './Message'; +import Spinner from './Spinner'; + export default class Thread extends React.Component { constructor(props) { super(props); @@ -10,14 +13,27 @@ export default class Thread extends React.Component { }; } componentDidMount() { + this.loadReplies(); + } + loadReplies() { + this.setState({ replies: []}) + const { mid } = this.props.match.params; + const url = `https://api.juick.com/thread?mid=${mid}`; + fetch(url) + .then(response => { + return response.json() + }) + .then(data => + this.setState({ replies: data }) + ).catch(ex => { + console.log(ex); + }); } render() { - const { user, mid } = this.props.match.params; - return ( -
-

{user}

-

{mid}

-
+ return this.state.replies && this.state.replies.length > 0 ? ( + + ) : ( + ); } } -- cgit v1.2.3