TelegramPWA/src/components/middle/PremiumRequiredPlaceholder.tsx

43 lines
1.1 KiB
TypeScript

import React, { memo } from '../../lib/teact/teact';
import { getActions, withGlobal } from '../../global';
import { getUserFirstOrLastName } from '../../global/helpers';
import { selectUser } from '../../global/selectors';
import useLang from '../../hooks/useLang';
import useLastCallback from '../../hooks/useLastCallback';
import Link from '../ui/Link';
type OwnProps = {
userId: string;
};
type StateProps = {
userName?: string;
};
function PremiumRequiredPlaceholder({ userName }: StateProps) {
const lang = useLang();
const { openPremiumModal } = getActions();
const handleOpenPremiumModal = useLastCallback(() => openPremiumModal());
return (
<div>
<div>{lang('Chat.MessagingRestrictedPlaceholder', userName)}</div>
<Link isPrimary onClick={handleOpenPremiumModal}>{lang('Chat.MessagingRestrictedPlaceholderAction')}</Link>
</div>
);
}
export default memo(withGlobal<OwnProps>(
(global, { userId }): StateProps => {
const user = selectUser(global, userId);
return {
userName: getUserFirstOrLastName(user),
};
},
)(PremiumRequiredPlaceholder));