125 lines
3.7 KiB
TypeScript
125 lines
3.7 KiB
TypeScript
import type { FC } from '../../../lib/teact/teact';
|
|
import React, {
|
|
memo, useCallback, useEffect, useState,
|
|
} from '../../../lib/teact/teact';
|
|
import { getActions, getGlobal, withGlobal } from '../../../global';
|
|
|
|
import type { ApiUser } from '../../../api/types';
|
|
import type { TabState } from '../../../global/types';
|
|
|
|
import { getUserFullName } from '../../../global/helpers';
|
|
import { selectUser } from '../../../global/selectors';
|
|
import { ensureProtocol } from '../../../util/ensureProtocol';
|
|
import renderText from '../../common/helpers/renderText';
|
|
|
|
import useCurrentOrPrev from '../../../hooks/useCurrentOrPrev';
|
|
import useLang from '../../../hooks/useLang';
|
|
|
|
import Checkbox from '../../ui/Checkbox';
|
|
import ConfirmDialog from '../../ui/ConfirmDialog';
|
|
|
|
import styles from './UrlAuthModal.module.scss';
|
|
|
|
export type OwnProps = {
|
|
modal?: TabState['urlAuth'];
|
|
};
|
|
|
|
type StateProps = {
|
|
currentUser?: ApiUser;
|
|
};
|
|
|
|
const UrlAuthModal: FC<OwnProps & StateProps> = ({
|
|
modal, currentUser,
|
|
}) => {
|
|
const { closeUrlAuthModal, acceptBotUrlAuth, acceptLinkUrlAuth } = getActions();
|
|
const [isLoginChecked, setLoginChecked] = useState(true);
|
|
const [isWriteAccessChecked, setWriteAccessChecked] = useState(true);
|
|
const currentAuth = useCurrentOrPrev(modal, false);
|
|
const { domain, botId, shouldRequestWriteAccess } = currentAuth?.request || {};
|
|
const bot = botId ? getGlobal().users.byId[botId] : undefined;
|
|
|
|
const lang = useLang();
|
|
|
|
const handleOpen = useCallback(() => {
|
|
if (modal?.url && isLoginChecked) {
|
|
const acceptAction = modal.button ? acceptBotUrlAuth : acceptLinkUrlAuth;
|
|
acceptAction({
|
|
isWriteAllowed: isWriteAccessChecked,
|
|
});
|
|
} else {
|
|
window.open(ensureProtocol(currentAuth?.url), '_blank', 'noopener');
|
|
}
|
|
closeUrlAuthModal();
|
|
}, [
|
|
modal, isLoginChecked, closeUrlAuthModal, acceptBotUrlAuth, acceptLinkUrlAuth, isWriteAccessChecked, currentAuth,
|
|
]);
|
|
|
|
const handleDismiss = useCallback(() => {
|
|
closeUrlAuthModal();
|
|
}, [closeUrlAuthModal]);
|
|
|
|
const handleLoginChecked = useCallback((value: boolean) => {
|
|
setLoginChecked(value);
|
|
setWriteAccessChecked(value);
|
|
}, [setLoginChecked]);
|
|
|
|
// Reset on re-open
|
|
useEffect(() => {
|
|
if (domain) {
|
|
setLoginChecked(true);
|
|
setWriteAccessChecked(Boolean(shouldRequestWriteAccess));
|
|
}
|
|
}, [shouldRequestWriteAccess, domain]);
|
|
|
|
return (
|
|
<ConfirmDialog
|
|
isOpen={Boolean(modal?.url)}
|
|
onClose={handleDismiss}
|
|
title={lang('OpenUrlTitle')}
|
|
confirmLabel={lang('OpenUrlTitle')}
|
|
confirmHandler={handleOpen}
|
|
>
|
|
{renderText(lang('OpenUrlAlert2', currentAuth?.url), ['links'])}
|
|
{domain && (
|
|
<Checkbox
|
|
checked={isLoginChecked}
|
|
label={(
|
|
<>
|
|
{renderText(
|
|
lang('Conversation.OpenBotLinkLogin', [domain, getUserFullName(currentUser)]),
|
|
['simple_markdown'],
|
|
)}
|
|
</>
|
|
)}
|
|
onCheck={handleLoginChecked}
|
|
className={styles.checkbox}
|
|
/>
|
|
)}
|
|
{shouldRequestWriteAccess && (
|
|
<Checkbox
|
|
checked={isWriteAccessChecked}
|
|
label={(
|
|
<>
|
|
{renderText(
|
|
lang('Conversation.OpenBotLinkAllowMessages', getUserFullName(bot)),
|
|
['simple_markdown'],
|
|
)}
|
|
</>
|
|
)}
|
|
onCheck={setWriteAccessChecked}
|
|
disabled={!isLoginChecked}
|
|
className={styles.checkbox}
|
|
/>
|
|
)}
|
|
</ConfirmDialog>
|
|
);
|
|
};
|
|
export default memo(withGlobal<OwnProps>(
|
|
(global): StateProps => {
|
|
const currentUser = selectUser(global, global.currentUserId!);
|
|
return {
|
|
currentUser,
|
|
};
|
|
},
|
|
)(UrlAuthModal));
|