Chat Extra: Add ripple to notifications switch

This commit is contained in:
Alexander Zinchuk 2021-05-12 22:22:24 +03:00
parent 81f7ab1639
commit c1b575a2d7

View File

@ -63,11 +63,6 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
} }
}, [loadFullUser, userId, lastSyncTime]); }, [loadFullUser, userId, lastSyncTime]);
const handleClick = useCallback((text: string, entity: string) => {
copyTextToClipboard(text);
showNotification({ message: `${entity} was copied` });
}, [showNotification]);
const handleNotificationChange = useCallback(() => { const handleNotificationChange = useCallback(() => {
updateChatMutedState({ chatId, isMuted: !currentIsMuted }); updateChatMutedState({ chatId, isMuted: !currentIsMuted });
}, [chatId, currentIsMuted, updateChatMutedState]); }, [chatId, currentIsMuted, updateChatMutedState]);
@ -76,6 +71,11 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
return undefined; return undefined;
} }
function copy(text: string, entity: string) {
copyTextToClipboard(text);
showNotification({ message: `${entity} was copied` });
}
const formattedNumber = phoneNumber && formatPhoneNumberWithCode(phoneNumber); const formattedNumber = phoneNumber && formatPhoneNumberWithCode(phoneNumber);
const link = getChatLink(chat); const link = getChatLink(chat);
const url = link.indexOf('http') === 0 ? link : `http://${link}`; const url = link.indexOf('http') === 0 ? link : `http://${link}`;
@ -85,7 +85,7 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
return ( return (
<div className="ChatExtra"> <div className="ChatExtra">
{formattedNumber && !!formattedNumber.length && ( {formattedNumber && !!formattedNumber.length && (
<ListItem icon="phone" multiline narrow ripple onClick={() => handleClick(formattedNumber, lang('Phone'))}> <ListItem icon="phone" multiline narrow ripple onClick={() => copy(formattedNumber, lang('Phone'))}>
<span className="title">{formattedNumber}</span> <span className="title">{formattedNumber}</span>
<span className="subtitle">{lang('Phone')}</span> <span className="subtitle">{lang('Phone')}</span>
</ListItem> </ListItem>
@ -96,7 +96,7 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
multiline multiline
narrow narrow
ripple ripple
onClick={() => handleClick(`@${printedUsername}`, lang('Username'))} onClick={() => copy(`@${printedUsername}`, lang('Username'))}
> >
<span className="title">{renderText(printedUsername)}</span> <span className="title">{renderText(printedUsername)}</span>
<span className="subtitle">{lang('Username')}</span> <span className="subtitle">{lang('Username')}</span>
@ -114,18 +114,18 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
</ListItem> </ListItem>
)} )}
{canInviteUsers && !printedUsername && !!link.length && ( {canInviteUsers && !printedUsername && !!link.length && (
<ListItem icon="mention" multiline narrow ripple onClick={() => handleClick(link, lang('SetUrlPlaceholder'))}> <ListItem icon="mention" multiline narrow ripple onClick={() => copy(link, lang('SetUrlPlaceholder'))}>
<div className="title"> <div className="title">
<SafeLink url={url} className="title" text={link} /> <SafeLink url={url} className="title" text={link} />
</div> </div>
<span className="subtitle">{lang('SetUrlPlaceholder')}</span> <span className="subtitle">{lang('SetUrlPlaceholder')}</span>
</ListItem> </ListItem>
)} )}
<ListItem icon="unmute" onClick={handleNotificationChange}> <ListItem icon="unmute" ripple onClick={handleNotificationChange}>
<span>{lang('Notifications')}</span> <span>{lang('Notifications')}</span>
<Switcher <Switcher
id="group-notifications" id="group-notifications"
label={`${userId ? 'Toggle User Notifications' : 'Toggle Chat Notifications'}`} label={userId ? 'Toggle User Notifications' : 'Toggle Chat Notifications'}
checked={!currentIsMuted} checked={!currentIsMuted}
inactive inactive
/> />