random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Finished updating the reformatting of propTypes and set redux, intl functions to end of component

Browse Source 
• Finished:
- updating the reformatting of propTypes and set redux, intl functions to end of component

• Removed:
- Gif implementation
This commit is contained in:
mgabdev
2020-08-18 19:22:15 -05:00
parent e21a6ff897
commit 99982c0391
102 changed files with 2540 additions and 3285 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
app/javascript/gabsocial/components/popover/comment_sorting_options_popover.js
View File

@@ -12,41 +12,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
oldest: { id: 'comment_sort.oldest', defaultMessage: 'Oldest' },
oldestSubtitle: { id: 'comment_sort.oldest.subtitle', defaultMessage: 'Show all comments, with the oldest comments first.' },
newest: { id: 'comment_sort.newest', defaultMessage: 'Recent' },
newestSubtitle: { id: 'comment_sort.newest.subtitle', defaultMessage: 'Show all comments, with the newest comments first.' },
top: { id: 'comment_sort.top', defaultMessage: 'Most Liked' },
topSubtitle: { id: 'comment_sort.top.subtitle', defaultMessage: 'Show all comments, with the most liked top-level comments first.' },
})
const mapStateToProps = (state) => ({
commentSorting: state.getIn(['settings', 'commentSorting']),
})
const mapDispatchToProps = (dispatch) => ({
onSetCommentSortingSetting(type) {
dispatch(changeSetting(['commentSorting'], type))
dispatch(saveSettings())
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class CommentSortingOptionsPopover extends React.PureComponent {
static propTypes = {
commentSorting: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSetCommentSortingSetting: PropTypes.func.isRequired,
}
handleOnClick = (type) => {
this.props.onSetCommentSortingSetting(type)
}
@@ -100,4 +67,36 @@ class CommentSortingOptionsPopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
oldest: { id: 'comment_sort.oldest', defaultMessage: 'Oldest' },
oldestSubtitle: { id: 'comment_sort.oldest.subtitle', defaultMessage: 'Show all comments, with the oldest comments first.' },
newest: { id: 'comment_sort.newest', defaultMessage: 'Recent' },
newestSubtitle: { id: 'comment_sort.newest.subtitle', defaultMessage: 'Show all comments, with the newest comments first.' },
top: { id: 'comment_sort.top', defaultMessage: 'Most Liked' },
topSubtitle: { id: 'comment_sort.top.subtitle', defaultMessage: 'Show all comments, with the most liked top-level comments first.' },
})
const mapStateToProps = (state) => ({
commentSorting: state.getIn(['settings', 'commentSorting']),
})
const mapDispatchToProps = (dispatch) => ({
onSetCommentSortingSetting(type) {
dispatch(changeSetting(['commentSorting'], type))
dispatch(saveSettings())
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
CommentSortingOptionsPopover.propTypes = {
commentSorting: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSetCommentSortingSetting: PropTypes.func.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(CommentSortingOptionsPopover))

70
app/javascript/gabsocial/components/popover/date_picker_popover.js
View File

@@ -15,42 +15,8 @@ import Text from '../text'
import '!style-loader!css-loader!react-datepicker/dist/react-datepicker.css'
const mapStateToProps = (state) => ({
date: state.getIn(['compose', 'scheduled_at']),
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
setScheduledAt (date, isPro) {
if (!isPro) {
dispatch(closePopover())
return dispatch(openModal(MODAL_PRO_UPGRADE))
}
dispatch(changeScheduledAt(date))
if (!date) {
dispatch(closePopover())
}
},
onClosePopover: () => dispatch(closePopover())
})
export default
@connect(mapStateToProps, mapDispatchToProps)
class DatePickerPopover extends React.PureComponent {
static propTypes = {
date: PropTypes.instanceOf(Date),
setScheduledAt: PropTypes.func.isRequired,
isPro: PropTypes.bool,
position: PropTypes.string,
small: PropTypes.bool,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
}
handleSetDate = (date) => {
this.props.setScheduledAt(date, this.props.isPro)
}
@@ -127,4 +93,38 @@ class DatePickerPopover extends React.PureComponent {
)
}
}
}
const mapStateToProps = (state) => ({
date: state.getIn(['compose', 'scheduled_at']),
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
setScheduledAt (date, isPro) {
if (!isPro) {
dispatch(closePopover())
return dispatch(openModal(MODAL_PRO_UPGRADE))
}
dispatch(changeScheduledAt(date))
if (!date) {
dispatch(closePopover())
}
},
onClosePopover: () => dispatch(closePopover())
})
DatePickerPopover.propTypes = {
date: PropTypes.instanceOf(Date),
setScheduledAt: PropTypes.func.isRequired,
isPro: PropTypes.bool,
position: PropTypes.string,
small: PropTypes.bool,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
}
export default connect(mapStateToProps, mapDispatchToProps)(DatePickerPopover)

101
app/javascript/gabsocial/components/popover/emoji_picker_popover.js
View File

@@ -109,27 +109,8 @@ const getCustomEmojis = createSelector([
return 0;
}));
@injectIntl
class EmojiPickerMenu extends ImmutablePureComponent {
static propTypes = {
customEmojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
loading: PropTypes.bool,
onClose: PropTypes.func.isRequired,
onPick: PropTypes.func.isRequired,
arrowOffsetLeft: PropTypes.string,
arrowOffsetTop: PropTypes.string,
intl: PropTypes.object.isRequired,
skinTone: PropTypes.number.isRequired,
onSkinTone: PropTypes.func.isRequired,
}
static defaultProps = {
loading: true,
frequentlyUsedEmojis: [],
}
getI18n = () => {
const { intl } = this.props
@@ -209,42 +190,28 @@ class EmojiPickerMenu extends ImmutablePureComponent {
}
const mapStateToProps = (state) => ({
customEmojis: getCustomEmojis(state),
skinTone: state.getIn(['settings', 'skinTone']),
frequentlyUsedEmojis: getFrequentlyUsedEmojis(state),
})
EmojiPickerMenu.propTypes = {
customEmojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
loading: PropTypes.bool,
onClose: PropTypes.func.isRequired,
onPick: PropTypes.func.isRequired,
arrowOffsetLeft: PropTypes.string,
arrowOffsetTop: PropTypes.string,
intl: PropTypes.object.isRequired,
skinTone: PropTypes.number.isRequired,
onSkinTone: PropTypes.func.isRequired,
}
const mapDispatchToProps = (dispatch) => ({
onClosePopover() {
dispatch(closePopover())
},
EmojiPickerMenu.defaultProps = {
loading: true,
frequentlyUsedEmojis: [],
}
onSkinTone: (skinTone) => {
dispatch(changeSetting(['skinTone'], skinTone))
},
injectIntl(EmojiPickerMenu)
onPickEmoji: (emoji) => {
dispatch(useEmoji(emoji))
dispatch(insertEmojiCompose(emoji, false))
},
})
export default
@connect(mapStateToProps, mapDispatchToProps)
class EmojiPickerPopover extends ImmutablePureComponent {
static propTypes = {
customEmojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
intl: PropTypes.object.isRequired,
onPickEmoji: PropTypes.func.isRequired,
onSkinTone: PropTypes.func.isRequired,
skinTone: PropTypes.number.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
state = {
loading: false,
}
@@ -300,3 +267,37 @@ class EmojiPickerPopover extends ImmutablePureComponent {
}
}
const mapStateToProps = (state) => ({
customEmojis: getCustomEmojis(state),
skinTone: state.getIn(['settings', 'skinTone']),
frequentlyUsedEmojis: getFrequentlyUsedEmojis(state),
})
const mapDispatchToProps = (dispatch) => ({
onClosePopover() {
dispatch(closePopover())
},
onSkinTone: (skinTone) => {
dispatch(changeSetting(['skinTone'], skinTone))
},
onPickEmoji: (emoji) => {
dispatch(useEmoji(emoji))
dispatch(insertEmojiCompose(emoji, false))
},
})
EmojiPickerPopover.propTypes = {
customEmojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
intl: PropTypes.object.isRequired,
onPickEmoji: PropTypes.func.isRequired,
onSkinTone: PropTypes.func.isRequired,
skinTone: PropTypes.number.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
export default connect(mapStateToProps, mapDispatchToProps)(EmojiPickerPopover)

14
app/javascript/gabsocial/components/popover/error_popover.js
View File

@@ -3,12 +3,7 @@ import PropTypes from 'prop-types'
import PopoverLayout from './popover_layout'
import ColumnIndicator from '../column_indicator'
export default class ErrorPopover extends React.PureComponent {
static defaultProps = {
isXS: PropTypes.bool,
onClose: PropTypes.func,
}
class ErrorPopover extends React.PureComponent {
render() {
const { isXS } = this.props
@@ -29,3 +24,10 @@ export default class ErrorPopover extends React.PureComponent {
}
}
ErrorPopover.defaultProps = {
isXS: PropTypes.bool,
onClose: PropTypes.func,
}
export default ErrorPopover

28
app/javascript/gabsocial/components/popover/group_list_sort_options_popover.js
View File

@@ -10,21 +10,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const mapDispatchToProps = (dispatch) => ({
onSortGroups: (tab, sortType) => dispatch(sortGroups(tab, sortType)),
onClosePopover:() => dispatch(closePopover()),
})
export default
@connect(null, mapDispatchToProps)
class GroupListSortOptionsPopover extends React.PureComponent {
static defaultProps = {
tab: PropTypes.string.isRequired,
onClosePopover: PropTypes.func.isRequired,
onSortGroups: PropTypes.func.isRequired,
}
handleOnSortGroup = (sortType) => {
this.props.onSortGroups(this.props.tab, sortType)
this.handleOnClosePopover()
@@ -67,4 +54,17 @@ class GroupListSortOptionsPopover extends React.PureComponent {
)
}
}
}
const mapDispatchToProps = (dispatch) => ({
onSortGroups: (tab, sortType) => dispatch(sortGroups(tab, sortType)),
onClosePopover:() => dispatch(closePopover()),
})
GroupListSortOptionsPopover.defaultProps = {
tab: PropTypes.string.isRequired,
onClosePopover: PropTypes.func.isRequired,
onSortGroups: PropTypes.func.isRequired,
}
export default connect(null, mapDispatchToProps)(GroupListSortOptionsPopover)

48
app/javascript/gabsocial/components/popover/group_member_options_popover.js
View File

@@ -9,31 +9,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const mapDispatchToProps = (dispatch) => ({
onUpdateRole(groupId, accountId, type) {
dispatch(closePopover())
dispatch(updateRole(groupId, accountId, type))
},
onCreateRemovedAccount(groupId, accountId) {
dispatch(closePopover())
dispatch(createRemovedAccount(groupId, accountId))
},
onClosePopover:() => dispatch(closePopover()),
})
export default
@connect(null, mapDispatchToProps)
class GroupMemberOptionsPopover extends React.PureComponent {
static defaultProps = {
accountId: PropTypes.string.isRequired,
groupId: PropTypes.string.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onCreateRemovedAccount: PropTypes.func.isRequired,
onUpdateRole: PropTypes.func.isRequired,
}
handleOnRemoveFromGroup = () => {
this.props.onCreateRemovedAccount(this.props.groupId, this.props.accountId)
}
@@ -79,4 +56,27 @@ class GroupMemberOptionsPopover extends React.PureComponent {
)
}
}
}
const mapDispatchToProps = (dispatch) => ({
onUpdateRole(groupId, accountId, type) {
dispatch(closePopover())
dispatch(updateRole(groupId, accountId, type))
},
onCreateRemovedAccount(groupId, accountId) {
dispatch(closePopover())
dispatch(createRemovedAccount(groupId, accountId))
},
onClosePopover:() => dispatch(closePopover()),
})
GroupMemberOptionsPopover.defaultProps = {
accountId: PropTypes.string.isRequired,
groupId: PropTypes.string.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onCreateRemovedAccount: PropTypes.func.isRequired,
onUpdateRole: PropTypes.func.isRequired,
}
export default connect(null, mapDispatchToProps)(GroupMemberOptionsPopover)

83
app/javascript/gabsocial/components/popover/group_options_popover.js
View File

@@ -12,49 +12,8 @@ import { closePopover } from '../../actions/popover'
import PopoverLayout from './popover_layout'
import List from '../list'
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) => ({
onClosePopover: () => dispatch(closePopover()),
onAddShortcut(groupId) {
dispatch(addShortcut('group', groupId))
},
onRemoveShortcut(groupId) {
dispatch(removeShortcut(null, 'group', groupId))
},
})
export default
@injectIntl
@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,
}
handleOnClosePopover = () => {
this.props.onClosePopover()
}
@@ -131,4 +90,44 @@ class GroupOptionsPopover extends ImmutablePureComponent {
)
}
}
}
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) => ({
onClosePopover: () => dispatch(closePopover()),
onAddShortcut(groupId) {
dispatch(addShortcut('group', groupId))
},
onRemoveShortcut(groupId) {
dispatch(removeShortcut(null, 'group', groupId))
},
})
GroupOptionsPopover.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,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(GroupOptionsPopover))

71
app/javascript/gabsocial/components/popover/group_timeline_sort_options_popover.js
View File

@@ -14,43 +14,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
topTitle: { id: 'group_timeline_sorting.top_title', defaultMessage: 'Top Posts' },
topSubtitle: { id: 'group_timeline_sorting.top_subtitle', defaultMessage: 'See gabs with most comments, likes and reposts first' },
recentTitle: { id: 'group_timeline_sorting.recent_title', defaultMessage: 'Recent Activity' },
recentSubtitle: { id: 'group_timeline_sorting.recent_subtitle', defaultMessage: 'See gabs with most recent comments first' },
newTitle: { id: 'group_timeline_sorting.new_title', defaultMessage: 'New Posts' },
newSubtitle: { id: 'group_timeline_sorting.new_subtitle', defaultMessage: 'See most recent gabs first' },
hotTitle: { id: 'group_timeline_sorting.hot_title', defaultMessage: 'Hot Posts' },
hotSubtitle: { id: 'group_timeline_sorting.hot_subtitle', defaultMessage: 'See the most popular and recent gabs' },
})
const mapStateToProps = (state) => ({
sorting: state.getIn(['group_lists', 'sortByValue']),
})
const mapDispatchToProps = (dispatch) => ({
onSort(sort) {
dispatch(setGroupTimelineSort(sort))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class GroupTimelineSortOptionsPopover extends React.PureComponent {
static propTypes = {
sorting: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSort: PropTypes.func.isRequired,
options: PropTypes.object.isRequired,
}
handleOnClick = (type) => {
this.props.onSort(type)
}
@@ -117,4 +82,38 @@ class GroupTimelineSortOptionsPopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
topTitle: { id: 'group_timeline_sorting.top_title', defaultMessage: 'Top Posts' },
topSubtitle: { id: 'group_timeline_sorting.top_subtitle', defaultMessage: 'See gabs with most comments, likes and reposts first' },
recentTitle: { id: 'group_timeline_sorting.recent_title', defaultMessage: 'Recent Activity' },
recentSubtitle: { id: 'group_timeline_sorting.recent_subtitle', defaultMessage: 'See gabs with most recent comments first' },
newTitle: { id: 'group_timeline_sorting.new_title', defaultMessage: 'New Posts' },
newSubtitle: { id: 'group_timeline_sorting.new_subtitle', defaultMessage: 'See most recent gabs first' },
hotTitle: { id: 'group_timeline_sorting.hot_title', defaultMessage: 'Hot Posts' },
hotSubtitle: { id: 'group_timeline_sorting.hot_subtitle', defaultMessage: 'See the most popular and recent gabs' },
})
const mapStateToProps = (state) => ({
sorting: state.getIn(['group_lists', 'sortByValue']),
})
const mapDispatchToProps = (dispatch) => ({
onSort(sort) {
dispatch(setGroupTimelineSort(sort))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
GroupTimelineSortOptionsPopover.propTypes = {
sorting: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSort: PropTypes.func.isRequired,
options: PropTypes.object.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(GroupTimelineSortOptionsPopover))

63
app/javascript/gabsocial/components/popover/group_timeline_sort_top_options_popover.js
View File

@@ -14,39 +14,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
topTodayTitle: { id: 'group_timeline_sorting.top_today_title', defaultMessage: 'Today' },
topWeekTitle: { id: 'group_timeline_sorting.top_week_title', defaultMessage: 'This Week' },
topMonthTitle: { id: 'group_timeline_sorting.top_month_title', defaultMessage: 'This Month' },
topYearTitle: { id: 'group_timeline_sorting.top_year_title', defaultMessage: 'This Year' },
topAllTitle: { id: 'group_timeline_sorting.top_all_title', defaultMessage: 'All Time' },
})
const mapStateToProps = (state) => ({
sortByTopValue: state.getIn(['group_lists', 'sortByTopValue']),
})
const mapDispatchToProps = (dispatch) => ({
onSort(sort) {
dispatch(setGroupTimelineTopSort(sort))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class GroupTimelineSortTopOptionsPopover extends React.PureComponent {
static propTypes = {
sortByTopValue: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSort: PropTypes.func.isRequired,
}
handleOnClick = (type) => {
this.props.onSort(type)
}
@@ -109,4 +78,34 @@ class GroupTimelineSortTopOptionsPopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
topTodayTitle: { id: 'group_timeline_sorting.top_today_title', defaultMessage: 'Today' },
topWeekTitle: { id: 'group_timeline_sorting.top_week_title', defaultMessage: 'This Week' },
topMonthTitle: { id: 'group_timeline_sorting.top_month_title', defaultMessage: 'This Month' },
topYearTitle: { id: 'group_timeline_sorting.top_year_title', defaultMessage: 'This Year' },
topAllTitle: { id: 'group_timeline_sorting.top_all_title', defaultMessage: 'All Time' },
})
const mapStateToProps = (state) => ({
sortByTopValue: state.getIn(['group_lists', 'sortByTopValue']),
})
const mapDispatchToProps = (dispatch) => ({
onSort(sort) {
dispatch(setGroupTimelineTopSort(sort))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
GroupTimelineSortTopOptionsPopover.propTypes = {
sortByTopValue: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onClosePopover: PropTypes.func.isRequired,
onSort: PropTypes.func.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(GroupTimelineSortTopOptionsPopover))

14
app/javascript/gabsocial/components/popover/loading_popover.js
View File

@@ -3,12 +3,7 @@ import PropTypes from 'prop-types'
import PopoverLayout from './popover_layout'
import ColumnIndicator from '../column_indicator'
export default class LoadingPopover extends React.PureComponent {
static defaultProps = {
isXS: PropTypes.bool,
onClose: PropTypes.func,
}
class LoadingPopover extends React.PureComponent {
render() {
const { isXS } = this.props
@@ -29,3 +24,10 @@ export default class LoadingPopover extends React.PureComponent {
}
}
LoadingPopover.defaultProps = {
isXS: PropTypes.bool,
onClose: PropTypes.func,
}
export default LoadingPopover

47
app/javascript/gabsocial/components/popover/nav_settings_popover.js
View File

@@ -7,30 +7,7 @@ import { meUsername } from '../../initial_state'
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
profile: { id: 'account.profile', defaultMessage: 'Profile' },
display: { id: 'display_options', defaultMessage: 'Display Options' },
help: { id: 'getting_started.help', defaultMessage: 'Help' },
settings: { id: 'settings', defaultMessage: 'Settings' },
logout: { 'id': 'confirmations.logout.confirm', 'defaultMessage': 'Log out' },
})
const mapDispatchToProps = (dispatch) => ({
onClosePopover() {
dispatch(closePopover())
},
})
export default
@injectIntl
@connect(null, mapDispatchToProps)
class NavSettingsPopover extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
handleOnClosePopover = () => {
this.props.onClosePopover()
@@ -69,4 +46,26 @@ class NavSettingsPopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
profile: { id: 'account.profile', defaultMessage: 'Profile' },
display: { id: 'display_options', defaultMessage: 'Display Options' },
help: { id: 'getting_started.help', defaultMessage: 'Help' },
settings: { id: 'settings', defaultMessage: 'Settings' },
logout: { 'id': 'confirmations.logout.confirm', 'defaultMessage': 'Log out' },
})
const mapDispatchToProps = (dispatch) => ({
onClosePopover() {
dispatch(closePopover())
},
})
NavSettingsPopover.propTypes = {
intl: PropTypes.object.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
export default injectIntl(connect(null, mapDispatchToProps)(NavSettingsPopover))

56
app/javascript/gabsocial/components/popover/popover_base.js
View File

@@ -9,40 +9,12 @@ import { CX } from '../../constants'
const listenerOptions = detectPassiveEvents.hasSupport ? { passive: true } : false
const mapStateToProps = (state) => ({
isModalOpen: !!state.getIn(['modal', 'modalType']),
popoverPlacement: state.getIn(['popover', 'placement']),
})
export default
@connect(mapStateToProps)
class PopoverBase extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
}
static propTypes = {
title: PropTypes.string,
disabled: PropTypes.bool,
status: ImmutablePropTypes.map,
isUserTouching: PropTypes.func,
isModalOpen: PropTypes.bool.isRequired,
onClose: PropTypes.func.isRequired,
position: PropTypes.string,
visible: PropTypes.bool,
targetRef: PropTypes.node,
innerRef: PropTypes.oneOfType([
PropTypes.node,
PropTypes.func,
]),
}
static defaultProps = {
title: 'Menu',
position: 'bottom',
}
componentDidMount() {
document.addEventListener('click', this.handleDocumentClick, false)
document.addEventListener('keydown', this.handleKeyDown, false)
@@ -154,3 +126,31 @@ class PopoverBase extends ImmutablePureComponent {
}
}
const mapStateToProps = (state) => ({
isModalOpen: !!state.getIn(['modal', 'modalType']),
popoverPlacement: state.getIn(['popover', 'placement']),
})
PopoverBase.propTypes = {
title: PropTypes.string,
disabled: PropTypes.bool,
status: ImmutablePropTypes.map,
isUserTouching: PropTypes.func,
isModalOpen: PropTypes.bool.isRequired,
onClose: PropTypes.func.isRequired,
position: PropTypes.string,
visible: PropTypes.bool,
targetRef: PropTypes.node,
innerRef: PropTypes.oneOfType([
PropTypes.node,
PropTypes.func,
]),
}
PopoverBase.defaultProps = {
title: 'Menu',
position: 'bottom',
}
export default connect(mapStateToProps)(PopoverBase)

30
app/javascript/gabsocial/components/popover/popover_layout.js
View File

@@ -5,19 +5,7 @@ import Button from '../button'
import Heading from '../heading'
import Text from '../text'
export default class PopoverLayout extends React.PureComponent {
static propTypes = {
children: PropTypes.node,
width: PropTypes.number,
isXS: PropTypes.bool,
title: PropTypes.string,
onClose: PropTypes.func,
}
static defaultProps = {
width: 250,
}
class PopoverLayout extends React.PureComponent {
handleOnClose = () => {
this.props.onClose()
@@ -71,4 +59,18 @@ export default class PopoverLayout extends React.PureComponent {
)
}
}
}
PopoverLayout.propTypes = {
children: PropTypes.node,
width: PropTypes.number,
isXS: PropTypes.bool,
title: PropTypes.string,
onClose: PropTypes.func,
}
PopoverLayout.defaultProps = {
width: 250,
}
export default PopoverLayout

39
app/javascript/gabsocial/components/popover/popover_root.js
View File

@@ -10,7 +10,6 @@ import {
POPOVER_GROUP_TIMELINE_SORT_TOP_OPTIONS,
POPOVER_NAV_SETTINGS,
POPOVER_PROFILE_OPTIONS,
POPOVER_SEARCH,
POPOVER_SIDEBAR_MORE,
POPOVER_STATUS_OPTIONS,
POPOVER_STATUS_EXPIRATION_OPTIONS,
@@ -29,7 +28,6 @@ import {
GroupTimelineSortTopOptionsPopover,
NavSettingsPopover,
ProfileOptionsPopover,
SearchPopover,
SidebarMorePopover,
StatusExpirationOptionsPopover,
StatusOptionsPopover,
@@ -62,7 +60,6 @@ POPOVER_COMPONENTS[POPOVER_GROUP_TIMELINE_SORT_OPTIONS] = GroupTimelineSortOptio
POPOVER_COMPONENTS[POPOVER_GROUP_TIMELINE_SORT_TOP_OPTIONS] = GroupTimelineSortTopOptionsPopover
POPOVER_COMPONENTS[POPOVER_NAV_SETTINGS] = NavSettingsPopover
POPOVER_COMPONENTS[POPOVER_PROFILE_OPTIONS] = ProfileOptionsPopover
POPOVER_COMPONENTS[POPOVER_SEARCH] = SearchPopover
POPOVER_COMPONENTS[POPOVER_SIDEBAR_MORE] = SidebarMorePopover
POPOVER_COMPONENTS[POPOVER_STATUS_OPTIONS] = StatusOptionsPopover
POPOVER_COMPONENTS[POPOVER_STATUS_EXPIRATION_OPTIONS] = StatusExpirationOptionsPopover
@@ -70,25 +67,8 @@ POPOVER_COMPONENTS[POPOVER_STATUS_VISIBILITY] = StatusVisibilityPopover
POPOVER_COMPONENTS[POPOVER_USER_INFO] = UserInfoPopover
POPOVER_COMPONENTS[POPOVER_VIDEO_STATS] = VideoStatsPopover
const mapStateToProps = (state) => ({
type: state.getIn(['popover', 'popoverType']),
props: state.getIn(['popover', 'popoverProps'], {}),
})
const mapDispatchToProps = (dispatch) => ({
onClose: (type) => dispatch(closePopover(type)),
})
export default
@connect(mapStateToProps, mapDispatchToProps)
class PopoverRoot extends React.PureComponent {
static propTypes = {
type: PropTypes.string,
props: PropTypes.object,
onClose: PropTypes.func.isRequired,
}
state = {
width: initialState.width,
}
@@ -170,4 +150,21 @@ class PopoverRoot extends React.PureComponent {
)
}
}
}
const mapStateToProps = (state) => ({
type: state.getIn(['popover', 'popoverType']),
props: state.getIn(['popover', 'popoverProps'], {}),
})
const mapDispatchToProps = (dispatch) => ({
onClose: (type) => dispatch(closePopover(type)),
})
PopoverRoot.propTypes = {
type: PropTypes.string,
props: PropTypes.object,
onClose: PropTypes.func.isRequired,
}
export default connect(mapStateToProps, mapDispatchToProps)(PopoverRoot)

239
app/javascript/gabsocial/components/popover/profile_options_popover.js
View File

@@ -23,127 +23,8 @@ import { makeGetAccount } from '../../selectors'
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
blockAndReport: { id: 'confirmations.block.block_and_report', defaultMessage: 'Block & Report' },
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
follow: { id: 'account.follow', defaultMessage: 'Follow' },
requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
linkVerifiedOn: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' },
account_locked: { id: 'account.locked_info', defaultMessage: 'This account privacy status is set to locked. The owner manually reviews who can follow them.' },
mention: { id: 'account.mention', defaultMessage: 'Mention' },
unmute: { id: 'account.unmute', defaultMessage: 'Unmute @{name}' },
block: { id: 'account.block', defaultMessage: 'Block @{name}' },
mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' },
report: { id: 'account.report', defaultMessage: 'Report @{name}' },
share: { id: 'account.share', defaultMessage: 'Share @{name}\'s profile' },
media: { id: 'account.media', defaultMessage: 'Media' },
hideReposts: { id: 'account.hide_reblogs', defaultMessage: 'Hide reposts from @{name}' },
showReposts: { id: 'account.show_reblogs', defaultMessage: 'Show reposts from @{name}' },
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
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_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 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'
})
return {
isShortcut,
account: getAccount(state, accountId),
}
}
const mapDispatchToProps = (dispatch, { intl }) => ({
onFollow(account) {
if (account.getIn(['relationship', 'following']) || account.getIn(['relationship', 'requested'])) {
if (unfollowModal) {
dispatch(openModal('UNFOLLOW', {
account,
}))
} else {
dispatch(unfollowAccount(account.get('id')))
}
} else {
dispatch(followAccount(account.get('id')))
}
},
onBlock(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'blocking'])) {
dispatch(unblockAccount(account.get('id')));
} else {
dispatch(openModal('BLOCK_ACCOUNT', {
accountId: account.get('id'),
}));
}
},
onMention(account) {
dispatch(closePopover())
dispatch(mentionCompose(account));
},
onRepostToggle(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'showing_reblogs'])) {
dispatch(followAccount(account.get('id'), false));
} else {
dispatch(followAccount(account.get('id'), true));
}
},
onReport(account) {
dispatch(closePopover())
dispatch(initReport(account));
},
onMute(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'muting'])) {
dispatch(unmuteAccount(account.get('id')));
} else {
dispatch(openModal('MUTE', {
accountId: account.get('id'),
}))
}
},
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(mapStateToProps, mapDispatchToProps)
class ProfileOptionsPopover extends React.PureComponent {
static defaultProps = {
isXS: PropTypes.bool,
isShortcut: PropTypes.bool,
}
makeMenu() {
const {
account,
@@ -299,4 +180,122 @@ class ProfileOptionsPopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
blockAndReport: { id: 'confirmations.block.block_and_report', defaultMessage: 'Block & Report' },
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
follow: { id: 'account.follow', defaultMessage: 'Follow' },
requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
linkVerifiedOn: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' },
account_locked: { id: 'account.locked_info', defaultMessage: 'This account privacy status is set to locked. The owner manually reviews who can follow them.' },
mention: { id: 'account.mention', defaultMessage: 'Mention' },
unmute: { id: 'account.unmute', defaultMessage: 'Unmute @{name}' },
block: { id: 'account.block', defaultMessage: 'Block @{name}' },
mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' },
report: { id: 'account.report', defaultMessage: 'Report @{name}' },
share: { id: 'account.share', defaultMessage: 'Share @{name}\'s profile' },
media: { id: 'account.media', defaultMessage: 'Media' },
hideReposts: { id: 'account.hide_reblogs', defaultMessage: 'Hide reposts from @{name}' },
showReposts: { id: 'account.show_reblogs', defaultMessage: 'Show reposts from @{name}' },
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
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_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 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'
})
return {
isShortcut,
account: getAccount(state, accountId),
}
}
const mapDispatchToProps = (dispatch, { intl }) => ({
onFollow(account) {
if (account.getIn(['relationship', 'following']) || account.getIn(['relationship', 'requested'])) {
if (unfollowModal) {
dispatch(openModal('UNFOLLOW', {
account,
}))
} else {
dispatch(unfollowAccount(account.get('id')))
}
} else {
dispatch(followAccount(account.get('id')))
}
},
onBlock(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'blocking'])) {
dispatch(unblockAccount(account.get('id')));
} else {
dispatch(openModal('BLOCK_ACCOUNT', {
accountId: account.get('id'),
}));
}
},
onMention(account) {
dispatch(closePopover())
dispatch(mentionCompose(account));
},
onRepostToggle(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'showing_reblogs'])) {
dispatch(followAccount(account.get('id'), false));
} else {
dispatch(followAccount(account.get('id'), true));
}
},
onReport(account) {
dispatch(closePopover())
dispatch(initReport(account));
},
onMute(account) {
dispatch(closePopover())
if (account.getIn(['relationship', 'muting'])) {
dispatch(unmuteAccount(account.get('id')));
} else {
dispatch(openModal('MUTE', {
accountId: account.get('id'),
}))
}
},
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))
},
})
ProfileOptionsPopover.defaultProps = {
isXS: PropTypes.bool,
isShortcut: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ProfileOptionsPopover))

48
app/javascript/gabsocial/components/popover/search_popover.js
View File

@@ -1,48 +0,0 @@
import React from 'react'
import PropTypes from 'prop-types'
export default class SearchPopover extends React.PureComponent {
render() {
// : todo :
// <div className='search-popout-container' style={{ ...style, position: 'absolute', zIndex: 1000 }}>
// <Motion defaultStyle={{ opacity: 0, scaleX: 1, scaleY: 1 }} style={{ opacity: spring(1, { damping: 35, stiffness: 400 }), scaleX: spring(1, { damping: 35, stiffness: 400 }), scaleY: spring(1, { damping: 35, stiffness: 400 }) }}>
// {({ opacity, scaleX, scaleY }) => (
// <div className='search-popout' style={{ opacity: opacity, transform: `scale(${scaleX}, ${scaleY})` }}>
// <h4>
// <FormattedMessage id='search_popout.search_format' defaultMessage='Advanced search format' />
// </h4>
// <ul>
// <li>
// <em>#example</em>
// <FormattedMessage id='search_popout.tips.hashtag' defaultMessage='hashtag' />
// </li>
// <li>
// <em>@username</em>
// <FormattedMessage id='search_popout.tips.user' defaultMessage='user' />
// </li>
// <li>
// <em>URL</em>
// <FormattedMessage id='search_popout.tips.user' defaultMessage='user' />
// </li>
// <li>
// <em>URL</em>
// <FormattedMessage id='search_popout.tips.status' defaultMessage='status' />
// </li>
// </ul>
// {
// searchEnabled
// ? <FormattedMessage id='search_popout.tips.full_text' defaultMessage='Simple text returns statuses you have written, favorited, reposted, or have been mentioned in, as well as matching usernames, display names, and hashtags.' />
// : <FormattedMessage id='search_popout.tips.text' defaultMessage='Simple text returns matching display names, usernames and hashtags' />
// }
// </div>
// )}
// </Motion>
// </div>
return (
<div>
{ /* */}
</div>
)
}
}

51
app/javascript/gabsocial/components/popover/sidebar_more_popover.js
View File

@@ -8,32 +8,7 @@ import { closePopover } from '../../actions/popover'
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
display: { id: 'display_options', defaultMessage: 'Display Options' },
help: { id: 'getting_started.help', defaultMessage: 'Help' },
settings: { id: 'settings', defaultMessage: 'Settings' },
logout: { 'id': 'confirmations.logout.confirm', 'defaultMessage': 'Log out' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
})
const mapDispatchToProps = (dispatch) => ({
onOpenDisplayModal: () => {
dispatch(closePopover())
dispatch(openModal(MODAL_DISPLAY_OPTIONS))
},
})
export default
@injectIntl
@connect(null, mapDispatchToProps)
class SidebarMorePopover extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
onOpenDisplayModal: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
handleOnOpenDisplayModal = () => {
this.props.onOpenDisplayModal()
@@ -79,4 +54,28 @@ class SidebarMorePopover extends React.PureComponent {
</PopoverLayout>
)
}
}
}
const messages = defineMessages({
display: { id: 'display_options', defaultMessage: 'Display Options' },
help: { id: 'getting_started.help', defaultMessage: 'Help' },
settings: { id: 'settings', defaultMessage: 'Settings' },
logout: { 'id': 'confirmations.logout.confirm', 'defaultMessage': 'Log out' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
})
const mapDispatchToProps = (dispatch) => ({
onOpenDisplayModal: () => {
dispatch(closePopover())
dispatch(openModal(MODAL_DISPLAY_OPTIONS))
},
})
SidebarMorePopover.propTypes = {
intl: PropTypes.object.isRequired,
onOpenDisplayModal: PropTypes.func.isRequired,
isXS: PropTypes.bool,
}
export default injectIntl(connect(null, mapDispatchToProps)(SidebarMorePopover))

59
app/javascript/gabsocial/components/popover/status_expiration_options_popover.js
View File

@@ -15,37 +15,8 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
})
const mapStateToProps = (state) => ({
expiresAtValue: state.getIn(['compose', 'expires_at']),
})
const mapDispatchToProps = (dispatch) => ({
onChangeExpiresAt(expiresAt) {
dispatch(changeExpiresAt(expiresAt))
},
onClosePopover() {
dispatch(closePopover())
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class StatusExpirationOptionsPopover extends React.PureComponent {
static defaultProps = {
expiresAtValue: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onChangeExpiresAt: PropTypes.func.isRequired,
}
handleOnSetStatusExpiration = (expiresAt) => {
this.props.onChangeExpiresAt(expiresAt)
this.handleOnClosePopover()
@@ -126,4 +97,32 @@ class StatusExpirationOptionsPopover extends React.PureComponent {
)
}
}
}
const messages = defineMessages({
minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
})
const mapStateToProps = (state) => ({
expiresAtValue: state.getIn(['compose', 'expires_at']),
})
const mapDispatchToProps = (dispatch) => ({
onChangeExpiresAt(expiresAt) {
dispatch(changeExpiresAt(expiresAt))
},
onClosePopover() {
dispatch(closePopover())
},
})
StatusExpirationOptionsPopover.defaultProps = {
expiresAtValue: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onChangeExpiresAt: PropTypes.func.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(StatusExpirationOptionsPopover))

407
app/javascript/gabsocial/components/popover/status_options_popover.js
View File

@@ -36,214 +36,11 @@ import {
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
delete: { id: 'status.delete', defaultMessage: 'Delete' },
edit: { id: 'status.edit', defaultMessage: 'Edit' },
mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' },
block: { id: 'account.block', defaultMessage: 'Block @{name}' },
reply: { id: 'status.reply', defaultMessage: 'Reply' },
more: { id: 'status.more', defaultMessage: 'More' },
share: { id: 'status.share', defaultMessage: 'Share' },
replyAll: { id: 'status.replyAll', defaultMessage: 'Reply to thread' },
repost: { id: 'repost', defaultMessage: 'Repost' },
quote: { id: 'status.quote', defaultMessage: 'Quote' },
repost_private: { id: 'status.repost', defaultMessage: 'Repost' },
cancel_repost_private: { id: 'status.cancel_repost_private', defaultMessage: 'Remove Repost' },
cannot_repost: { id: 'status.cannot_repost', defaultMessage: 'This post cannot be reposted' },
cannot_quote: { id: 'status.cannot_quote', defaultMessage: 'This post cannot be quoted' },
like: { id: 'status.like', defaultMessage: 'Like' },
report: { id: 'status.report', defaultMessage: 'Report @{name}' },
muteConversation: { id: 'status.mute_conversation', defaultMessage: 'Mute conversation' },
unmuteConversation: { id: 'status.unmute_conversation', defaultMessage: 'Unmute conversation' },
pin: { id: 'status.pin', defaultMessage: 'Pin on profile' },
unpin: { id: 'status.unpin', defaultMessage: 'Unpin from profile' },
bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark status' },
unbookmark: { id: 'status.unbookmark', defaultMessage: 'Remove bookmark' },
admin_account: { id: 'status.admin_account', defaultMessage: 'Open moderation interface for @{name}' },
admin_status: { id: 'status.admin_status', defaultMessage: 'Open this status in the moderation interface' },
group_remove_account: { id: 'status.remove_account_from_group', defaultMessage: 'Remove account from group' },
group_remove_post: { id: 'status.remove_post_from_group', defaultMessage: 'Remove status from group' },
repostWithComment: { id: 'repost_with_comment', defaultMessage: 'Repost with comment' },
embed: { id: 'status.embed', defaultMessage: 'Embed' },
email: { id: 'status.email', defaultMessage: 'Email this gab' },
copy: { id: 'status.copy', defaultMessage: 'Copy link to status' },
})
const mapStateToProps = (state, { status }) => {
if (!me) return null
const groupId = status ? status.getIn(['group', 'id']) : undefined
const groupRelationships = state.getIn(['group_relationships', groupId])
return {
groupId,
groupRelationships,
isPro: state.getIn(['accounts', me, 'is_pro']),
}
}
const mapDispatchToProps = (dispatch) => ({
onMuteConversation(status) {
dispatch(closePopover())
if (status.get('muted')) {
dispatch(unmuteStatus(status.get('id')))
} else {
dispatch(muteStatus(status.get('id')))
}
},
onPin(status) {
dispatch(closePopover())
if (status.get('pinned')) {
dispatch(unpin(status))
} else {
dispatch(pin(status))
}
},
onBookmark(status) {
dispatch(closePopover())
if (status.get('bookmarked')) {
dispatch(unbookmark(status))
} else {
dispatch(bookmark(status))
}
},
onQuote(status, router) {
dispatch(closePopover())
dispatch((_, getState) => {
const state = getState()
if (state.getIn(['compose', 'text']).trim().length !== 0) {
dispatch(openModal(MODAL_CONFIRM, {
message: intl.formatMessage(messages.quoteMessage),
confirm: intl.formatMessage(messages.quoteConfirm),
onConfirm: () => dispatch(quoteCompose(status, router)),
}))
} else {
dispatch(quoteCompose(status, router))
}
})
},
onRepost(status) {
dispatch(closePopover())
const alreadyReposted = status.get('reblogged')
if (boostModal && !alreadyReposted) {
dispatch(openModal(MODAL_BOOST, {
status,
onRepost: () => dispatch(repost(status)),
}))
} else {
if (alreadyReposted) {
dispatch(unrepost(status))
} else {
dispatch(repost(status))
}
}
},
onDelete(status, history) {
dispatch(closePopover())
if (!deleteModal) {
dispatch(deleteStatus(status.get('id'), history))
} else {
dispatch(openModal('CONFIRM', {
message: <FormattedMessage id='confirmations.delete.message' defaultMessage='Are you sure you want to delete this status?' />,
confirm: <FormattedMessage id='confirmations.delete.confirm' defaultMessage='Delete' />,
onConfirm: () => dispatch(deleteStatus(status.get('id'), history)),
}))
}
},
onEdit(status) {
dispatch(closePopover())
dispatch(editStatus(status))
},
onMute(account) {
dispatch(closePopover())
dispatch(initMuteModal(account))
},
onBlock(status) {
dispatch(closePopover())
const account = status.get('account')
dispatch(openModal('BLOCK_ACCOUNT', {
accountId: account.get('id'),
}))
},
onReport(status) {
dispatch(closePopover())
dispatch(initReport(status.get('account'), status))
},
onGroupRemoveAccount(groupId, accountId) {
dispatch(closePopover())
dispatch(createRemovedAccount(groupId, accountId))
},
onGroupRemoveStatus(groupId, statusId) {
dispatch(closePopover())
dispatch(groupRemoveStatus(groupId, statusId))
},
onFetchGroupRelationships(groupId) {
dispatch(fetchGroupRelationships([groupId]))
},
onOpenEmbedModal(url) {
dispatch(closePopover())
dispatch(openModal(MODAL_EMBED, {
url,
}))
},
onOpenProUpgradeModal() {
dispatch(closePopover())
dispatch(openModal(MODAL_PRO_UPGRADE))
},
onClosePopover: () => dispatch(closePopover()),
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class StatusOptionsPopover extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
}
static propTypes = {
status: ImmutablePropTypes.map.isRequired,
groupRelationships: ImmutablePropTypes.map,
groupId: PropTypes.string,
onQuote: PropTypes.func.isRequired,
onRepost: PropTypes.func.isRequired,
onDelete: PropTypes.func.isRequired,
onMute: PropTypes.func.isRequired,
onBlock: PropTypes.func.isRequired,
onReport: PropTypes.func.isRequired,
onMuteConversation: PropTypes.func.isRequired,
onPin: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
onFetchGroupRelationships: PropTypes.func.isRequired,
onOpenEmbedModal: PropTypes.func.isRequired,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
isPro: PropTypes.bool,
}
updateOnProps = [
'status',
@@ -496,4 +293,206 @@ class StatusOptionsPopover extends ImmutablePureComponent {
)
}
}
}
const messages = defineMessages({
delete: { id: 'status.delete', defaultMessage: 'Delete' },
edit: { id: 'status.edit', defaultMessage: 'Edit' },
mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' },
block: { id: 'account.block', defaultMessage: 'Block @{name}' },
reply: { id: 'status.reply', defaultMessage: 'Reply' },
more: { id: 'status.more', defaultMessage: 'More' },
share: { id: 'status.share', defaultMessage: 'Share' },
replyAll: { id: 'status.replyAll', defaultMessage: 'Reply to thread' },
repost: { id: 'repost', defaultMessage: 'Repost' },
quote: { id: 'status.quote', defaultMessage: 'Quote' },
repost_private: { id: 'status.repost', defaultMessage: 'Repost' },
cancel_repost_private: { id: 'status.cancel_repost_private', defaultMessage: 'Remove Repost' },
cannot_repost: { id: 'status.cannot_repost', defaultMessage: 'This post cannot be reposted' },
cannot_quote: { id: 'status.cannot_quote', defaultMessage: 'This post cannot be quoted' },
like: { id: 'status.like', defaultMessage: 'Like' },
report: { id: 'status.report', defaultMessage: 'Report @{name}' },
muteConversation: { id: 'status.mute_conversation', defaultMessage: 'Mute conversation' },
unmuteConversation: { id: 'status.unmute_conversation', defaultMessage: 'Unmute conversation' },
pin: { id: 'status.pin', defaultMessage: 'Pin on profile' },
unpin: { id: 'status.unpin', defaultMessage: 'Unpin from profile' },
bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark status' },
unbookmark: { id: 'status.unbookmark', defaultMessage: 'Remove bookmark' },
admin_account: { id: 'status.admin_account', defaultMessage: 'Open moderation interface for @{name}' },
admin_status: { id: 'status.admin_status', defaultMessage: 'Open this status in the moderation interface' },
group_remove_account: { id: 'status.remove_account_from_group', defaultMessage: 'Remove account from group' },
group_remove_post: { id: 'status.remove_post_from_group', defaultMessage: 'Remove status from group' },
repostWithComment: { id: 'repost_with_comment', defaultMessage: 'Repost with comment' },
embed: { id: 'status.embed', defaultMessage: 'Embed' },
email: { id: 'status.email', defaultMessage: 'Email this gab' },
copy: { id: 'status.copy', defaultMessage: 'Copy link to status' },
})
const mapStateToProps = (state, { status }) => {
if (!me) return null
const groupId = status ? status.getIn(['group', 'id']) : undefined
const groupRelationships = state.getIn(['group_relationships', groupId])
return {
groupId,
groupRelationships,
isPro: state.getIn(['accounts', me, 'is_pro']),
}
}
const mapDispatchToProps = (dispatch) => ({
onMuteConversation(status) {
dispatch(closePopover())
if (status.get('muted')) {
dispatch(unmuteStatus(status.get('id')))
} else {
dispatch(muteStatus(status.get('id')))
}
},
onPin(status) {
dispatch(closePopover())
if (status.get('pinned')) {
dispatch(unpin(status))
} else {
dispatch(pin(status))
}
},
onBookmark(status) {
dispatch(closePopover())
if (status.get('bookmarked')) {
dispatch(unbookmark(status))
} else {
dispatch(bookmark(status))
}
},
onQuote(status, router) {
dispatch(closePopover())
dispatch((_, getState) => {
const state = getState()
if (state.getIn(['compose', 'text']).trim().length !== 0) {
dispatch(openModal(MODAL_CONFIRM, {
message: intl.formatMessage(messages.quoteMessage),
confirm: intl.formatMessage(messages.quoteConfirm),
onConfirm: () => dispatch(quoteCompose(status, router)),
}))
} else {
dispatch(quoteCompose(status, router))
}
})
},
onRepost(status) {
dispatch(closePopover())
const alreadyReposted = status.get('reblogged')
if (boostModal && !alreadyReposted) {
dispatch(openModal(MODAL_BOOST, {
status,
onRepost: () => dispatch(repost(status)),
}))
} else {
if (alreadyReposted) {
dispatch(unrepost(status))
} else {
dispatch(repost(status))
}
}
},
onDelete(status, history) {
dispatch(closePopover())
if (!deleteModal) {
dispatch(deleteStatus(status.get('id'), history))
} else {
dispatch(openModal('CONFIRM', {
message: <FormattedMessage id='confirmations.delete.message' defaultMessage='Are you sure you want to delete this status?' />,
confirm: <FormattedMessage id='confirmations.delete.confirm' defaultMessage='Delete' />,
onConfirm: () => dispatch(deleteStatus(status.get('id'), history)),
}))
}
},
onEdit(status) {
dispatch(closePopover())
dispatch(editStatus(status))
},
onMute(account) {
dispatch(closePopover())
dispatch(initMuteModal(account))
},
onBlock(status) {
dispatch(closePopover())
const account = status.get('account')
dispatch(openModal('BLOCK_ACCOUNT', {
accountId: account.get('id'),
}))
},
onReport(status) {
dispatch(closePopover())
dispatch(initReport(status.get('account'), status))
},
onGroupRemoveAccount(groupId, accountId) {
dispatch(closePopover())
dispatch(createRemovedAccount(groupId, accountId))
},
onGroupRemoveStatus(groupId, statusId) {
dispatch(closePopover())
dispatch(groupRemoveStatus(groupId, statusId))
},
onFetchGroupRelationships(groupId) {
dispatch(fetchGroupRelationships([groupId]))
},
onOpenEmbedModal(url) {
dispatch(closePopover())
dispatch(openModal(MODAL_EMBED, {
url,
}))
},
onOpenProUpgradeModal() {
dispatch(closePopover())
dispatch(openModal(MODAL_PRO_UPGRADE))
},
onClosePopover: () => dispatch(closePopover()),
})
StatusOptionsPopover.propTypes = {
status: ImmutablePropTypes.map.isRequired,
groupRelationships: ImmutablePropTypes.map,
groupId: PropTypes.string,
onQuote: PropTypes.func.isRequired,
onRepost: PropTypes.func.isRequired,
onDelete: PropTypes.func.isRequired,
onMute: PropTypes.func.isRequired,
onBlock: PropTypes.func.isRequired,
onReport: PropTypes.func.isRequired,
onMuteConversation: PropTypes.func.isRequired,
onPin: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
onFetchGroupRelationships: PropTypes.func.isRequired,
onOpenEmbedModal: PropTypes.func.isRequired,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
isPro: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(StatusOptionsPopover))

65
app/javascript/gabsocial/components/popover/status_visibility_popover.js
View File

@@ -11,42 +11,8 @@ import Text from '../text'
const cx = classNames.bind(_s)
const messages = defineMessages({
public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
public_long: { id: 'privacy.public.long', defaultMessage: 'Visible for anyone on or off Gab' },
unlisted_short: { id: 'privacy.unlisted.short', defaultMessage: 'Unlisted' },
unlisted_long: { id: 'privacy.unlisted.long', defaultMessage: 'Do not show in public timelines' },
private_short: { id: 'privacy.private.short', defaultMessage: 'Followers-only' },
private_long: { id: 'privacy.private.long', defaultMessage: 'Visible for your followers only' },
change_privacy: { id: 'privacy.change', defaultMessage: 'Adjust status privacy' },
visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
})
const mapStateToProps = (state) => ({
value: state.getIn(['compose', 'privacy']),
})
const mapDispatchToProps = (dispatch) => ({
onChange (value) {
dispatch(changeComposeVisibility(value))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
export default
@connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class StatusVisibilityDropdown extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onChange: PropTypes.func.isRequired,
onClosePopover: PropTypes.func.isRequired,
value: PropTypes.string.isRequired,
}
handleChange = (value) => {
this.props.onChange(value)
}
@@ -135,4 +101,35 @@ class StatusVisibilityDropdown extends React.PureComponent {
}
const messages = defineMessages({
public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
public_long: { id: 'privacy.public.long', defaultMessage: 'Visible for anyone on or off Gab' },
unlisted_short: { id: 'privacy.unlisted.short', defaultMessage: 'Unlisted' },
unlisted_long: { id: 'privacy.unlisted.long', defaultMessage: 'Do not show in public timelines' },
private_short: { id: 'privacy.private.short', defaultMessage: 'Followers-only' },
private_long: { id: 'privacy.private.long', defaultMessage: 'Visible for your followers only' },
change_privacy: { id: 'privacy.change', defaultMessage: 'Adjust status privacy' },
visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
})
const mapStateToProps = (state) => ({
value: state.getIn(['compose', 'privacy']),
})
const mapDispatchToProps = (dispatch) => ({
onChange (value) {
dispatch(changeComposeVisibility(value))
dispatch(closePopover())
},
onClosePopover: () => dispatch(closePopover()),
})
StatusVisibilityDropdown.propTypes = {
intl: PropTypes.object.isRequired,
isXS: PropTypes.bool,
onChange: PropTypes.func.isRequired,
onClosePopover: PropTypes.func.isRequired,
value: PropTypes.string.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(StatusVisibilityDropdown))

26
app/javascript/gabsocial/components/popover/user_info_popover.js
View File

@@ -14,20 +14,8 @@ import Avatar from '../avatar'
import DisplayName from '../display_name'
import Text from '../text'
const mapStateToProps = (state, props) => ({
account: makeGetAccount()(state, props.accountId),
})
export default
@connect(mapStateToProps)
class UserInfoPopover extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map,
accountId: PropTypes.string.isRequired,
isXS: PropTypes.bool,
}
render() {
const { account, isXS } = this.props
@@ -87,4 +75,16 @@ class UserInfoPopover extends ImmutablePureComponent {
</PopoverLayout>
)
}
}
}
const mapStateToProps = (state, props) => ({
account: makeGetAccount()(state, props.accountId),
})
UserInfoPopover.propTypes = {
account: ImmutablePropTypes.map,
accountId: PropTypes.string.isRequired,
isXS: PropTypes.bool,
}
export default connect(mapStateToProps)(UserInfoPopover)

67
app/javascript/gabsocial/components/popover/video_stats_popover.js
View File

@@ -10,35 +10,8 @@ import PopoverLayout from './popover_layout'
import Button from '../button'
import Text from '../text'
const messages = defineMessages({
size: { id: 'size', defaultMessage: 'Size' },
audio_bitrate: { id: 'video.audio_bitrate', defaultMessage: 'Audio Bitrate' },
fps: { id: 'fps', defaultMessage: 'FPS' },
aspect: { id: 'video.aspect_ratio', defaultMessage: 'Aspect Ratio' },
audio_channels: { id: 'video.audio_channels', defaultMessage: 'Audio Channels' },
audio_encode: { id: 'video.audio_encode', defaultMessage: 'Audio Encode' },
original_height: { id: 'video.original_height', defaultMessage: 'Original Height' },
original_width: { id: 'video.original_width', defaultMessage: 'Original Width' },
original_frame_rate: { id: 'video.original_frame_rate', defaultMessage: 'Original Frame Rate' },
original_bitrate: { id: 'video.original_bitrate', defaultMessage: 'Original Bitrate' },
})
const mapDispatchToProps = (dispatch) => ({
onClosePopover: () => dispatch(closePopover()),
})
export default
@injectIntl
@connect(null, mapDispatchToProps)
class VideoStatsPopover extends ImmutablePureComponent {
static propTypes = {
meta: ImmutablePropTypes.map.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
intl: PropTypes.object.isRequired,
}
updateOnProps = [
'meta',
'isXS',
@@ -125,12 +98,6 @@ class VideoStatsPopover extends ImmutablePureComponent {
class VideoStatLine extends React.PureComponent {
static propTypes = {
isXS: PropTypes.bool.isRequired,
title: PropTypes.string.isRequired,
value: PropTypes.string.isRequired,
}
render() {
const { isXS, title, value } = this.props
@@ -150,4 +117,36 @@ class VideoStatLine extends React.PureComponent {
)
}
}
}
VideoStatLine.propTypes = {
isXS: PropTypes.bool.isRequired,
title: PropTypes.string.isRequired,
value: PropTypes.string.isRequired,
}
const messages = defineMessages({
size: { id: 'size', defaultMessage: 'Size' },
audio_bitrate: { id: 'video.audio_bitrate', defaultMessage: 'Audio Bitrate' },
fps: { id: 'fps', defaultMessage: 'FPS' },
aspect: { id: 'video.aspect_ratio', defaultMessage: 'Aspect Ratio' },
audio_channels: { id: 'video.audio_channels', defaultMessage: 'Audio Channels' },
audio_encode: { id: 'video.audio_encode', defaultMessage: 'Audio Encode' },
original_height: { id: 'video.original_height', defaultMessage: 'Original Height' },
original_width: { id: 'video.original_width', defaultMessage: 'Original Width' },
original_frame_rate: { id: 'video.original_frame_rate', defaultMessage: 'Original Frame Rate' },
original_bitrate: { id: 'video.original_bitrate', defaultMessage: 'Original Bitrate' },
})
const mapDispatchToProps = (dispatch) => ({
onClosePopover: () => dispatch(closePopover()),
})
VideoStatsPopover.propTypes = {
meta: ImmutablePropTypes.map.isRequired,
onClosePopover: PropTypes.func.isRequired,
isXS: PropTypes.bool,
intl: PropTypes.object.isRequired,
}
export default injectIntl(connect(null, mapDispatchToProps)(VideoStatsPopover))