Added shortcuts

• Added:
- shortcuts functionality
- shortcuts route, controller, model
- shortcut error message for "exists"
- shortcut redux
- EditShortcutsModal, constant
- links to sidebar, sidebar_xs
- options to add/remove group, account in GroupOptionsPopover, ProfileOptionsPopover
- shortcuts page, feature/list
This commit is contained in:
mgabdev
2020-07-21 22:24:26 -05:00
parent 405ace09da
commit f92f75d747
20 changed files with 705 additions and 107 deletions

View File

@@ -6,9 +6,12 @@ import {
MODAL_GROUP_MEMBERS,
MODAL_GROUP_REMOVED_ACCOUNTS,
} from '../../constants'
import {
addShortcut,
removeShortcut,
} from '../../actions/shortcuts'
import { openModal } from '../../actions/modal'
import { closePopover } from '../../actions/popover'
import { me } from '../../initial_state'
import PopoverLayout from './popover_layout'
import List from '../list'
@@ -16,7 +19,18 @@ const messages = defineMessages({
groupMembers: { id: 'group_members', defaultMessage: 'Group members' },
removedMembers: { id: 'group_removed_members', defaultMessage: 'Removed accounts' },
editGroup: { id: 'edit_group', defaultMessage: 'Edit group' },
});
add_to_shortcuts: { id: 'account.add_to_shortcuts', defaultMessage: 'Add to shortcuts' },
remove_from_shortcuts: { id: 'account.remove_from_shortcuts', defaultMessage: 'Remove from shortcuts' },
})
const mapStateToProps = (state, { group }) => {
const groupId = group ? group.get('id') : null
const shortcuts = state.getIn(['shortcuts', 'items'])
const isShortcut = !!shortcuts.find((s) => {
return s.get('shortcut_id') == groupId && s.get('shortcut_type') === 'group'
})
return { isShortcut }
}
const mapDispatchToProps = (dispatch) => ({
@@ -24,38 +38,43 @@ const mapDispatchToProps = (dispatch) => ({
dispatch(closePopover())
dispatch(openModal(MODAL_GROUP_CREATE, { groupId }))
},
onOpenRemovedMembers(groupId) {
dispatch(closePopover())
dispatch(openModal(MODAL_GROUP_REMOVED_ACCOUNTS, { groupId }))
},
onOpenGroupMembers(groupId) {
dispatch(closePopover())
dispatch(openModal(MODAL_GROUP_MEMBERS, { groupId }))
},
onClosePopover: () => dispatch(closePopover()),
onAddShortcut(groupId) {
dispatch(addShortcut('group', groupId))
},
onRemoveShortcut(groupId) {
dispatch(removeShortcut(null, 'group', groupId))
},
onClosePopover: () => dispatch(closePopover())
});
})
export default
@injectIntl
@connect(null, mapDispatchToProps)
@connect(mapStateToProps, mapDispatchToProps)
class GroupOptionsPopover extends ImmutablePureComponent {
static defaultProps = {
group: ImmutablePropTypes.map.isRequired,
isAdmin: PropTypes.bool,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
isShortcut: PropTypes.bool,
onAddShortcut: PropTypes.func.isRequired,
onRemoveShortcut: PropTypes.func.isRequired,
onClosePopover: PropTypes.func.isRequired,
onOpenEditGroup: PropTypes.func.isRequired,
onOpenGroupMembers: PropTypes.func.isRequired,
onOpenRemovedMembers: PropTypes.func.isRequired,
}
updateOnProps = ['group']
handleEditGroup = () => {
this.props.onOpenEditGroup(this.props.group.get('id'))
}
@@ -72,8 +91,22 @@ class GroupOptionsPopover extends ImmutablePureComponent {
this.props.onClosePopover()
}
handleOnToggleShortcut = () => {
this.handleOnClosePopover()
if (this.props.isShortcut) {
this.props.onRemoveShortcut(this.props.group.get('id'))
} else {
this.props.onAddShortcut(this.props.group.get('id'))
}
}
render() {
const { intl, isXS } = this.props
const {
intl,
isAdmin,
isShortcut,
isXS,
} = this.props
const listItems = [
{
@@ -81,24 +114,33 @@ class GroupOptionsPopover extends ImmutablePureComponent {
icon: 'group',
title: intl.formatMessage(messages.groupMembers),
onClick: this.handleOnOpenGroupMembers,
isHidden: !isAdmin,
},
{
hideArrow: true,
icon: 'block',
title: intl.formatMessage(messages.removedMembers),
onClick: this.handleOnOpenRemovedMembers,
isHidden: !isAdmin,
},
{
hideArrow: true,
icon: 'pencil',
title: intl.formatMessage(messages.editGroup),
onClick: this.handleEditGroup,
}
isHidden: !isAdmin,
},
{
hideArrow: true,
icon: 'star',
title: intl.formatMessage(isShortcut ? messages.remove_from_shortcuts : messages.add_to_shortcuts),
onClick: this.handleOnToggleShortcut,
},
]
return (
<PopoverLayout
width={210}
width={240}
isXS={isXS}
onClose={this.handleOnClosePopover}
>

View File

@@ -2,23 +2,22 @@ import { defineMessages, injectIntl } from 'react-intl'
import {
followAccount,
unfollowAccount,
blockAccount,
unblockAccount,
unmuteAccount,
pinAccount,
unpinAccount,
} from '../../actions/accounts'
import {
mentionCompose,
} from '../../actions/compose'
import { muteAccount } from '../../actions/accounts'
import {
addShortcut,
removeShortcut,
} from '../../actions/shortcuts'
import { initReport } from '../../actions/reports'
import { openModal } from '../../actions/modal'
import { closePopover } from '../../actions/popover'
import { unfollowModal, autoPlayGif, me, isStaff } from '../../initial_state'
import { unfollowModal, me, isStaff } from '../../initial_state'
import { makeGetAccount } from '../../selectors'
import PopoverLayout from './popover_layout'
import Text from '../text'
import List from '../list'
const messages = defineMessages({
@@ -44,23 +43,27 @@ const messages = defineMessages({
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
admin_account: { id: 'admin_account', defaultMessage: 'Open moderation interface' },
add_to_list: { id: 'lists.account.add', defaultMessage: 'Add to list' },
add_or_remove_from_shortcuts: { id: 'account.add_or_remove_from_shortcuts', defaultMessage: 'Add or Remove from shortcuts' },
add_to_shortcuts: { id: 'account.add_to_shortcuts', defaultMessage: 'Add to shortcuts' },
remove_from_shortcuts: { id: 'account.remove_from_shortcuts', defaultMessage: 'Remove from shortcuts' },
accountBlocked: { id: 'account.blocked', defaultMessage: 'Blocked' },
accountMuted: { id: 'account.muted', defaultMessage: 'Muted' },
});
const makeMapStateToProps = () => {
const getAccount = makeGetAccount();
const mapStateToProps = (state, { account }) => {
const getAccount = makeGetAccount()
const accountId = !!account ? account.get('id') : -1
const shortcuts = state.getIn(['shortcuts', 'items'])
const isShortcut = !!shortcuts.find((s) => {
return s.get('shortcut_id') == accountId && s.get('shortcut_type') === 'account'
})
const mapStateToProps = (state, { account }) => ({
account: getAccount(state, !!account ? account.get('id') : -1),
});
return mapStateToProps;
};
return {
isShortcut,
account: getAccount(state, accountId),
}
}
const mapDispatchToProps = (dispatch, { intl }) => ({
onFollow(account) {
if (account.getIn(['relationship', 'following']) || account.getIn(['relationship', 'requested'])) {
if (unfollowModal) {
@@ -74,7 +77,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(followAccount(account.get('id')))
}
},
onBlock(account) {
dispatch(closePopover())
@@ -86,12 +88,10 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
}));
}
},
onMention(account) {
dispatch(closePopover())
dispatch(mentionCompose(account));
},
onRepostToggle(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'showing_reblogs'])) {
@@ -100,12 +100,10 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(followAccount(account.get('id'), true));
}
},
onReport(account) {
dispatch(closePopover())
dispatch(initReport(account));
},
onMute(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'muting'])) {
@@ -116,30 +114,39 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
}))
}
},
onAddToList(account) {
dispatch(closePopover())
dispatch(openModal('LIST_ADD_USER', {
accountId: account.get('id'),
}));
},
onClosePopover: () => dispatch(closePopover()),
});
onAddShortcut(accountId) {
dispatch(closePopover())
dispatch(addShortcut('account', accountId))
},
onRemoveShortcut(accountId) {
dispatch(closePopover())
dispatch(removeShortcut(null, 'account', accountId))
},
})
export default
@injectIntl
@connect(makeMapStateToProps, mapDispatchToProps)
@connect(mapStateToProps, mapDispatchToProps)
class ProfileOptionsPopover extends PureComponent {
static defaultProps = {
isXS: PropTypes.bool,
isShortcut: PropTypes.bool,
}
makeMenu() {
const { account, intl } = this.props;
const {
account,
intl,
isShortcut,
} = this.props;
let menu = [];
@@ -208,12 +215,12 @@ class ProfileOptionsPopover extends PureComponent {
// onClick: this.handleAddToList
// })
// menu.push({
// hideArrow: true,
// icon: 'circle',
// title: intl.formatMessage(messages.add_or_remove_from_shortcuts),
// onClick: this.handleAddToShortcuts
// })
menu.push({
hideArrow: true,
icon: 'star',
title: intl.formatMessage(isShortcut ? messages.remove_from_shortcuts : messages.add_to_shortcuts),
onClick: this.handleToggleShortcuts,
})
if (isStaff) {
menu.push({
@@ -259,8 +266,12 @@ class ProfileOptionsPopover extends PureComponent {
this.props.onAddToList(this.props.account);
}
handleAddToShortcuts = () => {
// : todo :
handleToggleShortcuts = () => {
if (this.props.isShortcut) {
this.props.onRemoveShortcut(this.props.account.get('id'))
} else {
this.props.onAddShortcut(this.props.account.get('id'))
}
}
handleOnClosePopover = () => {