public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 17:56:25 +00:00
Code Issues Releases Wiki Activity

v0.5.6

Browse Source
This commit is contained in:
Rokt33r
2016-03-27 23:18:54 +09:00
parent 9ac0becfb2
commit 86f649fab1
7 changed files with 82 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
browser/main/modal/Preference/ContactTab.js
View File

@@ -1,122 +1,26 @@
import React from 'react'
import ReactDOM from 'react-dom'
import clientKey from 'browser/lib/clientKey'
import linkState from 'browser/lib/linkState'
import _ from 'lodash'
import { request, SERVER_URL } from 'browser/lib/api'
const FORM_MODE = 'FORM_MODE'
const DONE_MODE = 'DONE_MODE'
import ExternalLink from 'browser/components/ExternalLink'
export default class ContactTab extends React.Component {
constructor (props) {
super(props)
this.state = {
title: '',
content: '',
email: '',
mode: FORM_MODE,
alert: null
}
}
componentDidMount () {
let titleInput = ReactDOM.findDOMNode(this.refs.title)
if (titleInput != null) titleInput.focus()
}
handleBackButtonClick (e) {
this.setState({
mode: FORM_MODE
})
}
handleSendButtonClick (e) {
let input = _.pick(this.state, ['title', 'content', 'email'])
input.clientKey = clientKey.get()
this.setState({
alert: {
type: 'info',
message: 'Sending...'
}
}, () => {
request.post(SERVER_URL + 'apis/inquiry')
.send(input)
.then(res => {
console.log('sent')
this.setState({
title: '',
content: '',
mode: DONE_MODE,
alert: null
})
})
.catch(err => {
if (err.code === 'ECONNREFUSED') {
this.setState({
alert: {
type: 'error',
message: 'Can\'t connect to API server.'
}
})
} else {
console.error(err)
this.setState({
alert: {
type: 'error',
message: err.message
}
})
}
})
})
}
render () {
switch (this.state.mode) {
case DONE_MODE:
return (
<div className='ContactTab content done'>
<div className='message'>
<i className='checkIcon fa fa-check-circle'/><br/>
Your message has been sent successfully!!
</div>
<div className='control'>
<button onClick={e => this.handleBackButtonClick(e)}>Back to Contact form</button>
</div>
</div>
)
case FORM_MODE:
default:
let alertElement = this.state.alert != null
? (
<div className={'alert ' + this.state.alert.type}>{this.state.alert.message}</div>
)
: null
return (
<div className='ContactTab content form'>
<div className='title'>Contact form</div>
<div className='description'>
Your feedback is highly appreciated and will help us to improve our app. :D
</div>
<div className='iptGroup'>
<input ref='title' valueLink={this.linkState('title')} placeholder='Title' type='text'/>
</div>
<div className='iptGroup'>
<textarea valueLink={this.linkState('content')} placeholder='Content'/>
</div>
<div className='iptGroup'>
<input valueLink={this.linkState('email')} placeholder='E-mail (Optional)' type='email'/>
</div>
<div className='formControl'>
<button onClick={e => this.handleSendButtonClick(e)} className='primary'>Send</button>
{alertElement}
</div>
</div>
)
}
return (
<div className='ContactTab content'>
<div className='title'>Contact</div>
<p>
- E-mail: <ExternalLink href='mailto:rokt33r@gmail.com?Subject=About%20Boost'>rokt33r@gmail.com</ExternalLink>
</p>
<p>
- Issues: <ExternalLink href='https://github.com/BoostIO/Boostnote/issues'>https://github.com/BoostIO/Boostnote/issues</ExternalLink>
</p>
</div>
)
}
}