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

Progress

Browse Source
This commit is contained in:
mgabdev
2020-05-01 01:50:27 -04:00
parent c15d4f12dc
commit 8e349c368c
99 changed files with 1268 additions and 887 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -16,7 +16,7 @@ import '!style-loader!css-loader!emoji-mart/css/emoji-mart.css'
const messages = defineMessages({
emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
emoji_search: { id: 'emoji_button.search', defaultMessage: 'Search...' },
emoji_search: { id: 'emoji_button.search', defaultMessage: 'Search for emoji' },
emoji_not_found: { id: 'emoji_button.not_found', defaultMessage: 'No emojos!! (╯°□°）╯︵ ┻━┻' },
custom: { id: 'emoji_button.custom', defaultMessage: 'Custom' },
recent: { id: 'emoji_button.recent', defaultMessage: 'Frequently used' },

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

@@ -1,12 +1,97 @@
import ImmutablePureComponent from 'react-immutable-pure-component'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { defineMessages, injectIntl } from 'react-intl'
import { quoteCompose } from '../../actions/compose'
import { repost, unrepost } from '../../actions/interactions'
import { openModal } from '../../actions/modal'
import { boostModal, me } from '../../initial_state'
import PopoverLayout from './popover_layout'
import Text from '../text'
import List from '../list'
const messages = defineMessages({
repost: { id: 'repost', defaultMessage: 'Repost' },
repostWithComment: { id: 'repost_with_comment', defaultMessage: 'Repost with comment' },
});
const mapDispatchToProps = (dispatch, { intl }) => ({
onQuote (status, router) {
if (!me) return dispatch(openModal('UNAUTHORIZED'))
dispatch((_, getState) => {
const state = getState();
if (state.getIn(['compose', 'text']).trim().length !== 0) {
dispatch(openModal('CONFIRM', {
message: intl.formatMessage(messages.quoteMessage),
confirm: intl.formatMessage(messages.quoteConfirm),
onConfirm: () => dispatch(quoteCompose(status, router)),
}));
} else {
dispatch(quoteCompose(status, router));
}
});
},
onRepost (status) {
if (!me) return dispatch(openModal('UNAUTHORIZED'))
if (status.get('reblogged')) {
dispatch(unrepost(status));
} else {
dispatch(repost(status));
}
},
});
export default
@injectIntl
@connect(null, mapDispatchToProps)
class GroupOptionsPopover extends ImmutablePureComponent {
static defaultProps = {
intl: PropTypes.object.isRequired,
status: ImmutablePropTypes.map.isRequired,
onQuote: PropTypes.func.isRequired,
onRepost: PropTypes.func.isRequired,
}
updateOnProps = ['status']
handleOnRepost = () => {
}
handleOnQuote = () => {
}
export default class UserInfoPopover extends PureComponent {
render() {
const { intl } = this.props
const listItems = [
{
hideArrow: true,
icon: 'repost',
title: intl.formatMessage(messages.repost),
onClick: this.handleOnRepost,
},
{
hideArrow: true,
icon: 'pencil',
title: intl.formatMessage(messages.repostWithComment),
onClick: this.handleBlockDomain,
}
]
return (
<PopoverLayout>
<Text>testing</Text>
<PopoverLayout width={220}>
<List
scrollKey='repost_options'
items={listItems}
size='large'
/>
</PopoverLayout>
)
}
}

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

@@ -1,33 +1,20 @@
import detectPassiveEvents from 'detect-passive-events'
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { Manager, Reference, Popper } from 'react-popper'
import classnames from 'classnames/bind'
import { openPopover, closePopover } from '../../actions/popover'
import { openModal, closeModal } from '../../actions/modal'
import { closePopover } from '../../actions/popover'
import { CX } from '../../constants'
import { isUserTouching } from '../../utils/is_mobile'
const cx = classnames.bind(_s)
let id = 0
const listenerOptions = detectPassiveEvents.hasSupport ? { passive: true } : false
const mapStateToProps = (state) => ({
isModalOpen: state.getIn(['modal', 'modalType']) === 'ACTIONS',
isModalOpen: !!state.getIn(['modal', 'modalType']),
popoverPlacement: state.getIn(['popover', 'placement']),
openPopoverType: state.getIn(['popover', 'popoverType']),
})
const mapDispatchToProps = (dispatch, { status, items }) => ({
onOpen(id, onItemClick, popoverPlacement, keyboard) {
// dispatch(isUserTouching() ? openModal('ACTIONS', {
// status,
// actions: items,
// onClick: onItemClick,
// }) : openPopover(id, popoverPlacement, keyboard))
},
onClose(id) {
dispatch(closeModal())
dispatch(closePopover(id))
},
const mapDispatchToProps = (dispatch) => ({
onClose: (type) => dispatch(closePopover(type)),
})
export default
@@ -44,10 +31,8 @@ class PopoverBase extends ImmutablePureComponent {
status: ImmutablePropTypes.map,
isUserTouching: PropTypes.func,
isModalOpen: PropTypes.bool.isRequired,
onOpen: PropTypes.func.isRequired,
onClose: PropTypes.func.isRequired,
position: PropTypes.string,
openPopoverType: PropTypes.string,
visible: PropTypes.bool,
targetRef: PropTypes.node,
innerRef: PropTypes.oneOfType([
@@ -61,23 +46,57 @@ class PopoverBase extends ImmutablePureComponent {
position: 'bottom',
}
state = {
id: id++,
componentDidMount() {
document.addEventListener('click', this.handleDocumentClick, false)
document.addEventListener('keydown', this.handleKeyDown, false)
document.addEventListener('touchend', this.handleDocumentClick, listenerOptions)
}
handleClose = () => {
this.props.onClose(this.state.id)
componentWillUnmount() {
document.removeEventListener('click', this.handleDocumentClick, false)
document.removeEventListener('keydown', this.handleKeyDown, false)
document.removeEventListener('touchend', this.handleDocumentClick, listenerOptions)
}
handleKeyDown = e => {
handleDocumentClick = (e) => {
const { targetRef, visible, onClose } = this.props
const containsTargetRef = !targetRef ? false : targetRef.contains(e.target)
if (this.node && !this.node.contains(e.target) && !containsTargetRef && visible) {
onClose()
}
}
handleKeyDown = (e) => {
const items = Array.from(this.node.getElementsByTagName('a'))
const index = items.indexOf(document.activeElement)
let element
switch (e.key) {
case 'ArrowDown':
element = items[index + 1]
if (element) element.focus()
break
case 'ArrowUp':
element = items[index - 1]
if (element) element.focus()
break
case 'Home':
element = items[0]
if (element) element.focus()
break
case 'End':
element = items[items.length - 1]
if (element) element.focus()
break
case 'Escape':
this.handleClose()
break
}
}
handleItemClick = e => {
handleItemClick = (e) => {
const i = Number(e.currentTarget.getAttribute('data-index'))
const { action, to } = this.props.items[i]
@@ -92,17 +111,16 @@ class PopoverBase extends ImmutablePureComponent {
}
}
setTargetRef = c => {
this.target = c
handleClose = () => {
this.props.onClose()
}
findTarget = () => {
return this.target
}
componentWillUnmount = () => {
if (this.state.id === this.props.openPopoverType) {
this.handleClose()
setRef = (n) => {
try {
this.node = n
this.props.innerRef = n
} catch (error) {
//
}
}
@@ -111,12 +129,10 @@ class PopoverBase extends ImmutablePureComponent {
children,
visible,
position,
openPopoverType,
targetRef,
innerRef,
} = this.props
const containerClasses = cx({
const containerClasses = CX({
default: 1,
z4: 1,
displayNone: !visible,
@@ -131,7 +147,7 @@ class PopoverBase extends ImmutablePureComponent {
{({ ref, style, placement, arrowProps }) => (
<div ref={ref} style={style} data-placement={placement} className={[_s.mt5, _s.mb5, _s.boxShadowPopover].join(' ')}>
<div ref={arrowProps.ref} style={arrowProps.style} />
<div ref={innerRef} data-popover='true' onKeyDown={this.handleKeyDown} className={containerClasses}>
<div ref={this.setRef} data-popover='true' onKeyDown={this.handleKeyDown} className={containerClasses}>
{children}
</div>
</div>

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

@@ -1,5 +1,3 @@
import detectPassiveEvents from 'detect-passive-events'
import { closePopover } from '../../actions/popover'
import {
POPOVER_CONTENT_WARNING,
POPOVER_DATE_PICKER,
@@ -31,8 +29,6 @@ import {
import Bundle from '../../features/ui/util/bundle'
import PopoverBase from './popover_base'
const listenerOptions = detectPassiveEvents.hasSupport ? { passive: true } : false
const POPOVER_COMPONENTS = {}
POPOVER_COMPONENTS[POPOVER_CONTENT_WARNING] = ContentWarningPopover
POPOVER_COMPONENTS[POPOVER_DATE_PICKER] = DatePickerPopover
@@ -52,108 +48,23 @@ const mapStateToProps = (state) => ({
props: state.getIn(['popover', 'popoverProps'], {}),
})
const mapDispatchToProps = (dispatch) => ({
onClose(optionalType) {
dispatch(closePopover(optionalType))
},
})
export default
@connect(mapStateToProps, mapDispatchToProps)
@connect(mapStateToProps)
class PopoverRoot extends PureComponent {
static propTypes = {
type: PropTypes.string,
props: PropTypes.object,
onClose: PropTypes.func.isRequired,
}
// getSnapshotBeforeUpdate() {
// return { visible: !!this.props.type }
// }
static contextTypes = {
router: PropTypes.object,
}
static propTypes = {
onClose: PropTypes.func.isRequired,
}
handleDocumentClick = e => {
if (this.node && !this.node.contains(e.target)) {
this.props.onClose()
getSnapshotBeforeUpdate() {
return {
visible: !!this.props.type
}
}
componentDidMount() {
document.addEventListener('click', this.handleDocumentClick, false)
document.addEventListener('keydown', this.handleKeyDown, false)
document.addEventListener('touchend', this.handleDocumentClick, listenerOptions)
}
componentWillUnmount() {
document.removeEventListener('click', this.handleDocumentClick, false)
document.removeEventListener('keydown', this.handleKeyDown, false)
document.removeEventListener('touchend', this.handleDocumentClick, listenerOptions)
}
setRef = (c) => {
this.node = c
}
handleKeyDown = e => {
const items = Array.from(this.node.getElementsByTagName('a'))
const index = items.indexOf(document.activeElement)
let element
switch (e.key) {
case 'ArrowDown':
element = items[index + 1]
if (element) element.focus()
break
case 'ArrowUp':
element = items[index - 1]
if (element) element.focus()
break
case 'Home':
element = items[0]
if (element) element.focus()
break
case 'End':
element = items[items.length - 1]
if (element) element.focus()
break
}
}
handleItemKeyDown = e => {
if (e.key === 'Enter') {
this.handleClick(e)
}
}
handleClick = e => {
const i = Number(e.currentTarget.getAttribute('data-index'))
const { action, to } = this.props.items[i]
this.props.onClose()
if (typeof action === 'function') {
e.preventDefault()
action(e)
} else if (to) {
e.preventDefault()
this.context.router.history.push(to)
}
}
renderError = () => {
return null
}
renderLoading = () => {
return null
renderEmpty = () => {
return <div />
}
render() {
@@ -170,8 +81,8 @@ class PopoverRoot extends PureComponent {
visible &&
<Bundle
fetchComponent={POPOVER_COMPONENTS[type]}
loading={this.renderLoading()}
error={this.renderError}
loading={this.renderEmpty}
error={this.renderEmpty}
renderDelay={200}
>
{

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

@@ -23,7 +23,7 @@ import List from '../list'
const messages = defineMessages({
unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },
blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Block entire domain' },
blockAndReport: { id: 'confirmations.block.block_and_report', defaultMessage: 'Block & Report' },
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
follow: { id: 'account.follow', defaultMessage: 'Follow' },
@@ -39,13 +39,13 @@ const messages = defineMessages({
report: { id: 'account.report', defaultMessage: 'Report @{name}' },
share: { id: 'account.share', defaultMessage: 'Share @{name}\'s profile' },
media: { id: 'account.media', defaultMessage: 'Media' },
blockDomain: { id: 'account.block_domain', defaultMessage: 'Hide everything from {domain}' },
unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unhide {domain}' },
blockDomain: { id: 'account.block_domain', defaultMessage: 'Block domain {domain}' },
unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unblock domain {domain}' },
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' },
domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Hidden domains' },
domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Blocked domains' },
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
admin_account: { id: 'admin_account', defaultMessage: 'Open moderation interface' },
add_or_remove_from_list: { id: 'account.add_or_remove_from_list', defaultMessage: 'Add or Remove from lists' },

103
app/javascript/gabsocial/components/popover/repost_options_popover.js
View File

@@ -1,94 +1,121 @@
import ImmutablePureComponent from 'react-immutable-pure-component'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { defineMessages, injectIntl } from 'react-intl'
import {
MODAL_BOOST,
MODAL_CONFIRM,
MODAL_UNAUTHORIZED,
} from '../../constants'
import { boostModal, me } from '../../initial_state'
import { quoteCompose } from '../../actions/compose'
import { repost, unrepost } from '../../actions/interactions'
import { closePopover } from '../../actions/popover'
import { openModal } from '../../actions/modal'
import { boostModal, me } from '../../initial_state'
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
repost: { id: 'repost', defaultMessage: 'Repost' },
removeRepost: { id: 'status.cancel_repost_private', defaultMessage: 'Remove Repost' },
repostWithComment: { id: 'repost_with_comment', defaultMessage: 'Repost with comment' },
});
quoteMessage: { id: 'confirmations.quote.message', defaultMessage: 'Quoting now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
quoteConfirm: { id: 'confirmations.quote.confirm', defaultMessage: 'Quote' },
})
const mapDispatchToProps = (dispatch, { intl }) => ({
onQuote (status, router) {
if (!me) return dispatch(openModal('UNAUTHORIZED'))
if (!me) return dispatch(openModal(MODAL_UNAUTHORIZED))
dispatch(closePopover())
dispatch((_, getState) => {
const state = getState();
const state = getState()
if (state.getIn(['compose', 'text']).trim().length !== 0) {
dispatch(openModal('CONFIRM', {
dispatch(openModal(MODAL_CONFIRM, {
message: intl.formatMessage(messages.quoteMessage),
confirm: intl.formatMessage(messages.quoteConfirm),
onConfirm: () => dispatch(quoteCompose(status, router)),
}));
}))
} else {
dispatch(quoteCompose(status, router));
dispatch(quoteCompose(status, router))
}
});
})
},
onRepost (status) {
if (!me) return dispatch(openModal('UNAUTHORIZED'))
if (!me) return dispatch(openModal(MODAL_UNAUTHORIZED))
if (status.get('reblogged')) {
dispatch(unrepost(status));
dispatch(closePopover())
const alreadyReposted = status.get('reblogged')
if (boostModal && !alreadyReposted) {
dispatch(openModal(MODAL_BOOST, {
status,
onRepost: () => dispatch(repost(status)),
}))
} else {
dispatch(repost(status));
if (alreadyReposted) {
dispatch(unrepost(status))
} else {
dispatch(repost(status))
}
}
},
});
})
export default
@injectIntl
@connect(null, mapDispatchToProps)
class RepostOptionsPopover extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
}
static defaultProps = {
intl: PropTypes.object.isRequired,
status: ImmutablePropTypes.map.isRequired,
onQuote: PropTypes.func.isRequired,
onRepost: PropTypes.func.isRequired,
status: ImmutablePropTypes.map.isRequired,
}
updateOnProps = ['status']
handleOnRepost = () => {
}
updateOnProps = [
'status',
]
handleOnQuote = () => {
this.props.onQuote(this.props.status, this.context.router.history)
}
handleOnRepost = () => {
this.props.onRepost(this.props.status)
}
render() {
const { intl } = this.props
const { intl, status } = this.props
const listItems = [
{
hideArrow: true,
icon: 'repost',
title: intl.formatMessage(messages.repost),
onClick: this.handleOnRepost,
},
{
hideArrow: true,
icon: 'pencil',
title: intl.formatMessage(messages.repostWithComment),
onClick: this.handleBlockDomain,
}
]
const alreadyReposted = status.get('reblogged')
return (
<PopoverLayout width={220}>
<List
scrollKey='repost_options'
items={listItems}
size='large'
items={[
{
hideArrow: true,
icon: 'repost',
title: intl.formatMessage(!alreadyReposted ? messages.repost : messages.removeRepost),
onClick: this.handleOnRepost,
},
{
hideArrow: true,
icon: 'pencil',
title: intl.formatMessage(messages.repostWithComment),
onClick: this.handleOnQuote,
}
]}
/>
</PopoverLayout>
)

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

@@ -8,18 +8,16 @@ import List from '../list'
const messages = defineMessages({
delete: { id: 'status.delete', defaultMessage: 'Delete' },
edit: { id: 'status.edit', defaultMessage: 'Edit' },
mention: { id: 'status.mention', defaultMessage: 'Mention @{name}' },
mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' },
block: { id: 'account.block', defaultMessage: 'Block @{name}' },
reply: { id: 'status.reply', defaultMessage: 'Reply' },
comment: { id: 'status.comment', defaultMessage: 'Comment' },
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_private', defaultMessage: 'Repost to original audience' },
cancel_repost_private: { id: 'status.cancel_repost_private', defaultMessage: 'Un-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' },
@@ -34,9 +32,19 @@ const messages = defineMessages({
group_remove_post: { id: 'status.remove_post_from_group', defaultMessage: 'Remove status from group' },
})
const mapStateToProps = (state) => ({
})
const mapDispatchToProps = (dispatch) => ({
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class StatusOptionsPopover extends ImmutablePureComponent {
static propTypes = {
status: ImmutablePropTypes.map.isRequired,
account: ImmutablePropTypes.map.isRequired,
@@ -56,7 +64,10 @@ class StatusOptionsPopover extends ImmutablePureComponent {
intl: PropTypes.object.isRequired,
}
updateOnProps = ['status', 'account']
updateOnProps = [
'status',
'account',
]
handleConversationMuteClick = () => {
this.props.onMuteConversation(this.props.status);
@@ -111,7 +122,7 @@ class StatusOptionsPopover extends ImmutablePureComponent {
}
}
getItems = () => {
render() {
const {
status,
intl,
@@ -123,114 +134,104 @@ class StatusOptionsPopover extends ImmutablePureComponent {
let menu = [];
if (!me) return menu
if (me) {
// if (status.getIn(['account', 'id']) === me) {
menu.push({
icon: 'audio-mute',
hideArrow: true,
title: intl.formatMessage(mutingConversation ? messages.unmuteConversation : messages.muteConversation),
onClick: this.handleConversationMuteClick,
})
// }
if (status.getIn(['account', 'id']) === me) {
menu.push({
icon: 'mute',
hideArrow: true,
title: intl.formatMessage(mutingConversation ? messages.unmuteConversation : messages.muteConversation),
onClick: this.handleConversationMuteClick,
})
}
if (status.getIn(['account', 'id']) === me) {
if (publicStatus) {
// if (status.getIn(['account', 'id']) === me) {
// if (publicStatus) {
menu.push({
icon: 'pin',
hideArrow: true,
title: intl.formatMessage(status.get('pinned') ? messages.unpin : messages.pin),
onClick: this.handlePinClick,
})
// } else {
// if (status.get('visibility') === 'private') {
menu.push({
icon: 'repost',
hideArrow: true,
title: intl.formatMessage(status.get('reblogged') ? messages.cancel_repost_private : messages.repost_private),
onClick: this.handleRepostClick
})
// }
// }
menu.push({
icon: 'trash',
hideArrow: true,
title: intl.formatMessage(messages.delete),
action: this.handleDeleteClick
});
menu.push({
icon: 'pencil',
hideArrow: true,
title: intl.formatMessage(messages.edit), action:
this.handleEditClick
});
// } else {
menu.push({
icon: 'audio-mute',
hideArrow: true,
title: intl.formatMessage(messages.mute, { name: status.getIn(['account', 'username']) }),
action: this.handleMuteClick
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(status.get('pinned') ? messages.unpin : messages.pin),
onClick: this.handlePinClick,
})
} else {
if (status.get('visibility') === 'private') {
title: intl.formatMessage(messages.block, { name: status.getIn(['account', 'username']) }),
action: this.handleBlockClick
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.report, { name: status.getIn(['account', 'username']) }),
action: this.handleReport
});
// : todo :
// if (withGroupAdmin) {
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(status.get('reblogged') ? messages.cancel_repost_private : messages.repost_private),
onClick: this.handleRepostClick
})
}
}
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.delete),
action: this.handleDeleteClick
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.edit), action:
this.handleEditClick
});
} else {
menu.push({
icon: 'comment',
hideArrow: true,
title: intl.formatMessage(messages.mention, { name: status.getIn(['account', 'username']) }),
action: this.handleMentionClick
});
menu.push({
icon: 'mute',
hideArrow: true,
title: intl.formatMessage(messages.mute, { name: status.getIn(['account', 'username']) }),
action: this.handleMuteClick
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.block, { name: status.getIn(['account', 'username']) }),
action: this.handleBlockClick
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.report, { name: status.getIn(['account', 'username']) }),
action: this.handleReport
});
title: intl.formatMessage(messages.group_remove_account),
action: this.handleGroupRemoveAccount
});
menu.push({
icon: 'circle',
hideArrow: true,
title: intl.formatMessage(messages.group_remove_post),
action: this.handleGroupRemovePost
});
// }
// if (withGroupAdmin) {
// menu.push({
// icon: 'circle',
// hideArrow: true,
// title: intl.formatMessage(messages.group_remove_account),
// action: this.handleGroupRemoveAccount
// });
// menu.push({
// icon: 'circle',
// hideArrow: true,
// title: intl.formatMessage(messages.group_remove_post),
// action: this.handleGroupRemovePost
// });
// if (isStaff) {
menu.push({
title: intl.formatMessage(messages.admin_account, { name: status.getIn(['account', 'username']) }),
href: `/admin/accounts/${status.getIn(['account', 'id'])}`
});
menu.push({
title: intl.formatMessage(messages.admin_status),
href: `/admin/accounts/${status.getIn(['account', 'id'])}/statuses/${status.get('id')}`
});
// }
// }
if (isStaff) {
menu.push({
title: intl.formatMessage(messages.admin_account, { name: status.getIn(['account', 'username']) }),
href: `/admin/accounts/${status.getIn(['account', 'id'])}`
});
menu.push({
title: intl.formatMessage(messages.admin_status),
href: `/admin/accounts/${status.getIn(['account', 'id'])}/statuses/${status.get('id')}`
});
}
}
return menu;
}
render() {
const items = this.getItems()
return (
<PopoverLayout className={_s.width240PX}>
<List
size='large'
scrollKey='profile_options'
items={items}
items={menu}
/>
</PopoverLayout>
)
}
}

80
app/javascript/gabsocial/components/popover/status_share_popover.js
View File

@@ -1,65 +1,71 @@
import ImmutablePropTypes from 'react-immutable-proptypes'
import ImmutablePureComponent from 'react-immutable-pure-component'
import { defineMessages, injectIntl } from 'react-intl'
import { closePopover } from '../../actions/popover'
import { openModal } from '../../actions/modal'
import {
MODAL_EMBED,
POPOVER_STATUS_SHARE,
} from '../../constants'
import PopoverLayout from './popover_layout'
import List from '../list'
const messages = defineMessages({
embed: { id: 'status.embed', defaultMessage: 'Embed gab' },
email: { id: 'status.email', defaultMessage: 'Email gab' },
copy: { id: 'status.copy', defaultMessage: 'Copy link to gab' },
embed: { id: 'status.embed', defaultMessage: 'Embed' },
email: { id: 'status.email', defaultMessage: 'Email this gab' },
copy: { id: 'status.copy', defaultMessage: 'Copy link to status' },
});
// const makeMapStateToProps = () => {
// const getAccount = makeGetAccount();
// const mapStateToProps = (state, { account }) => ({
// });
// return mapStateToProps;
// };
// const mapDispatchToProps = (dispatch, { intl }) => ({
// });
// : todo :
const mapDispatchToProps = (dispatch) => ({
onClosePopover: () => dispatch(closePopover(POPOVER_STATUS_SHARE)),
onOpenEmbedModal(url) {
dispatch(openModal(MODAL_EMBED, {
url,
}))
},
});
export default
@injectIntl
// @connect(makeMapStateToProps, mapDispatchToProps)
@connect(null, mapDispatchToProps)
class StatusSharePopover extends ImmutablePureComponent {
static propTypes = {
status: ImmutablePropTypes.map,
intl: PropTypes.object.isRequired,
onClosePopover: PropTypes.func.isRequired,
onOpenEmbedModal: PropTypes.func.isRequired,
}
handleEmbed = () => {
// this.props.onEmbed(this.props.status);
handleOnOpenEmbedModal = () => {
this.props.onOpenEmbedModal(this.props.status.get('url'))
this.props.onClosePopover()
}
handleCopy = () => {
// const url = this.props.status.get('url');
// const textarea = document.createElement('textarea');
const url = this.props.status.get('url');
const textarea = document.createElement('textarea');
// textarea.textContent = url;
// textarea.style.position = 'fixed';
textarea.textContent = url;
textarea.style.position = 'fixed';
// document.body.appendChild(textarea);
document.body.appendChild(textarea);
// try {
// textarea.select();
// document.execCommand('copy');
// } catch (e) {
// //
// } finally {
// document.body.removeChild(textarea);
// }
try {
textarea.select();
document.execCommand('copy');
} catch (e) {
//
}
document.body.removeChild(textarea);
this.props.onClosePopover()
}
render() {
const { intl } = this.props
const { intl, status } = this.props
const mailToHref = !status ? undefined : `mailto:?subject=&body=${status.get('url')}`
return (
<PopoverLayout width={220}>
@@ -77,13 +83,13 @@ class StatusSharePopover extends ImmutablePureComponent {
icon: 'email',
hideArrow: true,
title: intl.formatMessage(messages.email),
href: 'mailto:',
href: mailToHref,
},
{
icon: 'code',
hideArrow: true,
title: intl.formatMessage(messages.embed),
onClick: this.handleEmbed,
onClick: this.handleOnOpenEmbedModal,
},
]}
small

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

@@ -10,11 +10,11 @@ const cx = classNames.bind(_s)
const messages = defineMessages({
public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
public_long: { id: 'privacy.public.long', defaultMessage: 'Post to public timelines' },
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: 'Post to 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' },
})
@@ -43,14 +43,14 @@ class StatusVisibilityDropdown extends PureComponent {
intl: PropTypes.object.isRequired,
}
handleChange = value => {
handleChange = (value) => {
this.props.onChange(value)
}
componentDidMount () {
const { intl } = this.props
render () {
const { intl, value } = this.props
this.options = [
const options = [
{
icon: 'globe',
value: 'public',
@@ -70,18 +70,14 @@ class StatusVisibilityDropdown extends PureComponent {
subtitle: intl.formatMessage(messages.private_long)
},
]
}
render () {
const { value } = this.props
return (
<PopoverLayout className={_s.width240PX}>
<PopoverLayout width={300}>
<div className={[_s.default].join(' ')}>
{
this.options.map((option, i) => {
options.map((option, i) => {
const isActive = option.value === value
const isLast = i === this.options.length - 1
const isLast = i === options.length - 1
const containerClasses = cx({
default: 1,