namekuji/chuckya
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

cleanup frontend emoji reaction code

Browse source
This commit is contained in:
fef 2022-11-29 08:54:35 +00:00 • committed by Jeremy Kescher
parent da177d6c9d
commit 622e384aa4
No known key found for this signature in database
GPG key ID: 80A419A7A613DFA4
11 changed files with 64 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
app/javascript/flavours/glitch/actions/interactions.js
View file

@ -42,15 +42,15 @@ export const UNBOOKMARK_REQUEST = 'UNBOOKMARKED_REQUEST';
export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS'; export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS';
export const UNBOOKMARK_FAIL = 'UNBOOKMARKED_FAIL'; export const UNBOOKMARK_FAIL = 'UNBOOKMARKED_FAIL';
export const STATUS_REACTION_UPDATE = 'STATUS_REACTION_UPDATE'; export const REACTION_UPDATE = 'REACTION_UPDATE';
export const STATUS_REACTION_ADD_REQUEST = 'STATUS_REACTION_ADD_REQUEST'; export const REACTION_ADD_REQUEST = 'REACTION_ADD_REQUEST';
export const STATUS_REACTION_ADD_SUCCESS = 'STATUS_REACTION_ADD_SUCCESS'; export const REACTION_ADD_SUCCESS = 'REACTION_ADD_SUCCESS';
export const STATUS_REACTION_ADD_FAIL = 'STATUS_REACTION_ADD_FAIL'; export const REACTION_ADD_FAIL = 'REACTION_ADD_FAIL';
export const STATUS_REACTION_REMOVE_REQUEST = 'STATUS_REACTION_REMOVE_REQUEST'; export const REACTION_REMOVE_REQUEST = 'REACTION_REMOVE_REQUEST';
export const STATUS_REACTION_REMOVE_SUCCESS = 'STATUS_REACTION_REMOVE_SUCCESS'; export const REACTION_REMOVE_SUCCESS = 'REACTION_REMOVE_SUCCESS';
export const STATUS_REACTION_REMOVE_FAIL = 'STATUS_REACTION_REMOVE_FAIL'; export const REACTION_REMOVE_FAIL = 'REACTION_REMOVE_FAIL';
export function reblog(status, visibility) { export function reblog(status, visibility) {
return function (dispatch, getState) { return function (dispatch, getState) {
@ -404,7 +404,7 @@ export function unpinFail(status, error) {
}; };
}; };
export const statusAddReaction = (statusId, name) => (dispatch, getState) => { export const addReaction = (statusId, name) => (dispatch, getState) => {
const status = getState().get('statuses').get(statusId); const status = getState().get('statuses').get(statusId);
let alreadyAdded = false; let alreadyAdded = false;
if (status) { if (status) {
@ -414,66 +414,66 @@ export const statusAddReaction = (statusId, name) => (dispatch, getState) => {
} }
} }
if (!alreadyAdded) { if (!alreadyAdded) {
dispatch(statusAddReactionRequest(statusId, name, alreadyAdded)); dispatch(addReactionRequest(statusId, name, alreadyAdded));
} }
api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => { api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
dispatch(statusAddReactionSuccess(statusId, name, alreadyAdded)); dispatch(addReactionSuccess(statusId, name, alreadyAdded));
}).catch(err => { }).catch(err => {
if (!alreadyAdded) { if (!alreadyAdded) {
dispatch(statusAddReactionFail(statusId, name, err)); dispatch(addReactionFail(statusId, name, err));
} }
}); });
}; };
export const statusAddReactionRequest = (statusId, name) => ({ export const addReactionRequest = (statusId, name) => ({
type: STATUS_REACTION_ADD_REQUEST, type: REACTION_ADD_REQUEST,
id: statusId, id: statusId,
name, name,
skipLoading: true, skipLoading: true,
}); });
export const statusAddReactionSuccess = (statusId, name) => ({ export const addReactionSuccess = (statusId, name) => ({
type: STATUS_REACTION_ADD_SUCCESS, type: REACTION_ADD_SUCCESS,
id: statusId, id: statusId,
name, name,
skipLoading: true, skipLoading: true,
}); });
export const statusAddReactionFail = (statusId, name, error) => ({ export const addReactionFail = (statusId, name, error) => ({
type: STATUS_REACTION_ADD_FAIL, type: REACTION_ADD_FAIL,
id: statusId, id: statusId,
name, name,
error, error,
skipLoading: true, skipLoading: true,
}); });
export const statusRemoveReaction = (statusId, name) => (dispatch, getState) => { export const removeReaction = (statusId, name) => (dispatch, getState) => {
dispatch(statusRemoveReactionRequest(statusId, name)); dispatch(removeReactionRequest(statusId, name));
api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => { api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
dispatch(statusRemoveReactionSuccess(statusId, name)); dispatch(removeReactionSuccess(statusId, name));
}).catch(err => { }).catch(err => {
dispatch(statusRemoveReactionFail(statusId, name, err)); dispatch(removeReactionFail(statusId, name, err));
}); });
}; };
export const statusRemoveReactionRequest = (statusId, name) => ({ export const removeReactionRequest = (statusId, name) => ({
type: STATUS_REACTION_REMOVE_REQUEST, type: REACTION_REMOVE_REQUEST,
id: statusId, id: statusId,
name, name,
skipLoading: true, skipLoading: true,
}); });
export const statusRemoveReactionSuccess = (statusId, name) => ({ export const removeReactionSuccess = (statusId, name) => ({
type: STATUS_REACTION_REMOVE_SUCCESS, type: REACTION_REMOVE_SUCCESS,
id: statusId, id: statusId,
name, name,
skipLoading: true, skipLoading: true,
}); });
export const statusRemoveReactionFail = (statusId, name) => ({ export const removeReactionFail = (statusId, name) => ({
type: STATUS_REACTION_REMOVE_FAIL, type: REACTION_REMOVE_FAIL,
id: statusId, id: statusId,
name, name,
skipLoading: true, skipLoading: true,

4
app/javascript/flavours/glitch/components/status.jsx
View file

@ -25,7 +25,7 @@ import StatusContent from './status_content';
import StatusHeader from './status_header'; import StatusHeader from './status_header';
import StatusIcons from './status_icons'; import StatusIcons from './status_icons';
import StatusPrepend from './status_prepend'; import StatusPrepend from './status_prepend';
import StatusReactionsBar from './status_reactions_bar'; import StatusReactions from './status_reactions';
const domParser = new DOMParser(); const domParser = new DOMParser();
@ -837,7 +837,7 @@ class Status extends ImmutablePureComponent {
rewriteMentions={settings.get('rewrite_mentions')} rewriteMentions={settings.get('rewrite_mentions')}
/> />
<StatusReactionsBar <StatusReactions
statusId={status.get('id')} statusId={status.get('id')}
reactions={status.get('reactions')} reactions={status.get('reactions')}
addReaction={this.props.onReactionAdd} addReaction={this.props.onReactionAdd}

1
app/javascript/flavours/glitch/components/status_action_bar.jsx
View file

@ -64,6 +64,7 @@ class StatusActionBar extends ImmutablePureComponent {
status: ImmutablePropTypes.map.isRequired, status: ImmutablePropTypes.map.isRequired,
onReply: PropTypes.func, onReply: PropTypes.func,
onFavourite: PropTypes.func, onFavourite: PropTypes.func,
onReactionAdd: PropTypes.func,
onReblog: PropTypes.func, onReblog: PropTypes.func,
onDelete: PropTypes.func, onDelete: PropTypes.func,
onDirect: PropTypes.func, onDirect: PropTypes.func,

2
app/javascript/flavours/glitch/components/status_reactions_bar.js → app/javascript/flavours/glitch/components/status_reactions.js
View file

@ -11,7 +11,7 @@ import AnimatedNumber from './animated_number';
import { assetHost } from '../utils/config'; import { assetHost } from '../utils/config';
import { autoPlayGif } from '../initial_state'; import { autoPlayGif } from '../initial_state';
export default class StatusReactionsBar extends ImmutablePureComponent { export default class StatusReactions extends ImmutablePureComponent {
static propTypes = { static propTypes = {
statusId: PropTypes.string.isRequired, statusId: PropTypes.string.isRequired,

12
app/javascript/flavours/glitch/containers/status_container.js
View file

@ -21,8 +21,8 @@ import {
unbookmark, unbookmark,
pin, pin,
unpin, unpin,
statusAddReaction, addReaction,
statusRemoveReaction, removeReaction,
} from 'flavours/glitch/actions/interactions'; } from 'flavours/glitch/actions/interactions';
import { changeLocalSetting } from 'flavours/glitch/actions/local_settings'; import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
import { openModal } from 'flavours/glitch/actions/modal'; import { openModal } from 'flavours/glitch/actions/modal';
@ -47,7 +47,7 @@ import { showAlertForError } from '../actions/alerts';
import AccountContainer from 'flavours/glitch/containers/account_container'; import AccountContainer from 'flavours/glitch/containers/account_container';
import Spoilers from '../components/spoilers'; import Spoilers from '../components/spoilers';
import Icon from 'flavours/glitch/components/icon'; import Icon from 'flavours/glitch/components/icon';
import buildCustomEmojiMap from '../utils/emoji_map'; import { makeCustomEmojiMap } from '../selectors';
const messages = defineMessages({ const messages = defineMessages({
deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@ -91,7 +91,7 @@ const makeMapStateToProps = () => {
account: account || props.account, account: account || props.account,
settings: state.get('local_settings'), settings: state.get('local_settings'),
prepend: prepend || props.prepend, prepend: prepend || props.prepend,
emojiMap: buildCustomEmojiMap(state), emojiMap: makeCustomEmojiMap(state),
pictureInPicture: getPictureInPicture(state, props), pictureInPicture: getPictureInPicture(state, props),
}; };
}; };
@ -181,11 +181,11 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
}, },
onReactionAdd (statusId, name) { onReactionAdd (statusId, name) {
dispatch(statusAddReaction(statusId, name)); dispatch(addReaction(statusId, name));
}, },
onReactionRemove (statusId, name) { onReactionRemove (statusId, name) {
dispatch(statusRemoveReaction(statusId, name)); dispatch(removeReaction(statusId, name));
}, },
onEmbed (status) { onEmbed (status) {

2
app/javascript/flavours/glitch/features/status/components/action_bar.jsx
View file

@ -147,7 +147,7 @@ class ActionBar extends PureComponent {
navigator.clipboard.writeText(url); navigator.clipboard.writeText(url);
}; };
nop = () => {} nop = () => {} // hack for reaction add button
render () { render () {
const { status, intl } = this.props; const { status, intl } = this.props;

4
app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
View file

@ -17,7 +17,7 @@ import { Icon } from 'flavours/glitch/components/icon';
import MediaGallery from 'flavours/glitch/components/media_gallery'; import MediaGallery from 'flavours/glitch/components/media_gallery';
import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder'; import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
import StatusContent from 'flavours/glitch/components/status_content'; import StatusContent from 'flavours/glitch/components/status_content';
import StatusReactionsBar from '../../../components/status_reactions_bar'; import StatusReactions from '../../../components/status_reactions';
import VisibilityIcon from 'flavours/glitch/components/status_visibility_icon'; import VisibilityIcon from 'flavours/glitch/components/status_visibility_icon';
import PollContainer from 'flavours/glitch/containers/poll_container'; import PollContainer from 'flavours/glitch/containers/poll_container';
import Audio from 'flavours/glitch/features/audio'; import Audio from 'flavours/glitch/features/audio';
@ -333,7 +333,7 @@ class DetailedStatus extends ImmutablePureComponent {
disabled disabled
/> />
<StatusReactionsBar <StatusReactions
statusId={status.get('id')} statusId={status.get('id')}
reactions={status.get('reactions')} reactions={status.get('reactions')}
addReaction={this.props.onReactionAdd} addReaction={this.props.onReactionAdd}

17
app/javascript/flavours/glitch/features/status/index.jsx
View file

@ -29,8 +29,8 @@ import {
unreblog, unreblog,
pin, pin,
unpin, unpin,
statusAddReaction, addReaction,
statusRemoveReaction, removeReaction,
} from 'flavours/glitch/actions/interactions'; } from 'flavours/glitch/actions/interactions';
import { changeLocalSetting } from 'flavours/glitch/actions/local_settings'; import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
import { openModal } from 'flavours/glitch/actions/modal'; import { openModal } from 'flavours/glitch/actions/modal';
@ -64,7 +64,7 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from
import ActionBar from './components/action_bar'; import ActionBar from './components/action_bar';
import DetailedStatus from './components/detailed_status'; import DetailedStatus from './components/detailed_status';
import buildCustomEmojiMap from '../../utils/emoji_map'; import { makeCustomEmojiMap } from '../../selectors';
const messages = defineMessages({ const messages = defineMessages({
deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@ -158,7 +158,7 @@ const makeMapStateToProps = () => {
askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0, askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0,
domain: state.getIn(['meta', 'domain']), domain: state.getIn(['meta', 'domain']),
pictureInPicture: getPictureInPicture(state, { id: props.params.statusId }), pictureInPicture: getPictureInPicture(state, { id: props.params.statusId }),
emojiMap: buildCustomEmojiMap(state), emojiMap: makeCustomEmojiMap(state),
}; };
}; };
@ -321,7 +321,7 @@ class Status extends ImmutablePureComponent {
const { signedIn } = this.context.identity; const { signedIn } = this.context.identity;
if (signedIn) { if (signedIn) {
dispatch(statusAddReaction(statusId, name)); dispatch(addReaction(statusId, name));
} else { } else {
dispatch(openModal('INTERACTION', { dispatch(openModal('INTERACTION', {
type: 'reaction_add', type: 'reaction_add',
@ -332,12 +332,7 @@ class Status extends ImmutablePureComponent {
} }
handleReactionRemove = (statusId, name) => { handleReactionRemove = (statusId, name) => {
const { dispatch } = this.props; this.props.dispatch(removeReaction(statusId, name));
const { signedIn } = this.context.identity;
if (signedIn) {
dispatch(statusRemoveReaction(statusId, name));
}
} }
handlePin = (status) => { handlePin = (status) => {

20
app/javascript/flavours/glitch/reducers/statuses.js
View file

@ -8,11 +8,11 @@ import {
UNFAVOURITE_SUCCESS, UNFAVOURITE_SUCCESS,
BOOKMARK_REQUEST, BOOKMARK_REQUEST,
BOOKMARK_FAIL, BOOKMARK_FAIL,
STATUS_REACTION_UPDATE, REACTION_UPDATE,
STATUS_REACTION_ADD_FAIL, REACTION_ADD_FAIL,
STATUS_REACTION_REMOVE_FAIL, REACTION_REMOVE_FAIL,
STATUS_REACTION_ADD_REQUEST, REACTION_ADD_REQUEST,
STATUS_REACTION_REMOVE_REQUEST, REACTION_REMOVE_REQUEST,
} from 'flavours/glitch/actions/interactions'; } from 'flavours/glitch/actions/interactions';
import { import {
STATUS_MUTE_SUCCESS, STATUS_MUTE_SUCCESS,
@ -123,13 +123,13 @@ export default function statuses(state = initialState, action) {
return state.setIn([action.status.get('id'), 'reblogged'], true); return state.setIn([action.status.get('id'), 'reblogged'], true);
case REBLOG_FAIL: case REBLOG_FAIL:
return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false); return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false);
case STATUS_REACTION_UPDATE: case REACTION_UPDATE:
return updateReactionCount(state, action.reaction); return updateReactionCount(state, action.reaction);
case STATUS_REACTION_ADD_REQUEST: case REACTION_ADD_REQUEST:
case STATUS_REACTION_REMOVE_FAIL: case REACTION_REMOVE_FAIL:
return addReaction(state, action.id, action.name); return addReaction(state, action.id, action.name);
case STATUS_REACTION_REMOVE_REQUEST: case REACTION_REMOVE_REQUEST:
case STATUS_REACTION_ADD_FAIL: case REACTION_ADD_FAIL:
return removeReaction(state, action.id, action.name); return removeReaction(state, action.id, action.name);
case STATUS_MUTE_SUCCESS: case STATUS_MUTE_SUCCESS:
return state.setIn([action.id, 'muted'], true); return state.setIn([action.id, 'muted'], true);

8
app/javascript/flavours/glitch/selectors/index.js
View file

@ -141,3 +141,11 @@ export const getAccountHidden = createSelector([
export const getStatusList = createSelector([ export const getStatusList = createSelector([
(state, type) => state.getIn(['status_lists', type, 'items']), (state, type) => state.getIn(['status_lists', type, 'items']),
], (items) => items.toList()); ], (items) => items.toList());
export const makeCustomEmojiMap = createSelector(
[state => state.get('custom_emojis')],
items => items.reduce(
(map, emoji) => map.set(emoji.get('shortcode'), emoji),
ImmutableMap(),
),
);

11
app/javascript/flavours/glitch/utils/emoji_map.js
View file

@ -1,11 +0,0 @@
import { createSelector } from 'reselect';
import { Map as ImmutableMap } from 'immutable';
const buildCustomEmojiMap = createSelector(
[state => state.get('custom_emojis')],
items => items.reduce(
(map, emoji) => map.set(emoji.get('shortcode'), emoji),
ImmutableMap(),
),
);
export default buildCustomEmojiMap;