add news to main page

package.json

@@ -1,6 +1,6 @@
 {
   "name": "StockStalk",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "author": "FOO BAR",
   "private": true,
   "description": "Your stocks on your desktop",

public/electron-starter.js

@@ -21,7 +21,7 @@ let mainWindow;
 function createWindow () {
   // Create the browser window.
   mainWindow = new BrowserWindow({
-    minWidth: 610,
+    minWidth: 650,
     height: 413,
     nodeIntegration: false,
     contextIsolation: true,

src/Main.js

@@ -2,15 +2,58 @@ import React, { Component } from 'react';
 import { observer, inject } from 'mobx-react';
 import Table from './Table';
 import Watchilist from './Watchilist';
+import RH from './helpers/rh/index';
+import { link } from './helpers/general';
 
 @inject('store') @observer
 export default class Main extends Component {
+  constructor(props) {
+    super(props);
+
+    this.state = { news: [], newsIndex: 0 };
+
+    this.loadData = this.loadData.bind(this);
+    this.renderNews = this.renderNews.bind(this);
+
+    setTimeout(this.loadData, 1000)
+  }
+
+  async loadData() {
+    const rh = new RH();
+    const account = new rh.Account();
+    const news = await account.news;
+    if (news.results) {
+      console.log(news.results);
+      this.setState({ ...this.state, allNews: news.results });
+    }
+  }
+
+  renderNews() {
+    const { allNews, newsIndex } = this.state;
+    if (!allNews || !allNews.length) return null;
+    const n = allNews[newsIndex];
+    const url = n.action.includes('web?url=') ? decodeURIComponent(n.action.split('web?url=')[1]) : null;
+
+    return (
+      <div id="news">
+        {url && <h4><a href="#a" onClick={() => link(url)}>{n.title}</a></h4>}
+        {!url && <h4>{n.title}</h4>}
+        {(newsIndex > 0) && <a href="#a" className="link" id="prevNews" onClick={() => this.setState({...this.state, newsIndex: this.state.newsIndex - 1})}>{'<'}</a>}
+        {(newsIndex < allNews.length - 1) && <a href="#a" className="link" id="nextNews" onClick={() => this.setState({...this.state, newsIndex: this.state.newsIndex + 1})}>{'>'}</a>}
+        <div id="news-text">
+          {n.message}
+        </div>
+      </div>
+    )
+  }
+
   render() {
     const { userStore } = this.props.store;
     if (!userStore.positions || !userStore.portfolio.todayChange) return <div>Loading...</div>;
 
     return (
       <div id="main-container">
+        {this.renderNews()}
         {userStore.positions.length && <Table />}
         {userStore.watchlist.length && <div>
           <h1>Watchlist</h1>

src/helpers/rh/core/Account.js

@@ -14,6 +14,10 @@ export default class Account {
     return Request.getPersonal('positions');
   }
 
+  get news() {
+    return Request.getPersonal('midlands/notifications/stack');
+  }
+
   get accounts() {
     return Request.getPersonal('accounts');
   }

src/styles/stylus/app.styl

@@ -8,6 +8,7 @@ html
   font-size 14px
   body
     font-family Montserrat,sans-serif
+    min-width 650px
     input[type=submit],button
       cursor pointer
       background-color c2
@@ -77,6 +78,22 @@ html
   margin 0
   padding 0
   height 0
+  #news
+    text-align center
+    font-size 12px
+    padding 10px
+    background-color c2
+    color c0
+    #news-text
+      margin 0 20px
+    a
+      color c0
+    .link
+      position relative
+    #prevNews
+      float left
+    #nextNews
+      float right
 
 #properties-table
   margin 0