86 lines
2.2 KiB
JavaScript
86 lines
2.2 KiB
JavaScript
// @flow
|
|
import * as ICONS from 'constants/icons';
|
|
import React from 'react';
|
|
import classnames from 'classnames';
|
|
import { Menu, MenuButton, MenuList, MenuItem } from '@reach/menu-button';
|
|
import Icon from 'component/common/icon';
|
|
|
|
type Props = {
|
|
claim: ?Claim,
|
|
inline?: boolean,
|
|
claimIsMine: boolean,
|
|
channelIsMuted: boolean,
|
|
channelIsBlocked: boolean,
|
|
doToggleMuteChannel: (string) => void,
|
|
doCommentModBlock: (string) => void,
|
|
doCommentModUnBlock: (string) => void,
|
|
};
|
|
|
|
function ClaimMenuList(props: Props) {
|
|
const {
|
|
claim,
|
|
inline = false,
|
|
claimIsMine,
|
|
doToggleMuteChannel,
|
|
channelIsMuted,
|
|
channelIsBlocked,
|
|
doCommentModBlock,
|
|
doCommentModUnBlock,
|
|
} = props;
|
|
const channelUri =
|
|
claim &&
|
|
(claim.value_type === 'channel'
|
|
? claim.permanent_url
|
|
: claim.signing_channel && claim.signing_channel.permanent_url);
|
|
|
|
if (!channelUri) {
|
|
return null;
|
|
}
|
|
|
|
function handleToggleMute() {
|
|
doToggleMuteChannel(channelUri);
|
|
}
|
|
|
|
function handleToggleBlock() {
|
|
if (channelIsBlocked) {
|
|
doCommentModUnBlock(channelUri);
|
|
} else {
|
|
doCommentModBlock(channelUri);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Menu>
|
|
<MenuButton
|
|
className={classnames('menu__button', { 'claim__menu-button': !inline, 'claim__menu-button--inline': inline })}
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
e.preventDefault();
|
|
}}
|
|
>
|
|
<Icon size={20} icon={ICONS.MORE_VERTICAL} />
|
|
</MenuButton>
|
|
<MenuList className="menu__list">
|
|
{!claimIsMine && (
|
|
<>
|
|
<MenuItem className="comment__menu-option" onSelect={handleToggleBlock}>
|
|
<div className="menu__link">
|
|
<Icon aria-hidden icon={ICONS.BLOCK} />
|
|
{channelIsBlocked ? __('Unblock Channel') : __('Block Channel')}
|
|
</div>
|
|
</MenuItem>
|
|
|
|
<MenuItem className="comment__menu-option" onSelect={handleToggleMute}>
|
|
<div className="menu__link">
|
|
<Icon aria-hidden icon={ICONS.MUTE} />
|
|
{channelIsMuted ? __('Unmute Channel') : __('Mute Channel')}
|
|
</div>
|
|
</MenuItem>
|
|
</>
|
|
)}
|
|
</MenuList>
|
|
</Menu>
|
|
);
|
|
}
|
|
|
|
export default ClaimMenuList;
|