Add redraft function (#7735)
* Add redraft function Fix #7010 * Add explicit confirmation * Add explicit confirmation message
This commit is contained in:
		
							parent
							
								
									5fb013878f
								
							
						
					
					
						commit
						bd0791d800
					
				
					 7 changed files with 74 additions and 12 deletions
				
			
		|  | @ -29,6 +29,8 @@ export const STATUS_UNMUTE_FAIL    = 'STATUS_UNMUTE_FAIL'; | |||
| export const STATUS_REVEAL = 'STATUS_REVEAL'; | ||||
| export const STATUS_HIDE   = 'STATUS_HIDE'; | ||||
| 
 | ||||
| export const REDRAFT = 'REDRAFT'; | ||||
| 
 | ||||
| export function fetchStatusRequest(id, skipLoading) { | ||||
|   return { | ||||
|     type: STATUS_FETCH_REQUEST, | ||||
|  | @ -131,14 +133,27 @@ export function fetchStatusFail(id, error, skipLoading) { | |||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export function deleteStatus(id) { | ||||
| export function redraft(status) { | ||||
|   return { | ||||
|     type: REDRAFT, | ||||
|     status, | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export function deleteStatus(id, withRedraft = false) { | ||||
|   return (dispatch, getState) => { | ||||
|     const status = getState().getIn(['statuses', id]); | ||||
| 
 | ||||
|     dispatch(deleteStatusRequest(id)); | ||||
| 
 | ||||
|     api(getState).delete(`/api/v1/statuses/${id}`).then(() => { | ||||
|       evictStatus(id); | ||||
|       dispatch(deleteStatusSuccess(id)); | ||||
|       dispatch(deleteFromTimelines(id)); | ||||
| 
 | ||||
|       if (withRedraft) { | ||||
|         dispatch(redraft(status)); | ||||
|       } | ||||
|     }).catch(error => { | ||||
|       dispatch(deleteStatusFail(id, error)); | ||||
|     }); | ||||
|  |  | |||
|  | @ -9,6 +9,7 @@ import { me } from '../initial_state'; | |||
| 
 | ||||
| const messages = defineMessages({ | ||||
|   delete: { id: 'status.delete', defaultMessage: 'Delete' }, | ||||
|   redraft: { id: 'status.redraft', defaultMessage: 'Delete & re-draft' }, | ||||
|   direct: { id: 'status.direct', defaultMessage: 'Direct message @{name}' }, | ||||
|   mention: { id: 'status.mention', defaultMessage: 'Mention @{name}' }, | ||||
|   mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' }, | ||||
|  | @ -88,6 +89,10 @@ export default class StatusActionBar extends ImmutablePureComponent { | |||
|     this.props.onDelete(this.props.status); | ||||
|   } | ||||
| 
 | ||||
|   handleRedraftClick = () => { | ||||
|     this.props.onDelete(this.props.status, true); | ||||
|   } | ||||
| 
 | ||||
|   handlePinClick = () => { | ||||
|     this.props.onPin(this.props.status); | ||||
|   } | ||||
|  | @ -159,6 +164,7 @@ export default class StatusActionBar extends ImmutablePureComponent { | |||
|       } | ||||
| 
 | ||||
|       menu.push({ text: intl.formatMessage(messages.delete), action: this.handleDeleteClick }); | ||||
|       menu.push({ text: intl.formatMessage(messages.redraft), action: this.handleRedraftClick }); | ||||
|     } else { | ||||
|       menu.push({ text: intl.formatMessage(messages.mention, { name: status.getIn(['account', 'username']) }), action: this.handleMentionClick }); | ||||
|       menu.push({ text: intl.formatMessage(messages.direct, { name: status.getIn(['account', 'username']) }), action: this.handleDirectClick }); | ||||
|  |  | |||
|  | @ -33,6 +33,8 @@ import { showAlertForError } from '../actions/alerts'; | |||
| const messages = defineMessages({ | ||||
|   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, | ||||
|   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' }, | ||||
|   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' }, | ||||
|   redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? You will lose all replies, boosts and favourites to it.' }, | ||||
|   blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' }, | ||||
| }); | ||||
| 
 | ||||
|  | @ -91,14 +93,14 @@ const mapDispatchToProps = (dispatch, { intl }) => ({ | |||
|     })); | ||||
|   }, | ||||
| 
 | ||||
|   onDelete (status) { | ||||
|   onDelete (status, withRedraft = false) { | ||||
|     if (!deleteModal) { | ||||
|       dispatch(deleteStatus(status.get('id'))); | ||||
|       dispatch(deleteStatus(status.get('id'), withRedraft)); | ||||
|     } else { | ||||
|       dispatch(openModal('CONFIRM', { | ||||
|         message: intl.formatMessage(messages.deleteMessage), | ||||
|         confirm: intl.formatMessage(messages.deleteConfirm), | ||||
|         onConfirm: () => dispatch(deleteStatus(status.get('id'))), | ||||
|         message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage), | ||||
|         confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm), | ||||
|         onConfirm: () => dispatch(deleteStatus(status.get('id'), withRedraft)), | ||||
|       })); | ||||
|     } | ||||
|   }, | ||||
|  |  | |||
|  | @ -8,6 +8,7 @@ import { me } from '../../../initial_state'; | |||
| 
 | ||||
| const messages = defineMessages({ | ||||
|   delete: { id: 'status.delete', defaultMessage: 'Delete' }, | ||||
|   redraft: { id: 'status.redraft', defaultMessage: 'Delete & re-draft' }, | ||||
|   direct: { id: 'status.direct', defaultMessage: 'Direct message @{name}' }, | ||||
|   mention: { id: 'status.mention', defaultMessage: 'Mention @{name}' }, | ||||
|   reply: { id: 'status.reply', defaultMessage: 'Reply' }, | ||||
|  | @ -67,6 +68,10 @@ export default class ActionBar extends React.PureComponent { | |||
|     this.props.onDelete(this.props.status); | ||||
|   } | ||||
| 
 | ||||
|   handleRedraftClick = () => { | ||||
|     this.props.onDelete(this.props.status, true); | ||||
|   } | ||||
| 
 | ||||
|   handleDirectClick = () => { | ||||
|     this.props.onDirect(this.props.status.get('account'), this.context.router.history); | ||||
|   } | ||||
|  | @ -132,6 +137,7 @@ export default class ActionBar extends React.PureComponent { | |||
|       menu.push({ text: intl.formatMessage(mutingConversation ? messages.unmuteConversation : messages.muteConversation), action: this.handleConversationMuteClick }); | ||||
|       menu.push(null); | ||||
|       menu.push({ text: intl.formatMessage(messages.delete), action: this.handleDeleteClick }); | ||||
|       menu.push({ text: intl.formatMessage(messages.redraft), action: this.handleRedraftClick }); | ||||
|     } else { | ||||
|       menu.push({ text: intl.formatMessage(messages.mention, { name: status.getIn(['account', 'username']) }), action: this.handleMentionClick }); | ||||
|       menu.push({ text: intl.formatMessage(messages.direct, { name: status.getIn(['account', 'username']) }), action: this.handleDirectClick }); | ||||
|  |  | |||
|  | @ -47,6 +47,8 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from | |||
| const messages = defineMessages({ | ||||
|   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, | ||||
|   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' }, | ||||
|   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' }, | ||||
|   redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? You will lose all replies, boosts and favourites to it.' }, | ||||
|   blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' }, | ||||
|   revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' }, | ||||
|   hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' }, | ||||
|  | @ -172,16 +174,16 @@ export default class Status extends ImmutablePureComponent { | |||
|     } | ||||
|   } | ||||
| 
 | ||||
|   handleDeleteClick = (status) => { | ||||
|   handleDeleteClick = (status, withRedraft = false) => { | ||||
|     const { dispatch, intl } = this.props; | ||||
| 
 | ||||
|     if (!deleteModal) { | ||||
|       dispatch(deleteStatus(status.get('id'))); | ||||
|       dispatch(deleteStatus(status.get('id'), withRedraft)); | ||||
|     } else { | ||||
|       dispatch(openModal('CONFIRM', { | ||||
|         message: intl.formatMessage(messages.deleteMessage), | ||||
|         confirm: intl.formatMessage(messages.deleteConfirm), | ||||
|         onConfirm: () => dispatch(deleteStatus(status.get('id'))), | ||||
|         message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage), | ||||
|         confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm), | ||||
|         onConfirm: () => dispatch(deleteStatus(status.get('id'), withRedraft)), | ||||
|       })); | ||||
|     } | ||||
|   } | ||||
|  |  | |||
|  | @ -32,6 +32,7 @@ import { | |||
| } from '../actions/compose'; | ||||
| import { TIMELINE_DELETE } from '../actions/timelines'; | ||||
| import { STORE_HYDRATE } from '../actions/store'; | ||||
| import { REDRAFT } from '../actions/statuses'; | ||||
| import { Map as ImmutableMap, List as ImmutableList, OrderedSet as ImmutableOrderedSet, fromJS } from 'immutable'; | ||||
| import uuid from '../uuid'; | ||||
| import { me } from '../initial_state'; | ||||
|  | @ -170,6 +171,18 @@ const hydrate = (state, hydratedState) => { | |||
|   return state; | ||||
| }; | ||||
| 
 | ||||
| const domParser = new DOMParser(); | ||||
| 
 | ||||
| const htmlToText = status => { | ||||
|   const fragment = domParser.parseFromString(status.get('content'), 'text/html').documentElement; | ||||
| 
 | ||||
|   status.get('mentions').forEach(mention => { | ||||
|     fragment.querySelector(`a[href="${mention.get('url')}"]`).textContent = `@${mention.get('acct')}`; | ||||
|   }); | ||||
| 
 | ||||
|   return fragment.textContent; | ||||
| }; | ||||
| 
 | ||||
| export default function compose(state = initialState, action) { | ||||
|   switch(action.type) { | ||||
|   case STORE_HYDRATE: | ||||
|  | @ -301,6 +314,24 @@ export default function compose(state = initialState, action) { | |||
| 
 | ||||
|         return item; | ||||
|       })); | ||||
|   case REDRAFT: | ||||
|     return state.withMutations(map => { | ||||
|       map.set('text', htmlToText(action.status)); | ||||
|       map.set('in_reply_to', action.status.get('in_reply_to_id')); | ||||
|       map.set('privacy', action.status.get('visibility')); | ||||
|       map.set('media_attachments', action.status.get('media_attachments')); | ||||
|       map.set('focusDate', new Date()); | ||||
|       map.set('caretPosition', null); | ||||
|       map.set('idempotencyKey', uuid()); | ||||
| 
 | ||||
|       if (action.status.get('spoiler_text').length > 0) { | ||||
|         map.set('spoiler', true); | ||||
|         map.set('spoiler_text', action.status.get('spoiler_text')); | ||||
|       } else { | ||||
|         map.set('spoiler', false); | ||||
|         map.set('spoiler_text', ''); | ||||
|       } | ||||
|     }); | ||||
|   default: | ||||
|     return state; | ||||
|   } | ||||
|  |  | |||
|  | @ -52,7 +52,7 @@ class Status < ApplicationRecord | |||
|   has_many :reblogs, foreign_key: 'reblog_of_id', class_name: 'Status', inverse_of: :reblog, dependent: :destroy | ||||
|   has_many :replies, foreign_key: 'in_reply_to_id', class_name: 'Status', inverse_of: :thread | ||||
|   has_many :mentions, dependent: :destroy | ||||
|   has_many :media_attachments, dependent: :destroy | ||||
|   has_many :media_attachments, dependent: :nullify | ||||
| 
 | ||||
|   has_and_belongs_to_many :tags | ||||
|   has_and_belongs_to_many :preview_cards | ||||
|  |  | |||
		Reference in a new issue