Eugen Rochko
8 years ago
parent
40a4053732
commit
3b81baaaaf
@ -0,0 +1,64 @@
|
||||
import api from '../api';
|
||||
|
||||
export const REPORT_INIT = 'REPORT_INIT';
|
||||
export const REPORT_CANCEL = 'REPORT_CANCEL';
|
||||
|
||||
export const REPORT_SUBMIT_REQUEST = 'REPORT_SUBMIT_REQUEST';
|
||||
export const REPORT_SUBMIT_SUCCESS = 'REPORT_SUBMIT_SUCCESS';
|
||||
export const REPORT_SUBMIT_FAIL = 'REPORT_SUBMIT_FAIL';
|
||||
|
||||
export const REPORT_STATUS_TOGGLE = 'REPORT_STATUS_TOGGLE';
|
||||
|
||||
export function initReport(account, status) {
|
||||
return {
|
||||
type: REPORT_INIT,
|
||||
account,
|
||||
status
|
||||
};
|
||||
};
|
||||
|
||||
export function cancelReport() {
|
||||
return {
|
||||
type: REPORT_CANCEL
|
||||
};
|
||||
};
|
||||
|
||||
export function toggleStatusReport(statusId, checked) {
|
||||
return {
|
||||
type: REPORT_STATUS_TOGGLE,
|
||||
statusId,
|
||||
checked,
|
||||
};
|
||||
};
|
||||
|
||||
export function submitReport() {
|
||||
return (dispatch, getState) => {
|
||||
dispatch(submitReportRequest());
|
||||
|
||||
api(getState).post('/api/v1/reports', {
|
||||
account_id: getState().getIn(['reports', 'new', 'account_id']),
|
||||
status_ids: getState().getIn(['reports', 'new', 'status_ids']),
|
||||
comment: getState().getIn(['reports', 'new', 'comment'])
|
||||
}).then(response => dispatch(submitReportSuccess(response.data))).catch(error => dispatch(submitReportFail(error)));
|
||||
};
|
||||
};
|
||||
|
||||
export function submitReportRequest() {
|
||||
return {
|
||||
type: REPORT_SUBMIT_REQUEST
|
||||
};
|
||||
};
|
||||
|
||||
export function submitReportSuccess(report) {
|
||||
return {
|
||||
type: REPORT_SUBMIT_SUCCESS,
|
||||
report
|
||||
};
|
||||
};
|
||||
|
||||
export function submitReportFail(error) {
|
||||
return {
|
||||
type: REPORT_SUBMIT_FAIL,
|
||||
error
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,38 @@
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import emojify from '../../../emoji';
|
||||
import Toggle from 'react-toggle';
|
||||
|
||||
const StatusCheckBox = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
status: ImmutablePropTypes.map.isRequired,
|
||||
checked: React.PropTypes.bool,
|
||||
onToggle: React.PropTypes.func.isRequired,
|
||||
disabled: React.PropTypes.bool
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
render () {
|
||||
const { status, checked, onToggle, disabled } = this.props;
|
||||
const content = { __html: emojify(status.get('content')) };
|
||||
|
||||
return (
|
||||
<div className='status-check-box' style={{ display: 'flex' }}>
|
||||
<div
|
||||
className='status__content'
|
||||
style={{ flex: '1 1 auto', padding: '10px' }}
|
||||
dangerouslySetInnerHTML={content}
|
||||
/>
|
||||
|
||||
<div style={{ flex: '0 0 auto', padding: '10px', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
|
||||
<Toggle checked={checked} onChange={onToggle} disabled={disabled} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default StatusCheckBox;
|
||||
@ -0,0 +1,19 @@
|
||||
import { connect } from 'react-redux';
|
||||
import StatusCheckBox from '../components/status_check_box';
|
||||
import { toggleStatusReport } from '../../../actions/reports';
|
||||
import Immutable from 'immutable';
|
||||
|
||||
const mapStateToProps = (state, { id }) => ({
|
||||
status: state.getIn(['statuses', id]),
|
||||
checked: state.getIn(['reports', 'new', 'status_ids'], Immutable.Set()).includes(id)
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch, { id }) => ({
|
||||
|
||||
onToggle (e) {
|
||||
dispatch(toggleStatusReport(id, e.target.checked));
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(StatusCheckBox);
|
||||
@ -0,0 +1,130 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { cancelReport, changeReportComment, submitReport } from '../../actions/reports';
|
||||
import { fetchAccountTimeline } from '../../actions/accounts';
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import Column from '../ui/components/column';
|
||||
import Button from '../../components/button';
|
||||
import { makeGetAccount } from '../../selectors';
|
||||
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
|
||||
import StatusCheckBox from './containers/status_check_box_container';
|
||||
import Immutable from 'immutable';
|
||||
import ColumnBackButtonSlim from '../../components/column_back_button_slim';
|
||||
|
||||
const messages = defineMessages({
|
||||
heading: { id: 'report.heading', defaultMessage: 'New report' },
|
||||
placeholder: { id: 'report.placeholder', defaultMessage: 'Additional comments' },
|
||||
submit: { id: 'report.submit', defaultMessage: 'Submit' }
|
||||
});
|
||||
|
||||
const makeMapStateToProps = () => {
|
||||
const getAccount = makeGetAccount();
|
||||
|
||||
const mapStateToProps = state => {
|
||||
const accountId = state.getIn(['reports', 'new', 'account_id']);
|
||||
|
||||
return {
|
||||
isSubmitting: state.getIn(['reports', 'new', 'isSubmitting']),
|
||||
account: getAccount(state, accountId),
|
||||
comment: state.getIn(['reports', 'new', 'comment']),
|
||||
statusIds: state.getIn(['timelines', 'accounts_timelines', accountId, 'items'], Immutable.List())
|
||||
};
|
||||
};
|
||||
|
||||
return mapStateToProps;
|
||||
};
|
||||
|
||||
const textareaStyle = {
|
||||
marginBottom: '10px'
|
||||
};
|
||||
|
||||
const Report = React.createClass({
|
||||
|
||||
contextTypes: {
|
||||
router: React.PropTypes.object
|
||||
},
|
||||
|
||||
propTypes: {
|
||||
isSubmitting: React.PropTypes.bool,
|
||||
account: ImmutablePropTypes.map,
|
||||
statusIds: ImmutablePropTypes.list.isRequired,
|
||||
comment: React.PropTypes.string.isRequired,
|
||||
dispatch: React.PropTypes.func.isRequired,
|
||||
intl: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
componentWillMount () {
|
||||
if (!this.props.account) {
|
||||
this.context.router.replace('/');
|
||||
}
|
||||
},
|
||||
|
||||
componentDidMount () {
|
||||
if (!this.props.account) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.props.dispatch(fetchAccountTimeline(this.props.account.get('id')));
|
||||
},
|
||||
|
||||
componentWillReceiveProps (nextProps) {
|
||||
if (this.props.account !== nextProps.account && nextProps.account) {
|
||||
this.props.dispatch(fetchAccountTimeline(nextProps.account.get('id')));
|
||||
}
|
||||
},
|
||||
|
||||
handleCommentChange (e) {
|
||||
this.props.dispatch(changeReportComment(e.target.value));
|
||||
},
|
||||
|
||||
handleSubmit () {
|
||||
this.props.dispatch(submitReport());
|
||||
this.context.router.replace('/');
|
||||
},
|
||||
|
||||
render () {
|
||||
const { account, comment, intl, statusIds, isSubmitting } = this.props;
|
||||
|
||||
if (!account) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Column heading={intl.formatMessage(messages.heading)} icon='flag'>
|
||||
<ColumnBackButtonSlim />
|
||||
<div className='report' style={{ display: 'flex', flexDirection: 'column', maxHeight: '100%', boxSizing: 'border-box' }}>
|
||||
<div className='report__target' style={{ flex: '0 0 auto', padding: '10px' }}>
|
||||
<FormattedMessage id='report.target' defaultMessage='Reporting' />
|
||||
<strong>{account.get('acct')}</strong>
|
||||
</div>
|
||||
|
||||
<div style={{ flex: '1 1 auto' }} className='scrollable'>
|
||||
<div>
|
||||
{statusIds.map(statusId => <StatusCheckBox id={statusId} key={statusId} disabled={isSubmitting} />)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{ flex: '0 0 160px', padding: '10px' }}>
|
||||
<textarea
|
||||
className='report__textarea'
|
||||
placeholder={intl.formatMessage(messages.placeholder)}
|
||||
value={comment}
|
||||
onChange={this.handleCommentChange}
|
||||
style={textareaStyle}
|
||||
disabled={isSubmitting}
|
||||
/>
|
||||
|
||||
<div style={{ marginTop: '10px', overflow: 'hidden' }}>
|
||||
<div style={{ float: 'right' }}><Button disabled={isSubmitting} text={intl.formatMessage(messages.submit)} onClick={this.handleSubmit} /></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Column>
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export default connect(makeMapStateToProps)(injectIntl(Report));
|
||||
@ -0,0 +1,57 @@
|
||||
import {
|
||||
REPORT_INIT,
|
||||
REPORT_SUBMIT_REQUEST,
|
||||
REPORT_SUBMIT_SUCCESS,
|
||||
REPORT_SUBMIT_FAIL,
|
||||
REPORT_CANCEL,
|
||||
REPORT_STATUS_TOGGLE
|
||||
} from '../actions/reports';
|
||||
import Immutable from 'immutable';
|
||||
|
||||
const initialState = Immutable.Map({
|
||||
new: Immutable.Map({
|
||||
isSubmitting: false,
|
||||
account_id: null,
|
||||
status_ids: Immutable.Set(),
|
||||
comment: ''
|
||||
})
|
||||
});
|
||||
|
||||
export default function reports(state = initialState, action) {
|
||||
switch(action.type) {
|
||||
case REPORT_INIT:
|
||||
return state.withMutations(map => {
|
||||
map.setIn(['new', 'isSubmitting'], false);
|
||||
map.setIn(['new', 'account_id'], action.account.get('id'));
|
||||
|
||||
if (state.getIn(['new', 'account_id']) !== action.account.get('id')) {
|
||||
map.setIn(['new', 'status_ids'], action.status ? Immutable.Set([action.status.get('id')]) : Immutable.Set());
|
||||
map.setIn(['new', 'comment'], '');
|
||||
} else {
|
||||
map.updateIn(['new', 'status_ids'], Immutable.Set(), set => set.add(action.status.get('id')));
|
||||
}
|
||||
});
|
||||
case REPORT_STATUS_TOGGLE:
|
||||
return state.updateIn(['new', 'status_ids'], Immutable.Set(), set => {
|
||||
if (action.checked) {
|
||||
return set.add(action.statusId);
|
||||
}
|
||||
|
||||
return set.remove(action.statusId);
|
||||
});
|
||||
case REPORT_SUBMIT_REQUEST:
|
||||
return state.setIn(['new', 'isSubmitting'], true);
|
||||
case REPORT_SUBMIT_FAIL:
|
||||
return state.setIn(['new', 'isSubmitting'], false);
|
||||
case REPORT_CANCEL:
|
||||
case REPORT_SUBMIT_SUCCESS:
|
||||
return state.withMutations(map => {
|
||||
map.setIn(['new', 'account_id'], null);
|
||||
map.setIn(['new', 'status_ids'], Immutable.Set());
|
||||
map.setIn(['new', 'comment'], '');
|
||||
map.setIn(['new', 'isSubmitting'], false);
|
||||
});
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,24 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class Api::V1::ReportsController < ApiController
|
||||
before_action -> { doorkeeper_authorize! :read }, except: [:create]
|
||||
before_action -> { doorkeeper_authorize! :write }, only: [:create]
|
||||
before_action :require_user!
|
||||
|
||||
respond_to :json
|
||||
|
||||
def index
|
||||
@reports = Report.where(account: current_account)
|
||||
end
|
||||
|
||||
def create
|
||||
status_ids = params[:status_ids].is_a?(Enumerable) ? params[:status_ids] : [params[:status_ids]]
|
||||
|
||||
@report = Report.create!(account: current_account,
|
||||
target_account: Account.find(params[:account_id]),
|
||||
status_ids: Status.find(status_ids).pluck(:id),
|
||||
comment: params[:comment])
|
||||
|
||||
render :show
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,9 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class Report < ApplicationRecord
|
||||
belongs_to :account
|
||||
belongs_to :target_account, class_name: 'Account'
|
||||
|
||||
scope :unresolved, -> { where(action_taken: false) }
|
||||
scope :resolved, -> { where(action_taken: true) }
|
||||
end
|
||||
@ -0,0 +1,2 @@
|
||||
collection @reports
|
||||
extends 'api/v1/reports/show'
|
||||
@ -0,0 +1,2 @@
|
||||
object @report
|
||||
attributes :id, :action_taken
|
||||
@ -0,0 +1,13 @@
|
||||
class CreateReports < ActiveRecord::Migration[5.0]
|
||||
def change
|
||||
create_table :reports do |t|
|
||||
t.integer :account_id, null: false
|
||||
t.integer :target_account_id, null: false
|
||||
t.integer :status_ids, array: true, null: false, default: []
|
||||
t.text :comment, null: false, default: ''
|
||||
t.boolean :action_taken, null: false, default: false
|
||||
|
||||
t.timestamps
|
||||
end
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,4 @@
|
||||
Fabricator(:report) do
|
||||
comment "You nasty"
|
||||
action_taken false
|
||||
end
|
||||
@ -0,0 +1,5 @@
|
||||
require 'rails_helper'
|
||||
|
||||
RSpec.describe Report, type: :model do
|
||||
|
||||
end
|
||||
Loading…
Reference in new issue