5 files changed, 95 insertions, 13 deletions

diff --git a/scraper/client/paper/paper.address.js b/scraper/client/paper/paper.address.js
index 2240388f..6d02c3db 100644
--- a/scraper/client/paper/paper.address.js
+++ b/scraper/client/paper/paper.address.js
@@ -4,27 +4,98 @@ import { connect } from 'react-redux'
 
 import * as actions from '../actions'
 
-// import { Loader } from '../common'
+import { Loader, Autocomplete } from '../common'
 
+const initialState = {
+  citation: null,
+  institution_1: '',
+  institution_2: '',
+  institution_3: '',
+  institution_4: '',
+}
 class PaperAddress extends Component {
+  state = {
+    ...initialState
+  }
+
   componentDidMount() {
     const { sha256 } = this.props.match.params
     this.props.actions.getAddress(sha256)
+    const citation = this.getCitation(sha256)
+    this.setState({ citation })
   }
 
-  componentDidUpdate(newProps) {
-    const { sha256: oldSha256 } = this.props.match.params
-    const { sha256 } = newProps.match.params
-    if (sha256 !== oldSha256) {
-      this.props.actions.getPaperInfo(this.props.match.params.key)
+  componentDidUpdate(oldProps) {
+    const { sha256 } = this.props.match.params
+    const { address } = this.props.api
+    const { sha256: oldSha256 } = oldProps.match.params
+    const { address: oldAddress } = oldProps.api
+    const oldPaper = oldAddress ? oldAddress.paper : null
+    const paper = address ? address.paper : null
+
+    if (oldSha256 && sha256 !== oldSha256) {
+      console.log('update address')
+      this.props.actions.getAddress(sha256)
+      const citation = this.getCitation(sha256)
+      this.setState({
+        ...initialState,
+        citation
+      })
+    } else if (address && !address.loading && address.paper && (!oldPaper || oldPaper !== address.paper)) {
+      if (paper.error) {
+        const citation = this.getCitation(sha256)
+        this.setState({
+          ...initialState,
+          citation,
+        })
+      } else {
+        console.log(paper)
+        const citation = this.getCitation(sha256)
+        this.setState({
+          citation,
+          institution_1: paper['Institution #1'],
+          institution_2: paper['Institution #2'],
+          institution_3: paper['Institution #3'],
+          institution_4: paper['Institution #4'],
+        })
+      }
+    } else if (oldProps.api.unknownCitations !== this.props.api.unknownCitations) {
+      const citation = this.getCitation(sha256)
+      this.setState({ citation })
     }
   }
 
+  getCitation(sha256) {
+    const { paperInfo, unknownCitations } = this.props.api
+    let citation = (unknownCitations.citations || []).find(f => f.id === sha256)
+    if (!citation) {
+      citation = (paperInfo.citations || []).find(f => f.id === sha256)
+    }
+    console.log(sha256, citation)
+    return citation
+  }
+
   render() {
     // if (!this.props.match.params.key) return null
     // if (this.props.api.address.loading) return <Loader />
     // if (!this.props.api.paperInfo.dataset) return <div className='paperInfo'>Metadata not found</div>
-    return null
+    let { paperInfo, unknownCitations } = this.props.api
+    if (paperInfo.loading || unknownCitations.loading) return <Loader />
+    console.log(this.state)
+    const { citation } = this.state
+    if (!citation) {
+      return <div>Citation not found in this paper</div>
+    }
+    return (
+      <div className='form'>
+        <h3>{citation.title}</h3>
+        <div className='gray'>{citation.id}</div>
+        {this.state.institution_1}
+        {/*
+          <iframe className='pdfViewer' src={citation.pdf} />
+        */}
+      </div>
+    )
   }
 }
 
diff --git a/scraper/client/paper/paper.citations.js b/scraper/client/paper/paper.citations.js
index de423a77..1789a815 100644
--- a/scraper/client/paper/paper.citations.js
+++ b/scraper/client/paper/paper.citations.js
@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
+import { Link } from 'react-router-dom'
 
 import * as actions from '../actions'
 
@@ -19,7 +20,7 @@ class PaperCitations extends Component {
           let cite = { ...citation }
           cite.id = {
             _raw: true,
-            value: <a href={'/api/address/' + dataset.key + '/' + citation.id}>{citation.id}</a>
+            value: <Link to={'/paper/' + dataset.key + '/address/' + citation.id}>{citation.id}</Link>
           }
           cite.pdf = {
             _raw: true,
diff --git a/scraper/client/paper/paper.css b/scraper/client/paper/paper.css
index cd2f8529..0977dcb3 100644
--- a/scraper/client/paper/paper.css
+++ b/scraper/client/paper/paper.css
@@ -1,5 +1,6 @@
-.paperInfo {
+.form, .paperInfo {
   padding: 10px;
+  width: 100%;
 }
 
 .citations ul {
@@ -16,4 +17,13 @@
 
 .type {
   color: #888;
+}
+.gray {
+  padding: 3px;
+}
+iframe.pdfViewer {
+  margin: 10px 0;
+  width: 100%;
+  height: 50vh;
+  border: 1px solid black;
 }
\ No newline at end of file
diff --git a/scraper/client/paper/paper.manager.js b/scraper/client/paper/paper.manager.js
index c52722e7..2ac03b01 100644
--- a/scraper/client/paper/paper.manager.js
+++ b/scraper/client/paper/paper.manager.js
@@ -11,8 +11,8 @@ class PaperManager extends Component {
     this.props.actions.getPaperInfo(this.props.match.params.key)
   }
 
-  componentDidUpdate(newProps) {
-    if (this.props.match.params.key !== newProps.match.params.key) {
+  componentDidUpdate(oldProps) {
+    if (this.props.match.params.key !== oldProps.match.params.key) {
       this.props.actions.getPaperInfo(this.props.match.params.key)
     }
   }
diff --git a/scraper/client/paper/paper.unknown.js b/scraper/client/paper/paper.unknown.js
index 7a20f398..0cb7d2da 100644
--- a/scraper/client/paper/paper.unknown.js
+++ b/scraper/client/paper/paper.unknown.js
@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
+import { Link } from 'react-router-dom'
 
 import * as actions from '../actions'
 
@@ -20,7 +21,7 @@ class PaperUnknown extends Component {
           let cite = { ...citation }
           cite.id = {
             _raw: true,
-            value: <a href={'/api/address/' + dataset.key + '/' + citation.id}>{citation.id}</a>
+            value: <Link to={'/paper/' + dataset.key + '/address/' + citation.id}>{citation.id}</Link>
           }
           cite.pdf = {
             _raw: true,
@@ -41,7 +42,6 @@ class PaperUnknown extends Component {
     )
   }
 }
-                // order={['id', 'pdf', 'year']}
 
 const mapStateToProps = state => ({
   api: state.api