1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 09:46:22 +00:00

Merge pull request #2183 from max-buranbaev/flickering-on-create-note

Flickering on create note
This commit is contained in:
Junyoung Choi (Sai)
2018-07-17 11:54:33 +09:00
committed by GitHub

View File

@@ -12,8 +12,7 @@ class NewNoteModal extends React.Component {
constructor (props) { constructor (props) {
super(props) super(props)
this.state = { this.state = {}
}
} }
componentDidMount () { componentDidMount () {
@@ -35,19 +34,20 @@ class NewNoteModal extends React.Component {
title: '', title: '',
content: '' content: ''
}) })
.then((note) => { .then(note => {
const noteHash = note.key const noteHash = note.key
dispatch({ dispatch({
type: 'UPDATE_NOTE', type: 'UPDATE_NOTE',
note: note note: note
}) })
hashHistory.push({ hashHistory.push({
pathname: location.pathname, pathname: location.pathname,
query: {key: noteHash} query: { key: noteHash }
}) })
ee.emit('list:jump', noteHash) ee.emit('list:jump', noteHash)
ee.emit('detail:focus') ee.emit('detail:focus')
this.props.close() setTimeout(this.props.close, 200)
}) })
} }
@@ -69,13 +69,15 @@ class NewNoteModal extends React.Component {
folder: folder, folder: folder,
title: '', title: '',
description: '', description: '',
snippets: [{ snippets: [
name: '', {
mode: 'text', name: '',
content: '' mode: 'text',
}] content: ''
}
]
}) })
.then((note) => { .then(note => {
const noteHash = note.key const noteHash = note.key
dispatch({ dispatch({
type: 'UPDATE_NOTE', type: 'UPDATE_NOTE',
@@ -83,11 +85,11 @@ class NewNoteModal extends React.Component {
}) })
hashHistory.push({ hashHistory.push({
pathname: location.pathname, pathname: location.pathname,
query: {key: noteHash} query: { key: noteHash }
}) })
ee.emit('list:jump', noteHash) ee.emit('list:jump', noteHash)
ee.emit('detail:focus') ee.emit('detail:focus')
this.props.close() setTimeout(this.props.close, 200)
}) })
} }
@@ -106,49 +108,65 @@ class NewNoteModal extends React.Component {
render () { render () {
return ( return (
<div styleName='root' <div
styleName='root'
tabIndex='-1' tabIndex='-1'
onKeyDown={(e) => this.handleKeyDown(e)} onKeyDown={e => this.handleKeyDown(e)}
> >
<div styleName='header'> <div styleName='header'>
<div styleName='title'>{i18n.__('Make a note')}</div> <div styleName='title'>{i18n.__('Make a note')}</div>
</div> </div>
<ModalEscButton handleEscButtonClick={(e) => this.handleCloseButtonClick(e)} /> <ModalEscButton
handleEscButtonClick={e => this.handleCloseButtonClick(e)}
/>
<div styleName='control'> <div styleName='control'>
<button styleName='control-button' <button
onClick={(e) => this.handleMarkdownNoteButtonClick(e)} styleName='control-button'
onKeyDown={(e) => this.handleMarkdownNoteButtonKeyDown(e)} onClick={e => this.handleMarkdownNoteButtonClick(e)}
onKeyDown={e => this.handleMarkdownNoteButtonKeyDown(e)}
ref='markdownButton' ref='markdownButton'
> >
<i styleName='control-button-icon' <i styleName='control-button-icon' className='fa fa-file-text-o' />
className='fa fa-file-text-o' <br />
/><br /> <span styleName='control-button-label'>
<span styleName='control-button-label'>{i18n.__('Markdown Note')}</span><br /> {i18n.__('Markdown Note')}
<span styleName='control-button-description'>{i18n.__('This format is for creating text documents. Checklists, code blocks and Latex blocks are available.')}</span> </span>
<br />
<span styleName='control-button-description'>
{i18n.__(
'This format is for creating text documents. Checklists, code blocks and Latex blocks are available.'
)}
</span>
</button> </button>
<button styleName='control-button' <button
onClick={(e) => this.handleSnippetNoteButtonClick(e)} styleName='control-button'
onKeyDown={(e) => this.handleSnippetNoteButtonKeyDown(e)} onClick={e => this.handleSnippetNoteButtonClick(e)}
onKeyDown={e => this.handleSnippetNoteButtonKeyDown(e)}
ref='snippetButton' ref='snippetButton'
> >
<i styleName='control-button-icon' <i styleName='control-button-icon' className='fa fa-code' /><br />
className='fa fa-code' <span styleName='control-button-label'>
/><br /> {i18n.__('Snippet Note')}
<span styleName='control-button-label'>{i18n.__('Snippet Note')}</span><br /> </span>
<span styleName='control-button-description'>{i18n.__('This format is for creating code snippets. Multiple snippets can be grouped into a single note.')} <br />
<span styleName='control-button-description'>
{i18n.__(
'This format is for creating code snippets. Multiple snippets can be grouped into a single note.'
)}
</span> </span>
</button> </button>
</div> </div>
<div styleName='description'><i className='fa fa-arrows-h' />{i18n.__('Tab to switch format')}</div> <div styleName='description'>
<i className='fa fa-arrows-h' />{i18n.__('Tab to switch format')}
</div>
</div> </div>
) )
} }
} }
NewNoteModal.propTypes = { NewNoteModal.propTypes = {}
}
export default CSSModules(NewNoteModal, styles) export default CSSModules(NewNoteModal, styles)