Eugen Rochko
8 years ago
parent
d42ed78aa4
commit
50d3083cbd
@ -1,48 +0,0 @@
|
||||
import api from '../api'
|
||||
|
||||
export const FOLLOW_CHANGE = 'FOLLOW_CHANGE';
|
||||
export const FOLLOW_SUBMIT_REQUEST = 'FOLLOW_SUBMIT_REQUEST';
|
||||
export const FOLLOW_SUBMIT_SUCCESS = 'FOLLOW_SUBMIT_SUCCESS';
|
||||
export const FOLLOW_SUBMIT_FAIL = 'FOLLOW_SUBMIT_FAIL';
|
||||
|
||||
export function changeFollow(text) {
|
||||
return {
|
||||
type: FOLLOW_CHANGE,
|
||||
text: text
|
||||
};
|
||||
};
|
||||
|
||||
export function submitFollow(router) {
|
||||
return function (dispatch, getState) {
|
||||
dispatch(submitFollowRequest());
|
||||
|
||||
api(getState).post('/api/v1/follows', {
|
||||
uri: getState().getIn(['follow', 'text'])
|
||||
}).then(function (response) {
|
||||
dispatch(submitFollowSuccess(response.data));
|
||||
router.push(`/accounts/${response.data.id}`);
|
||||
}).catch(function (error) {
|
||||
dispatch(submitFollowFail(error));
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
export function submitFollowRequest() {
|
||||
return {
|
||||
type: FOLLOW_SUBMIT_REQUEST
|
||||
};
|
||||
};
|
||||
|
||||
export function submitFollowSuccess(account) {
|
||||
return {
|
||||
type: FOLLOW_SUBMIT_SUCCESS,
|
||||
account: account
|
||||
};
|
||||
};
|
||||
|
||||
export function submitFollowFail(error) {
|
||||
return {
|
||||
type: FOLLOW_SUBMIT_FAIL,
|
||||
error: error
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,34 @@
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import IconButton from '../../../components/icon_button';
|
||||
|
||||
const UploadForm = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
media: ImmutablePropTypes.list.isRequired,
|
||||
is_uploading: React.PropTypes.bool,
|
||||
onSelectFile: React.PropTypes.func.isRequired,
|
||||
onRemoveFile: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
render () {
|
||||
const uploads = this.props.media.map(attachment => (
|
||||
<div key={attachment.get('id')} style={{ borderRadius: '4px', marginBottom: '10px' }} className='transparent-background'>
|
||||
<div style={{ width: '100%', height: '100px', borderRadius: '4px', background: `url(${attachment.get('preview_url')}) no-repeat center`, backgroundSize: 'cover' }}>
|
||||
<IconButton icon='times' title='Undo' size={36} onClick={this.props.onRemoveFile.bind(this, attachment.get('id'))} />
|
||||
</div>
|
||||
</div>
|
||||
));
|
||||
|
||||
return (
|
||||
<div style={{ marginBottom: '20px', padding: '10px', overflow: 'hidden' }}>
|
||||
{uploads}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default UploadForm;
|
||||
@ -0,0 +1,17 @@
|
||||
import { connect } from 'react-redux';
|
||||
import UploadButton from '../components/upload_button';
|
||||
import { uploadCompose } from '../../../actions/compose';
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size > 3 || state.getIn(['compose', 'media_attachments']).some(m => m.get('type') === 'video')),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
|
||||
onSelectFile (files) {
|
||||
dispatch(uploadCompose(files));
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(UploadButton);
|
||||
@ -0,0 +1,17 @@
|
||||
import { connect } from 'react-redux';
|
||||
import UploadForm from '../components/upload_form';
|
||||
import { undoUploadCompose } from '../../../actions/compose';
|
||||
|
||||
const mapStateToProps = (state, props) => ({
|
||||
media: state.getIn(['compose', 'media_attachments']),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
|
||||
onRemoveFile (media_id) {
|
||||
dispatch(undoUploadCompose(media_id));
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(UploadForm);
|
||||
@ -1,44 +0,0 @@
|
||||
import IconButton from '../../../components/icon_button';
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
|
||||
const FollowForm = React.createClass({
|
||||
|
||||
contextTypes: {
|
||||
router: React.PropTypes.object
|
||||
},
|
||||
|
||||
propTypes: {
|
||||
text: React.PropTypes.string.isRequired,
|
||||
is_submitting: React.PropTypes.bool,
|
||||
onChange: React.PropTypes.func.isRequired,
|
||||
onSubmit: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
handleChange (e) {
|
||||
this.props.onChange(e.target.value);
|
||||
},
|
||||
|
||||
handleKeyUp (e) {
|
||||
if (e.keyCode === 13) {
|
||||
this.handleSubmit();
|
||||
}
|
||||
},
|
||||
|
||||
handleSubmit () {
|
||||
this.props.onSubmit(this.context.router);
|
||||
},
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div style={{ display: 'flex', lineHeight: '20px', padding: '10px', background: '#373b4a' }}>
|
||||
<input autoComplete='off' type='text' disabled={this.props.is_submitting} placeholder='username@domain' value={this.props.text} onKeyUp={this.handleKeyUp} onChange={this.handleChange} className='follow-form__input' style={{ flex: '1 1 auto', boxSizing: 'border-box', display: 'block', border: 'none', padding: '10px', fontFamily: 'Roboto', color: '#282c37', fontSize: '14px', margin: '0' }} />
|
||||
<div style={{ padding: '10px', paddingRight: '0' }}><IconButton title='Follow' size={20} icon='user-plus' onClick={this.handleSubmit} disabled={this.props.is_submitting} /></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default FollowForm;
|
||||
@ -1,43 +0,0 @@
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import UploadButton from './upload_button';
|
||||
import IconButton from '../../../components/icon_button';
|
||||
|
||||
const UploadForm = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
media: ImmutablePropTypes.list.isRequired,
|
||||
is_uploading: React.PropTypes.bool,
|
||||
onSelectFile: React.PropTypes.func.isRequired,
|
||||
onRemoveFile: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
render () {
|
||||
let uploads = this.props.media.map(function (attachment) {
|
||||
return (
|
||||
<div key={attachment.get('id')} style={{ borderRadius: '4px', marginBottom: '10px' }} className='transparent-background'>
|
||||
<div style={{ width: '100%', height: '100px', borderRadius: '4px', background: `url(${attachment.get('preview_url')}) no-repeat center`, backgroundSize: 'cover' }}>
|
||||
<IconButton icon='times' title='Undo' size={36} onClick={() => this.props.onRemoveFile(attachment.get('id'))} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}.bind(this));
|
||||
|
||||
const noMoreAllowed = (this.props.media.some(m => m.get('type') === 'video')) || (this.props.media.size > 3);
|
||||
|
||||
return (
|
||||
<div style={{ marginBottom: '20px', padding: '10px', paddingTop: '0' }}>
|
||||
<UploadButton onSelectFile={this.props.onSelectFile} disabled={this.props.is_uploading || noMoreAllowed } />
|
||||
|
||||
<div style={{ marginTop: '10px', overflow: 'hidden' }}>
|
||||
{uploads}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default UploadForm;
|
||||
@ -1,24 +0,0 @@
|
||||
import { connect } from 'react-redux';
|
||||
import FollowForm from '../components/follow_form';
|
||||
import { changeFollow, submitFollow } from '../../../actions/follow';
|
||||
|
||||
const mapStateToProps = function (state, props) {
|
||||
return {
|
||||
text: state.getIn(['follow', 'text']),
|
||||
is_submitting: state.getIn(['follow', 'is_submitting'])
|
||||
};
|
||||
};
|
||||
|
||||
const mapDispatchToProps = function (dispatch) {
|
||||
return {
|
||||
onChange: function (text) {
|
||||
dispatch(changeFollow(text));
|
||||
},
|
||||
|
||||
onSubmit: function (router) {
|
||||
dispatch(submitFollow(router));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(FollowForm);
|
||||
@ -1,25 +0,0 @@
|
||||
import { connect } from 'react-redux';
|
||||
import UploadForm from '../components/upload_form';
|
||||
import { uploadCompose, undoUploadCompose } from '../../../actions/compose';
|
||||
|
||||
const mapStateToProps = function (state, props) {
|
||||
return {
|
||||
media: state.getIn(['compose', 'media_attachments']),
|
||||
progress: state.getIn(['compose', 'progress']),
|
||||
is_uploading: state.getIn(['compose', 'is_uploading'])
|
||||
};
|
||||
};
|
||||
|
||||
const mapDispatchToProps = function (dispatch) {
|
||||
return {
|
||||
onSelectFile: function (files) {
|
||||
dispatch(uploadCompose(files));
|
||||
},
|
||||
|
||||
onRemoveFile: function (media_id) {
|
||||
dispatch(undoUploadCompose(media_id));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(UploadForm);
|
||||
@ -1,29 +0,0 @@
|
||||
import {
|
||||
FOLLOW_CHANGE,
|
||||
FOLLOW_SUBMIT_REQUEST,
|
||||
FOLLOW_SUBMIT_SUCCESS,
|
||||
FOLLOW_SUBMIT_FAIL
|
||||
} from '../actions/follow';
|
||||
import Immutable from 'immutable';
|
||||
|
||||
const initialState = Immutable.Map({
|
||||
text: '',
|
||||
is_submitting: false
|
||||
});
|
||||
|
||||
export default function follow(state = initialState, action) {
|
||||
switch(action.type) {
|
||||
case FOLLOW_CHANGE:
|
||||
return state.set('text', action.text);
|
||||
case FOLLOW_SUBMIT_REQUEST:
|
||||
return state.set('is_submitting', true);
|
||||
case FOLLOW_SUBMIT_SUCCESS:
|
||||
return state.withMutations(map => {
|
||||
map.set('text', '').set('is_submitting', false);
|
||||
});
|
||||
case FOLLOW_SUBMIT_FAIL:
|
||||
return state.set('is_submitting', false);
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
};
|
||||
Loading…
Reference in new issue