Skip to content

Commit a1810e6

Browse files
committed
new folder modal / key indexing for article / login bugfix
1 parent 832ca33 commit a1810e6

17 files changed

Lines changed: 309 additions & 85 deletions

File tree

browser/finder/text.js

Whitespace-only changes.

browser/main/HomePage.js

Lines changed: 29 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,27 @@ import ArticleList from './HomePage/ArticleList'
88
import ArticleDetail from './HomePage/ArticleDetail'
99
import { findWhere, findIndex, pick } from 'lodash'
1010
import keygen from 'boost/keygen'
11-
import { NEW } from './actions'
11+
import { NEW, refreshArticles } from './actions'
12+
import api from 'boost/api'
1213

13-
class HomeContainer extends React.Component {
14+
class HomePage extends React.Component {
1415
componentDidMount () {
1516
const { dispatch } = this.props
1617

1718
dispatch(switchUser(this.props.params.userId))
19+
20+
let currentUser = JSON.parse(localStorage.getItem('currentUser'))
21+
let users = [currentUser].concat(currentUser.Teams)
22+
users.forEach(user => {
23+
api.fetchArticles(user.id)
24+
.then(res => {
25+
dispatch(refreshArticles(user.id, res.body))
26+
})
27+
.catch(err => {
28+
if (err.status == null) throw err
29+
console.error(err)
30+
})
31+
})
1832
}
1933

2034
componentWillReceiveProps (nextProps) {
@@ -29,7 +43,7 @@ class HomeContainer extends React.Component {
2943
const { dispatch, status, users, activeUser, articles, activeArticle } = this.props
3044

3145
return (
32-
<div className='HomeContainer'>
46+
<div className='HomePage'>
3347
<UserNavigator users={users} />
3448
<ArticleNavigator dispatch={dispatch} activeUser={activeUser} status={status}/>
3549
<ArticleTopBar/>
@@ -44,13 +58,17 @@ function remap (state) {
4458
let status = state.status
4559

4660
let currentUser = state.currentUser
61+
if (currentUser == null) return state
4762
let teams = Array.isArray(currentUser.Teams) ? currentUser.Teams : []
4863

4964
let users = [currentUser, ...teams]
5065
let activeUser = findWhere(users, {id: parseInt(status.userId, 10)})
5166
if (activeUser == null) activeUser = users[0]
67+
5268
let articles = state.articles['team-' + activeUser.id]
53-
let activeArticle = findWhere(articles, {id: status.articleId})
69+
if (articles == null) articles = []
70+
71+
let activeArticle = findWhere(articles, {key: status.articleKey})
5472
if (activeArticle == null) activeArticle = articles[0]
5573

5674
// remove Unsaved new article if user is not CREATE_MODE
@@ -68,7 +86,8 @@ function remap (state) {
6886
var newArticle = findWhere(articles, {status: 'NEW'})
6987
if (newArticle == null) {
7088
newArticle = {
71-
id: keygen(),
89+
id: null,
90+
key: keygen(),
7291
title: '',
7392
content: '',
7493
mode: 'markdown',
@@ -84,16 +103,18 @@ function remap (state) {
84103
status.mode = IDLE_MODE
85104
}
86105

87-
return {
106+
let props = {
88107
users,
89108
activeUser,
90109
status,
91110
articles,
92111
activeArticle
93112
}
113+
console.log(props)
114+
return props
94115
}
95116

96-
HomeContainer.propTypes = {
117+
HomePage.propTypes = {
97118
users: PropTypes.array,
98119
activeUser: PropTypes.object,
99120
params: PropTypes.shape({
@@ -108,4 +129,4 @@ HomeContainer.propTypes = {
108129
dispatch: PropTypes.func
109130
}
110131

111-
export default connect(remap)(HomeContainer)
132+
export default connect(remap)(HomePage)

browser/main/HomePage/ArticleDetail.js

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ var modeOptions = aceModes.map(function (mode) {
1919

2020
function makeInstantArticle (article) {
2121
let instantArticle = Object.assign({}, article)
22-
instantArticle.Tags = instantArticle.Tags.map(tag => tag.name)
22+
instantArticle.Tags = typeof instantArticle.Tags === 'array' ? instantArticle.Tags.map(tag => tag.name) : []
2323
return instantArticle
2424
}
2525

@@ -102,8 +102,12 @@ export default class ArticleDetail extends React.Component {
102102
<div className='deleteConfirm'>
103103
<div className='right'>
104104
Are you sure to delete this article?
105-
<button onClick={e => this.handleDeleteConfirmButtonClick(e)} className='primary'><i className='fa fa-fw fa-check'/> Sure</button>
106-
<button onClick={e => this.handleDeleteCancleButtonClick(e)}><i className='fa fa-fw fa-times'/> Cancle</button>
105+
<button onClick={e => this.handleDeleteConfirmButtonClick(e)} className='primary'>
106+
<i className='fa fa-fw fa-check'/> Sure
107+
</button>
108+
<button onClick={e => this.handleDeleteCancleButtonClick(e)}>
109+
<i className='fa fa-fw fa-times'/> Cancle
110+
</button>
107111
</div>
108112
</div>
109113
)
@@ -133,7 +137,10 @@ export default class ArticleDetail extends React.Component {
133137
<ModeIcon className='mode' mode={activeArticle.mode}/>
134138
<div className='title'>{activeArticle.title}</div>
135139
</div>
136-
{activeArticle.mode === 'markdown' ? <MarkdownPreview content={activeArticle.content}/> : <CodeEditor readOnly={true} onChange={this.handleContentChange} mode={activeArticle.mode} code={activeArticle.content}/>}
140+
{activeArticle.mode === 'markdown'
141+
? <MarkdownPreview content={activeArticle.content}/>
142+
: <CodeEditor readOnly={true} onChange={this.handleContentChange} mode={activeArticle.mode} code={activeArticle.content}/>
143+
}
137144
</div>
138145
</div>
139146
</div>
@@ -147,7 +154,7 @@ export default class ArticleDetail extends React.Component {
147154
handleSaveButtonClick (e) {
148155
let { activeArticle } = this.props
149156

150-
if (typeof activeArticle.id === 'string') this.saveAsNew()
157+
if (activeArticle.id == null) this.saveAsNew()
151158
else this.save()
152159
}
153160

@@ -254,7 +261,7 @@ export default class ArticleDetail extends React.Component {
254261
<div className='detailInfo'>
255262
<div className='left'>
256263
<Select ref='folder' onChange={value => this.handleFolderIdChange(value)} clearable={false} placeholder='select folder...' options={folderOptions} value={this.state.article.FolderId} className='folder'/>
257-
<Select onChange={(tag, tags) => this.handleTagsChange(tag, tags)} clearable={false} multi={true} placeholder='add some tags...' allowCreate={true} value={this.state.article.Tags} className='tags'/>
264+
<Select onChange={(tag, tags) => this.handleTagsChange(tag, tags)} clearable={false} multi placeholder='add some tags...' allowCreate value={this.state.article.Tags} className='tags'/>
258265
</div>
259266
<div className='right'>
260267
<button onClick={e => this.handleCancelButtonClick(e)}>Cancel</button>

browser/main/HomePage/ArticleList.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import moment from 'moment'
55
import { IDLE_MODE, CREATE_MODE, EDIT_MODE, switchArticle, NEW } from '../actions'
66

77
export default class ArticleList extends React.Component {
8-
handleArticleClick (id) {
8+
handleArticleClick (key) {
99
let { dispatch } = this.props
1010
return function (e) {
11-
dispatch(switchArticle(id))
11+
dispatch(switchArticle(key))
1212
}
1313
}
1414

@@ -25,8 +25,8 @@ export default class ArticleList extends React.Component {
2525
)
2626

2727
return (
28-
<div key={'article-' + article.id}>
29-
<div onClick={e => this.handleArticleClick(article.id)(e)} className={'articleItem' + (activeArticle.id === article.id ? ' active' : '')}>
28+
<div key={'article-' + article.key}>
29+
<div onClick={e => this.handleArticleClick(article.key)(e)} className={'articleItem' + (activeArticle.key === article.key ? ' active' : '')}>
3030
<div className='top'>
3131
<i className='fa fa-fw fa-square'/>
3232
by <ProfileImage className='profileImage' size='20' email={article.User.email}/> {article.User.profileName}

browser/main/HomePage/ArticleNavigator.js

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ import React, { PropTypes } from 'react'
22
import ProfileImage from 'boost/components/ProfileImage'
33
import { findWhere } from 'lodash'
44
import { switchMode, CREATE_MODE } from '../actions'
5+
import { openModal } from 'boost/modal'
6+
import CreateNewFolder from 'boost/components/modal/CreateNewFolder'
57

68
export default class ArticleNavigator extends React.Component {
79
handleNewPostButtonClick (e) {
@@ -10,6 +12,11 @@ export default class ArticleNavigator extends React.Component {
1012
dispatch(switchMode(CREATE_MODE))
1113
}
1214

15+
handleNewFolderButton (e) {
16+
let { activeUser } = this.props
17+
openModal(CreateNewFolder, {user: activeUser})
18+
}
19+
1320
render () {
1421
let { activeUser, status } = this.props
1522
if (activeUser == null) return (<div className='ArticleNavigator'/>)
@@ -48,7 +55,7 @@ export default class ArticleNavigator extends React.Component {
4855
<div className='folders'>
4956
<div className='header'>
5057
<div className='title'>Folders</div>
51-
<button className='addBtn'><i className='fa fa-fw fa-plus'/></button>
58+
<button onCLick={e => this.handleNewFolderButton(e)} className='addBtn'><i className='fa fa-fw fa-plus'/></button>
5259
</div>
5360
<div className='folderList'>
5461
<button className={activeFolder == null ? 'active' : ''}>All folders</button>
@@ -75,7 +82,7 @@ export default class ArticleNavigator extends React.Component {
7582

7683
ArticleNavigator.propTypes = {
7784
activeUser: PropTypes.object,
78-
state: PropTypes.shape({
85+
status: PropTypes.shape({
7986
folderId: PropTypes.number
8087
}),
8188
dispatch: PropTypes.func

browser/main/LoginPage.js

Lines changed: 28 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -22,40 +22,45 @@ export default class LoginPage extends React.Component {
2222
error: null
2323
}, function () {
2424
login(this.state.user)
25-
.then(function (res) {
25+
.then(res => {
2626
localStorage.setItem('token', res.body.token)
2727
localStorage.setItem('currentUser', JSON.stringify(res.body.user))
2828

29-
try {
30-
this.props.history.pushState('home')
31-
} catch (e) {
32-
console.error(e)
33-
}
34-
}.bind(this))
35-
.catch(function (err) {
29+
this.props.history.pushState('home')
30+
})
31+
.catch(err => {
3632
console.error(err)
37-
if (err.response == null) {
33+
if (err.code === 'ECONNREFUSED') {
3834
return this.setState({
39-
error: {name: 'CunnectionRefused', message: 'Can\'t connect to API server.'},
35+
error: {
36+
name: 'CunnectionRefused',
37+
message: 'Can\'t connect to API server.'
38+
},
4039
isSending: false
4140
})
4241
}
43-
44-
// Connection Failed or Whatever
45-
this.setState({
46-
error: err.response.body,
47-
isSending: false
48-
})
49-
}.bind(this))
42+
else if (err.status != null) {
43+
return this.setState({
44+
error: {
45+
name: err.response.body.name,
46+
message: err.response.body.message
47+
},
48+
isSending: false
49+
})
50+
}
51+
else throw err
52+
})
5053
})
5154
}
5255

5356
render () {
5457
return (
5558
<div className='LoginContainer'>
56-
<img className='logo' src='resources/favicon-230x230.png'/>
59+
<img className='logo' src='../../resources/favicon-230x230.png'/>
5760

58-
<nav className='authNavigator text-center'><Link to='/login' activeClassName='active'>Log In</Link> / <Link to='/signup' activeClassName='active'>Sign Up</Link></nav>
61+
<nav className='authNavigator text-center'>
62+
<Link to='/login' activeClassName='active'>Log In</Link> / <Link to='/signup' activeClassName='active'>Sign Up</Link>
63+
</nav>
5964

6065
<form onSubmit={e => this.handleSubmit(e)}>
6166
<div className='formField'>
@@ -65,9 +70,10 @@ export default class LoginPage extends React.Component {
6570
<input valueLink={this.linkState('user.password')} onChange={this.handleChange} type='password' placeholder='Password'/>
6671
</div>
6772

68-
{this.state.isSending ? (
69-
<p className='alertInfo'>Logging in...</p>
70-
) : null}
73+
{this.state.isSending
74+
? (
75+
<p className='alertInfo'>Logging in...</p>
76+
) : null}
7177

7278
{this.state.error != null ? <p className='alertError'>{this.state.error.message}</p> : null}
7379

browser/main/SignupPage.js

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -30,23 +30,30 @@ export default class SignupContainer extends React.Component {
3030
localStorage.setItem('token', res.body.token)
3131
localStorage.setItem('currentUser', JSON.stringify(res.body.user))
3232

33-
this.props.history.pushState('userHome', {userId: res.body.user.id})
33+
this.props.history.pushState('home')
3434
})
35-
.catch(function (err) {
35+
.catch(err => {
3636
console.error(err)
37-
if (err.response == null) {
37+
if (err.code === 'ECONNREFUSED') {
3838
return this.setState({
39-
error: {name: 'CunnectionRefused', message: 'Can\'t connect to API server.'},
39+
error: {
40+
name: 'CunnectionRefused',
41+
message: 'Can\'t connect to API server.'
42+
},
4043
isSending: false
4144
})
4245
}
43-
44-
// Connection Failed or Whatever
45-
this.setState({
46-
error: err.response.body,
47-
isSending: false
48-
})
49-
}.bind(this))
46+
else if (err.status != null) {
47+
return this.setState({
48+
error: {
49+
name: err.response.body.name,
50+
message: err.response.body.message
51+
},
52+
isSending: false
53+
})
54+
}
55+
else throw err
56+
})
5057
})
5158

5259
e.preventDefault()
@@ -55,7 +62,7 @@ export default class SignupContainer extends React.Component {
5562
render () {
5663
return (
5764
<div className='SignupContainer'>
58-
<img className='logo' src='resources/favicon-230x230.png'/>
65+
<img className='logo' src='../../resources/favicon-230x230.png'/>
5966

6067
<nav className='authNavigator text-center'><Link to='/login' activeClassName='active'>Log In</Link> / <Link to='/signup' activeClassName='active'>Sign Up</Link></nav>
6168

browser/main/index.js

Lines changed: 2 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ require('../styles/main/index.styl')
1313

1414
function onlyUser (state, replaceState) {
1515
var currentUser = JSON.parse(localStorage.getItem('currentUser'))
16-
if (currentUser == null) replaceState('login', '/login')
17-
if (state.location.pathname === '/') replaceState('user', '/users/' + currentUser.id)
16+
if (currentUser == null) return replaceState('login', '/login')
17+
if (state.location.pathname === '/') return replaceState('user', '/users/' + currentUser.id)
1818
}
1919

2020
let routes = (
@@ -62,18 +62,6 @@ React.render((
6262
.then(function (res) {
6363
let user = res.body
6464
store.dispatch(updateUser(user))
65-
66-
let users = [user].concat(user.Teams)
67-
users.forEach(user => {
68-
fetchArticles(user.id)
69-
.then(res => {
70-
store.dispatch(refreshArticles(user.id, res.body))
71-
})
72-
.catch(err => {
73-
if (err.status == null) throw err
74-
console.error(err)
75-
})
76-
})
7765
})
7866
.catch(function (err) {
7967
console.error(err.message)

0 commit comments

Comments
 (0)