url and note nav logic

This commit is contained in:
Jimmy 2020-01-29 17:35:35 -08:00
parent 4521ba0895
commit 2be41fc3fe
3 changed files with 111 additions and 43 deletions

View File

@ -775,6 +775,11 @@
"resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.51.0.tgz",
"integrity": "sha512-vyuYYRv3eXL0SCuZA4spRFlKNzQAewHcipRQCOKgRy7VNAvZxTKzbItdbCl4S5AgPZ5g3WkHp+ibWQwv9TLG7Q=="
},
"collapse-white-space": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-1.0.6.tgz",
"integrity": "sha512-jEovNnrhMuqyCcjfEJA56v0Xq8SkIoPKDyaHahwo3POf4qcSXqMYuwNcOTzp74vTsR9Tn08z4MxWqAhcekogkQ=="
},
"collect-stream": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/collect-stream/-/collect-stream-1.2.1.tgz",
@ -1830,8 +1835,7 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"aproba": {
"version": "1.2.0",
@ -1852,14 +1856,12 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@ -1874,20 +1876,17 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"core-util-is": {
"version": "1.0.2",
@ -2004,8 +2003,7 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"ini": {
"version": "1.3.5",
@ -2017,7 +2015,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@ -2032,7 +2029,6 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@ -2040,14 +2036,12 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@ -2066,7 +2060,6 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@ -2147,8 +2140,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
@ -2160,7 +2152,6 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@ -2246,8 +2237,7 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"safer-buffer": {
"version": "2.1.2",
@ -2283,7 +2273,6 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -2303,7 +2292,6 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@ -2347,14 +2335,12 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
}
}
},

View File

@ -0,0 +1,72 @@
import React, { Component } from 'react';
import moment from 'moment';
import { Link } from 'react-router-dom';
export class NoteNavigation extends Component {
constructor(props) {
super(props)
console.log(props)
}
render() {
let nextComponent = null;
let prevComponent = null;
let nextUrl = ''
let prevUrl = ''
if (this.props.next && this.props.prev) {
console.log("both")
nextUrl = `/~publish/note/${this.props.ship}/${this.props.book}/${this.props.next.id}`;
prevUrl = `/~publish/note/${this.props.ship}/${this.props.book}/${this.props.prev.id}`;
console.log(this.props.prev.prevId);
nextComponent =
<Link to={nextUrl} className="di flex-column tr w-100 pv6 bt bb b--gray3">
<div className="f9 gray2 mb2">Next</div>
<div className="f9 mb1">{this.props.next.title}</div>
<div className="f9 gray2">{this.props.next.date}</div>
</Link>
prevComponent =
<Link to={prevUrl} className="di flex-column w-100 pv6 bt br bb b--gray3">
<div className="f9 gray2 mb2">Previous</div>
<div className="f9 mb1">{this.props.prev.title}</div>
<div className="f9 gray2">{this.props.prev.date}</div>
</Link>
} else if (this.props.prev) {
console.log("prev")
console.log(this.props.prev.prevId);
prevUrl = `/~publish/note/${this.props.ship}/${this.props.book}/${this.props.prev.id}`;
prevComponent =
<Link to={prevUrl} className="di flex-column w-100 pv6 bt bb b--gray3">
<div className="f9 gray2 mb2">Previous</div>
<div className="f9 mb1">{this.props.prev.title}</div>
<div className="f9 gray2">{this.props.prev.date}</div>
</Link>
console.log(prevComponent)
} else if (this.props.next) {
console.log("next")
nextUrl = `/~publish/note/${this.props.ship}/${this.props.book}/${this.props.next.id}`;
nextComponent =
<Link to={nextUrl} className="di flex-column tr w-100 pv6 bt bb b--gray3">
<div className="f9 gray2 mb2">Next</div>
<div className="f9 mb1">{this.props.next.title}</div>
<div className="f9 gray2">{this.props.next.date}</div>
</Link>
}
return (
<div className="flex mt4">
{prevComponent}
{nextComponent}
</div>
)
}
}
export default NoteNavigation

View File

@ -1,5 +1,6 @@
import React, { Component } from 'react';
import { Comments } from './comments';
import { NoteNavigation } from './note-navigation';
import moment from 'moment';
import ReactMarkdown from 'react-markdown'
// import test from 'test.json';
@ -41,6 +42,23 @@ export class Note extends Component {
let date = moment(this.props.notebook.notes[this.props.note]["date-created"]).fromNow();
let newfile = file.slice(file.indexOf(';>')+2);
let prevId = this.props.notebook.notes[this.props.note]["prev-note"];
let nextId = this.props.notebook.notes[this.props.note]["next-note"];
let prev = (prevId === null)
? null
: {
id: prevId,
title: this.props.notebook.notes[prevId].title,
date: moment(this.props.notebook.notes[prevId]["date-created"]).fromNow()
}
let next = (nextId === null)
? null
: {
id: nextId,
title: this.props.notebook.notes[nextId].title,
date: moment(this.props.notebook.notes[nextId]["date-created"]).fromNow()
}
return (
@ -56,19 +74,11 @@ export class Note extends Component {
</div>
<ReactMarkdown source={newfile} />
<div className="flex mt4">
<a href="" className="di flex-column w-50 pv6 bt br bb b--gray3">
<div className="f9 gray2 mb2">Previous</div>
<div className="f9 mb1">%loud</div>
<div className="f9 gray2">14d ago</div>
</span>
<a href="" className="di flex-column tr w-50 pv6 bt bb b--gray3">
<div className="f9 gray2 mb2">Next</div>
<div className="f9 mb1">+advent of %code ~2019.12</div>
<div className="f9 gray2">6d ago</div>
</div>
</div>
<NoteNavigation
prev={prev}
next={next}
ship={this.props.ship}
book={this.props.book}/>
<Comments ship={this.props.ship} book={this.props.book} note={this.props.note} comments={comments}/>
</div>