You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
98 lines
2.9 KiB
TypeScript
98 lines
2.9 KiB
TypeScript
import { isEmpty } from 'lodash';
|
|
import { useDispatch } from 'react-redux';
|
|
import styled from 'styled-components';
|
|
import { SettingsKey } from '../../data/settings-key';
|
|
import { updateHideRecoveryPasswordModal } from '../../state/ducks/modalDialog';
|
|
import { showSettingsSection } from '../../state/ducks/section';
|
|
import { SessionWrapperModal } from '../SessionWrapperModal';
|
|
import { Flex } from '../basic/Flex';
|
|
import { SessionButton, SessionButtonColor, SessionButtonType } from '../basic/SessionButton';
|
|
import { SpacerMD } from '../basic/Text';
|
|
import { Localizer } from '../basic/Localizer';
|
|
|
|
const StyledDescriptionContainer = styled.div`
|
|
width: 280px;
|
|
line-height: 120%;
|
|
`;
|
|
|
|
export type HideRecoveryPasswordDialogProps = {
|
|
state: 'firstWarning' | 'secondWarning';
|
|
};
|
|
|
|
export function HideRecoveryPasswordDialog(props: HideRecoveryPasswordDialogProps) {
|
|
const { state } = props;
|
|
|
|
const dispatch = useDispatch();
|
|
|
|
const onClose = () => {
|
|
dispatch(updateHideRecoveryPasswordModal(null));
|
|
};
|
|
|
|
const onConfirmation = async () => {
|
|
await window.setSettingValue(SettingsKey.hideRecoveryPassword, true);
|
|
onClose();
|
|
dispatch(showSettingsSection('privacy'));
|
|
};
|
|
|
|
if (isEmpty(state)) {
|
|
return null;
|
|
}
|
|
|
|
const leftButtonProps =
|
|
state === 'firstWarning'
|
|
? {
|
|
text: window.i18n('theContinue'),
|
|
buttonColor: SessionButtonColor.Danger,
|
|
onClick: () => {
|
|
dispatch(updateHideRecoveryPasswordModal({ state: 'secondWarning' }));
|
|
},
|
|
dataTestId: 'session-confirm-ok-button',
|
|
}
|
|
: {
|
|
text: window.i18n('cancel'),
|
|
onClick: onClose,
|
|
dataTestId: 'session-confirm-cancel-button',
|
|
};
|
|
|
|
const rightButtonProps =
|
|
state === 'firstWarning'
|
|
? {
|
|
text: window.i18n('cancel'),
|
|
onClick: onClose,
|
|
dataTestId: 'session-confirm-cancel-button',
|
|
}
|
|
: {
|
|
text: window.i18n('yes'),
|
|
buttonColor: SessionButtonColor.Danger,
|
|
onClick: () => {
|
|
void onConfirmation();
|
|
},
|
|
dataTestId: 'session-confirm-ok-button',
|
|
};
|
|
|
|
return (
|
|
<SessionWrapperModal
|
|
title={window.i18n('recoveryPasswordHidePermanently')}
|
|
onClose={onClose}
|
|
showExitIcon={false}
|
|
showHeader={true}
|
|
additionalClassName="no-body-padding"
|
|
>
|
|
<StyledDescriptionContainer>
|
|
<Localizer
|
|
token={
|
|
state === 'firstWarning'
|
|
? 'recoveryPasswordHidePermanentlyDescription1'
|
|
: 'recoveryPasswordHidePermanentlyDescription2'
|
|
}
|
|
/>
|
|
</StyledDescriptionContainer>
|
|
<SpacerMD />
|
|
<Flex container={true} justifyContent="center" alignItems="center" width="100%">
|
|
<SessionButton {...leftButtonProps} buttonType={SessionButtonType.Ghost} />
|
|
<SessionButton {...rightButtonProps} buttonType={SessionButtonType.Ghost} />
|
|
</Flex>
|
|
</SessionWrapperModal>
|
|
);
|
|
}
|