Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Add confirmation modal when closing media edit modal with unsaved changes (#16518)

Browse source 
* Add confirmation modal when closing media edit modal with unsaved changes

* Move focal point media state to redux so it does not get erased by confirmation dialog

* Change upload modal behavior to keep it open while saving changes

Instead of closing it immediately and losing changes if they fail to save…

* Make it work with react-intl 2.9
This commit is contained in:
Claire 2021-07-25 01:14:43 +02:00 • committed by GitHub
parent af08229ff4
commit a8a7066e97
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 142 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/javascript/mastodon/reducers/compose.js
View file

@ -39,6 +39,9 @@ import {
COMPOSE_POLL_OPTION_CHANGE,
COMPOSE_POLL_OPTION_REMOVE,
COMPOSE_POLL_SETTINGS_CHANGE,
INIT_MEDIA_EDIT_MODAL,
COMPOSE_CHANGE_MEDIA_DESCRIPTION,
COMPOSE_CHANGE_MEDIA_FOCUS,
} from '../actions/compose';
import { TIMELINE_DELETE } from '../actions/timelines';
import { STORE_HYDRATE } from '../actions/store';
@ -76,6 +79,13 @@ const initialState = ImmutableMap({
resetFileKey: Math.floor((Math.random() * 0x10000)),
idempotencyKey: null,
tagHistory: ImmutableList(),
media_modal: ImmutableMap({
id: null,
description: '',
focusX: 0,
focusY: 0,
dirty: false,
}),
});
const initialPoll = ImmutableMap({
@ -354,6 +364,19 @@ export default function compose(state = initialState, action) {
return item;
}));
case INIT_MEDIA_EDIT_MODAL:
const media = state.get('media_attachments').find(item => item.get('id') === action.id);
return state.set('media_modal', ImmutableMap({
id: action.id,
description: media.get('description') || '',
focusX: media.getIn(['meta', 'focus', 'x'], 0),
focusY: media.getIn(['meta', 'focus', 'y'], 0),
dirty: false,
}));
case COMPOSE_CHANGE_MEDIA_DESCRIPTION:
return state.setIn(['media_modal', 'description'], action.description).setIn(['media_modal', 'dirty'], true);
case COMPOSE_CHANGE_MEDIA_FOCUS:
return state.setIn(['media_modal', 'focusX'], action.focusX).setIn(['media_modal', 'focusY'], action.focusY).setIn(['media_modal', 'dirty'], true);
case COMPOSE_MENTION:
return state.withMutations(map => {
map.update('text', text => [text.trim(), `@${action.account.get('acct')} `].filter((str) => str.length !== 0).join(' '));
@ -390,6 +413,7 @@ export default function compose(state = initialState, action) {
case COMPOSE_UPLOAD_CHANGE_SUCCESS:
return state
.set('is_changing_upload', false)
.setIn(['media_modal', 'dirty'], false)
.update('media_attachments', list => list.map(item => {
if (item.get('id') === action.media.id) {
return fromJS(action.media);