add signin with mnemonic to sessionRegistration page

pull/691/head
Audric Ackermann 6 years ago
parent 25127e6c1e
commit 47101c85f7

@ -901,6 +901,12 @@
} }
}); });
Whisper.events.on('openInbox', () => {
appView.openInbox({
initialLoadComplete,
});
});
Whisper.events.on('onEditProfile', async () => { Whisper.events.on('onEditProfile', async () => {
const ourNumber = window.storage.get('primaryDevicePubKey'); const ourNumber = window.storage.get('primaryDevicePubKey');
const conversation = await ConversationController.getOrCreateAndWait( const conversation = await ConversationController.getOrCreateAndWait(

@ -1,20 +1,5 @@
/* global /* global
Whisper, Whisper,
getAccountManager,
textsecure,
setTimeout,
*/
/*
Whisper,
$,
getAccountManager,
textsecure,
i18n,
passwordUtil,
_,
setTimeout,
displayNameRegex
*/ */
/* eslint-disable more/no-then */ /* eslint-disable more/no-then */
@ -25,72 +10,22 @@
window.Whisper = window.Whisper || {}; window.Whisper = window.Whisper || {};
/* const REGISTER_INDEX = 0;
/const PROFILE_INDEX = 1;
const currentPageIndex = REGISTER_INDEX; */
Whisper.SessionRegistrationView = Whisper.View.extend({ Whisper.SessionRegistrationView = Whisper.View.extend({
className: 'session-fullscreen', className: 'session-fullscreen',
initialize() { initialize() {
this.accountManager = getAccountManager();
// Clean status in case the app closed unexpectedly
textsecure.storage.remove('secondaryDeviceStatus');
const number = textsecure.storage.user.getNumber();
if (number) {
this.$('input.number').val(number);
}
this.phoneView = new Whisper.PhoneInputView({
el: this.$('#phone-number-input'),
});
this.$('#error').hide();
this.$('.standalone-mnemonic').hide();
this.$('.standalone-secondary-device').hide();
this.render(); this.render();
// this.onGenerateMnemonic(); /*
/* const options = window.mnemonic.get_languages().map(language => {
const text = language
// Split by whitespace or underscore
.split(/[\s_]+/)
// Capitalise each word
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
.join(' ');
return `<option value="${language}">${text}</option>`;
});
this.$('#mnemonic-language').append(options);
this.$('#mnemonic-language').val('english');
this.$('#mnemonic-display-language').append(options);
this.$('#mnemonic-display-language').val('english');
this.$passwordInput = this.$('#password'); this.$passwordInput = this.$('#password');
this.$passwordConfirmationInput = this.$('#password-confirmation'); this.$passwordConfirmationInput = this.$('#password-confirmation');
this.$passwordInputError = this.$('.password-inputs .error'); this.$passwordInputError = this.$('.password-inputs .error');
this.registrationParams = {};
this.$pages = this.$('.page');
this.pairingInterval = null; this.pairingInterval = null;
this.showRegisterPage();
this.onValidatePassword();
this.onSecondaryDeviceRegistered = this.onSecondaryDeviceRegistered.bind( this.onSecondaryDeviceRegistered = this.onSecondaryDeviceRegistered.bind(
this this
); ); */
this.$('#display-name').get(0).oninput = () => {
this.sanitiseNameInput();
};
this.$('#display-name').get(0).onpaste = () => {
// Sanitise data immediately after paste because it's easier
setTimeout(() => {
this.sanitiseNameInput();
});
};
this.sanitiseNameInput(); */
}, },
render() { render() {
this.session_registration_view = new Whisper.ReactWrapperView({ this.session_registration_view = new Whisper.ReactWrapperView({
@ -123,52 +58,8 @@
'keyup #password-confirmation': 'onValidatePassword', 'keyup #password-confirmation': 'onValidatePassword',
}, },
sanitiseNameInput() {
const oldVal = this.$('#display-name').val();
const newVal = oldVal.replace(displayNameRegex, '');
this.$('#display-name').val(newVal);
if (_.isEmpty(newVal)) {
this.$('#save-button').attr('disabled', 'disabled');
return false;
}
this.$('#save-button').removeAttr('disabled');
return true;
},
async showPage(pageIndex) {
// eslint-disable-next-line func-names
this.$pages.each(function(index) {
if (index !== pageIndex) {
$(this).hide();
} else {
$(this).show();
currentPageIndex = pageIndex;
}
});
},
async showRegisterPage() {
this.registrationParams = {};
this.showPage(REGISTER_INDEX);
},
async showProfilePage(mnemonic, language) {
/* this.registrationParams = {
mnemonic,
language,
};
this.$passwordInput.val('');
this.$passwordConfirmationInput.val('');
this.onValidatePassword();
this.showPage(PROFILE_INDEX);
this.$('#display-name').focus();
},
onKeyup(event) { onKeyup(event) {
if (
currentPageIndex !== PROFILE_INDEX &&
currentPageIndex !== REGISTER_INDEX
) {
// Only want enter/escape keys to work on profile page
return;
}
const validName = this.sanitiseNameInput(); const validName = this.sanitiseNameInput();
switch (event.key) { switch (event.key) {
@ -188,60 +79,68 @@
default: default:
} }
}, },
async register(mnemonic, language) {
// Make sure the password is valid
if (this.validatePassword()) {
this.showToast(i18n('invalidPassword'));
return;
}
const input = this.trim(this.$passwordInput.val()); registerWithoutMnemonic() {
const mnemonic = this.$('#mnemonic-display').text();
const language = this.$('#mnemonic-display-language').val();
this.showProfilePage(mnemonic, language);
},
// Ensure we clear the secondary device registration status
textsecure.storage.remove('secondaryDeviceStatus');
try {
await this.resetRegistration();
await window.setPassword(input); registerWithMnemonic() {
await this.accountManager.registerSingleDevice( const mnemonic = this.$('#mnemonic').val();
mnemonic, const language = this.$('#mnemonic-language').val();
language, try {
this.trim(this.$('#display-name').val()) window.mnemonic.mn_decode(mnemonic, language);
); } catch (error) {
this.$el.trigger('openInbox'); this.$('#mnemonic').addClass('error-input');
} catch (e) { this.$('#error').text(error);
if (typeof e === 'string') { this.$('#error').show();
this.showToast(e); return;
} }
this.log(e); this.$('#error').hide();
this.$('#mnemonic').removeClass('error-input');
if (!mnemonic) {
this.log('Please provide a mnemonic word list');
} else {
this.showProfilePage(mnemonic, language);
} }
}, },
registerWithoutMnemonic() { onSaveProfile() {
const mnemonic = this.$('#mnemonic-display').text(); if (_.isEmpty(this.registrationParams)) {
const language = this.$('#mnemonic-display-language').val(); this.onBack();
this.showProfilePage(mnemonic, language); return;
}
const { mnemonic, language } = this.registrationParams;
this.register(mnemonic, language);
}, },
async onSecondaryDeviceRegistered() { */
clearInterval(this.pairingInterval); log(s) {
// Ensure the left menu is updated window.log.info(s);
Whisper.events.trigger('userChanged', { isSecondaryDevice: true }); this.$('#status').text(s);
// will re-run the background initialisation },
Whisper.events.trigger('registration_done'); displayError(error) {
this.$el.trigger('openInbox'); this.$('#error')
.hide()
.text(error)
.addClass('in')
.fadeIn();
}, },
async resetRegistration() {
await window.Signal.Data.removeAllIdentityKeys(); showToast(message) {
await window.Signal.Data.removeAllPrivateConversations(); const toast = new Whisper.MessageToastView({
Whisper.Registration.remove(); message,
// Do not remove all items since they are only set });
// at startup. toast.$el.appendTo(this.$el);
textsecure.storage.remove('identityKey'); toast.render();
textsecure.storage.remove('secondaryDeviceStatus');
window.ConversationController.reset();
await window.ConversationController.load();
Whisper.RotateSignedPreKeyListener.stop(Whisper.events);
}, },
});
})();
/*
async cancelSecondaryDevice() { async cancelSecondaryDevice() {
Whisper.events.off( Whisper.events.off(
'secondaryDeviceRegistration', 'secondaryDeviceRegistration',
@ -313,194 +212,15 @@
onError(e); onError(e);
} }
}, },
registerWithMnemonic() {
const mnemonic = this.$('#mnemonic').val();
const language = this.$('#mnemonic-language').val();
try {
window.mnemonic.mn_decode(mnemonic, language);
} catch (error) {
this.$('#mnemonic').addClass('error-input');
this.$('#error').text(error);
this.$('#error').show();
return;
}
this.$('#error').hide();
this.$('#mnemonic').removeClass('error-input');
if (!mnemonic) {
this.log('Please provide a mnemonic word list');
} else {
this.showProfilePage(mnemonic, language);
}
},
onSaveProfile() {
if (_.isEmpty(this.registrationParams)) {
this.onBack();
return;
}
const { mnemonic, language } = this.registrationParams;
this.register(mnemonic, language);
},
onBack() {
this.showRegisterPage();
},
onChangeMnemonic() {
this.$('#status').html('');
},
async onGenerateMnemonic() {
const language = this.$('#mnemonic-display-language').val();
const mnemonic = await this.accountManager.generateMnemonic(language);
this.$('#mnemonic-display').text(mnemonic);
},
onCopyMnemonic() {
window.clipboard.writeText(this.$('#mnemonic-display').text());
this.showToast(i18n('copiedMnemonic')); async onSecondaryDeviceRegistered() {
}, */ clearInterval(this.pairingInterval);
log(s) { // Ensure the left menu is updated
window.log.info(s); Whisper.events.trigger('userChanged', { isSecondaryDevice: true });
this.$('#status').text(s); // will re-run the background initialisation
}, Whisper.events.trigger('registration_done');
displayError(error) { this.$el.trigger('openInbox');
this.$('#error')
.hide()
.text(error)
.addClass('in')
.fadeIn();
},
/* onValidation() {
if (this.$('#number-container').hasClass('valid')) {
this.$('#request-sms, #request-voice').removeAttr('disabled');
} else {
this.$('#request-sms, #request-voice').prop('disabled', 'disabled');
}
},
onChangeCode() {
if (!this.validateCode()) {
this.$('#code').addClass('invalid');
} else {
this.$('#code').removeClass('invalid');
}
},
requestVoice() {
window.removeSetupMenuItems();
this.$('#error').hide();
const number = this.phoneView.validateNumber();
if (number) {
this.accountManager
.requestVoiceVerification(number)
.catch(this.displayError.bind(this));
this.$('#step2')
.addClass('in')
.fadeIn();
} else {
this.$('#number-container').addClass('invalid');
}
},
requestSMSVerification() {
window.removeSetupMenuItems();
$('#error').hide();
const number = this.phoneView.validateNumber();
if (number) {
this.accountManager
.requestSMSVerification(number)
.catch(this.displayError.bind(this));
this.$('#step2')
.addClass('in')
.fadeIn();
} else {
this.$('#number-container').addClass('invalid');
}
},
toggleSection(e) {
function focusInput() {
const inputs = $(this).find('input');
if ($(this).is(':visible')) {
if (inputs[0]) {
inputs[0].focus();
}
}
}
// Expand or collapse this panel
const $target = this.$(e.currentTarget);
const $next = $target.next();
// Toggle section visibility
$next.slideToggle('fast', focusInput);
$target.toggleClass('section-toggle-visible');
// Hide the other sections
this.$('.section-toggle')
.not($target)
.removeClass('section-toggle-visible');
this.$('.section-content')
.not($next)
.slideUp('fast');
},
validatePassword() {
const input = this.trim(this.$passwordInput.val());
const confirmationInput = this.trim(
this.$passwordConfirmationInput.val()
);
// If user hasn't set a value then skip
if (!input && !confirmationInput) {
return null;
}
const error = passwordUtil.validatePassword(input, i18n);
if (error) {
return error;
}
if (input !== confirmationInput) {
return "Password don't match";
}
return null;
}, },
onValidatePassword() {
const passwordValidation = this.validatePassword();
if (passwordValidation) {
this.$passwordInput.addClass('error-input');
this.$passwordConfirmationInput.addClass('error-input');
this.$passwordInput.removeClass('match-input');
this.$passwordConfirmationInput.removeClass('match-input');
this.$passwordInputError.text(passwordValidation); */
this.$passwordInputError.show();
} else {
this.$passwordInput.removeClass('error-input');
this.$passwordConfirmationInput.removeClass('error-input');
this.$passwordInputError.text('');
this.$passwordInputError.hide();
// Show green box around inputs that match
const input = this.trim(this.$passwordInput.val());
const confirmationInput = this.trim(
this.$passwordConfirmationInput.val()
);
if (input && input === confirmationInput) {
this.$passwordInput.addClass('match-input');
this.$passwordConfirmationInput.addClass('match-input');
} else {
this.$passwordInput.removeClass('match-input');
this.$passwordConfirmationInput.removeClass('match-input');
}
}
},
trim(value) {
return value ? value.trim() : value;
}, */
showToast(message) {
const toast = new Whisper.MessageToastView({
message,
});
toast.$el.appendTo(this.$el);
toast.render();
},
});
})();

@ -225,7 +225,7 @@
overflow-wrap: break-word; overflow-wrap: break-word;
padding: 20px 5px 20px 5px; padding: 20px 5px 20px 5px;
display: inline-block; display: inline-block;
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
} }
} }

@ -4,10 +4,27 @@ import classNames from 'classnames';
import { LocalizerType } from '../../types/Util'; import { LocalizerType } from '../../types/Util';
import { SessionInput } from './SessionInput'; import { SessionInput } from './SessionInput';
import { SessionButton, SessionButtonTypes } from './SessionButton'; import { SessionButton, SessionButtonTypes } from './SessionButton';
import { trigger } from '../../shims/events';
declare global {
interface Window {
getAccountManager: any;
mnemonic: any;
passwordUtil: any;
dcodeIO: any;
libsignal: any;
displayNameRegex: any;
Signal: any;
Whisper: any;
ConversationController: any;
setPassword: any;
}
}
declare var textsecure: any;
interface Props { interface Props {
i18n: LocalizerType; i18n: LocalizerType;
//onItemClick?: (event: ItemClickEvent) => void;
} }
enum SignInMode { enum SignInMode {
@ -24,10 +41,13 @@ interface State {
selectedTab: 'create' | 'signin'; selectedTab: 'create' | 'signin';
signInMode: SignInMode; signInMode: SignInMode;
signUpMode: SignUpMode; signUpMode: SignUpMode;
seed: string;
displayName: string; displayName: string;
password: string; password: string;
validatePassword: string; validatePassword: string;
passwordErrorString: string;
passwordFieldsMatch: boolean;
mnemonicSeed: string;
hexEncodedPubKey: string;
} }
interface TabSelectEvent { interface TabSelectEvent {
@ -66,6 +86,8 @@ const Tab = ({
}; };
export class RegistrationTabs extends React.Component<Props, State> { export class RegistrationTabs extends React.Component<Props, State> {
private readonly accountManager: any;
constructor(props: any) { constructor(props: any) {
super(props); super(props);
@ -73,16 +95,27 @@ export class RegistrationTabs extends React.Component<Props, State> {
this.onDisplayNameChanged = this.onDisplayNameChanged.bind(this); this.onDisplayNameChanged = this.onDisplayNameChanged.bind(this);
this.onPasswordChanged = this.onPasswordChanged.bind(this); this.onPasswordChanged = this.onPasswordChanged.bind(this);
this.onPasswordVerifyChanged = this.onPasswordVerifyChanged.bind(this); this.onPasswordVerifyChanged = this.onPasswordVerifyChanged.bind(this);
this.onSignUpGenerateSessionIDClick = this.onSignUpGenerateSessionIDClick.bind(
this
);
this.onSignUpGetStartedClick = this.onSignUpGetStartedClick.bind(this);
this.state = { this.state = {
selectedTab: 'create', selectedTab: 'create',
signInMode: SignInMode.Default, signInMode: SignInMode.Default,
signUpMode: SignUpMode.Default, signUpMode: SignUpMode.Default,
seed: '',
displayName: '', displayName: '',
password: '', password: '',
validatePassword: '', validatePassword: '',
passwordErrorString: '',
passwordFieldsMatch: false,
mnemonicSeed: '',
hexEncodedPubKey: '',
}; };
this.accountManager = window.getAccountManager();
// Clean status in case the app closed unexpectedly
textsecure.storage.remove('secondaryDeviceStatus');
} }
public render() { public render() {
@ -122,15 +155,17 @@ export class RegistrationTabs extends React.Component<Props, State> {
}; };
private onSeedChanged(val: string) { private onSeedChanged(val: string) {
this.setState({ seed: val }); this.setState({ mnemonicSeed: val });
} }
private onDisplayNameChanged(val: string) { private onDisplayNameChanged(val: string) {
this.setState({ displayName: val }); const sanitizedName = this.sanitiseNameInput(val);
this.setState({ displayName: sanitizedName });
} }
private onPasswordChanged(val: string) { private onPasswordChanged(val: string) {
this.setState({ password: val }); this.setState({ password: val });
this.onValidatePassword(); // FIXME add bubbles or something to help the user know what he did wrong
} }
private onPasswordVerifyChanged(val: string) { private onPasswordVerifyChanged(val: string) {
@ -163,7 +198,7 @@ export class RegistrationTabs extends React.Component<Props, State> {
<div className="session-registration__unique-session-id"> <div className="session-registration__unique-session-id">
{i18n('yourUniqueSessionID')} {i18n('yourUniqueSessionID')}
</div> </div>
{this.renderEnterSessionID(false)} {this.renderEnterSessionID(false, this.state.hexEncodedPubKey)}
{this.renderSignUpButton()} {this.renderSignUpButton()}
{this.getRenderTermsConditionAgreement()} {this.getRenderTermsConditionAgreement()}
</div> </div>
@ -210,10 +245,12 @@ export class RegistrationTabs extends React.Component<Props, State> {
return ( return (
<SessionButton <SessionButton
onClick={() => { onClick={async () => {
this.setState({ if (signUpMode === SignUpMode.Default) {
signUpMode: SignUpMode.SessionIDGenerated, await this.onSignUpGenerateSessionIDClick();
}); } else {
this.onSignUpGetStartedClick();
}
}} }}
buttonType={buttonType} buttonType={buttonType}
text={buttonText} text={buttonText}
@ -221,6 +258,42 @@ export class RegistrationTabs extends React.Component<Props, State> {
); );
} }
private async onSignUpGenerateSessionIDClick() {
this.setState({
signUpMode: SignUpMode.SessionIDGenerated,
});
const language = 'english';
const mnemonic = await this.accountManager.generateMnemonic(language);
let seedHex = window.mnemonic.mn_decode(mnemonic, language);
// handle shorter than 32 bytes seeds
const privKeyHexLength = 32 * 2;
if (seedHex.length !== privKeyHexLength) {
seedHex = seedHex.concat(seedHex);
seedHex = seedHex.substring(0, privKeyHexLength);
}
const privKeyHex = window.mnemonic.sc_reduce32(seedHex);
const privKey = window.dcodeIO.ByteBuffer.wrap(
privKeyHex,
'hex'
).toArrayBuffer();
const keyPair = await window.libsignal.Curve.async.createKeyPair(privKey);
const hexEncodedPubKey = Buffer.from(keyPair.pubKey).toString('hex');
this.setState({
mnemonicSeed: mnemonic,
hexEncodedPubKey, // our 'frontend' sessionID
});
}
private onSignUpGetStartedClick() {
this.setState({
selectedTab: 'signin',
signInMode: SignInMode.UsingSeed,
});
}
private renderSignIn() { private renderSignIn() {
return ( return (
<div className="session-registration__content"> <div className="session-registration__content">
@ -243,7 +316,7 @@ export class RegistrationTabs extends React.Component<Props, State> {
label={i18n('mnemonicSeed')} label={i18n('mnemonicSeed')}
type="password" type="password"
placeholder={i18n('enterSeed')} placeholder={i18n('enterSeed')}
value={this.state.seed} value={this.state.mnemonicSeed}
enableShowHide={true} enableShowHide={true}
onValueChanged={(val: string) => { onValueChanged={(val: string) => {
this.onSeedChanged(val); this.onSeedChanged(val);
@ -266,6 +339,7 @@ export class RegistrationTabs extends React.Component<Props, State> {
this.onPasswordChanged(val); this.onPasswordChanged(val);
}} }}
/> />
<SessionInput <SessionInput
label={i18n('verifyPassword')} label={i18n('verifyPassword')}
type="password" type="password"
@ -290,7 +364,7 @@ export class RegistrationTabs extends React.Component<Props, State> {
} }
} }
private renderEnterSessionID(contentEditable: boolean) { private renderEnterSessionID(contentEditable: boolean, text?: string) {
const { i18n } = this.props; const { i18n } = this.props;
const enterSessionIDHere = i18n('enterSessionIDHere'); const enterSessionIDHere = i18n('enterSessionIDHere');
@ -299,7 +373,9 @@ export class RegistrationTabs extends React.Component<Props, State> {
className="session-signin-enter-session-id" className="session-signin-enter-session-id"
contentEditable={contentEditable} contentEditable={contentEditable}
placeholder={enterSessionIDHere} placeholder={enterSessionIDHere}
/> >
{text}
</div>
); );
} }
@ -308,56 +384,212 @@ export class RegistrationTabs extends React.Component<Props, State> {
const { i18n } = this.props; const { i18n } = this.props;
const or = i18n('or'); const or = i18n('or');
let greenButtonType: any;
let greenText: string; if (signInMode === SignInMode.Default) {
let whiteButtonText: string; return (
if (signInMode !== SignInMode.Default) { <div>
greenButtonType = SessionButtonTypes.FullGreen; {this.renderRestoreUsingSeedButton(SessionButtonTypes.Green)}
greenText = i18n('continueYourSession'); <div className="session-registration__or">{or}</div>
} else { {this.renderLinkDeviceToExistingAccountButton()}
greenButtonType = SessionButtonTypes.Green; </div>
greenText = i18n('restoreUsingSeed'); );
} }
if (signInMode === SignInMode.LinkingDevice) { if (signInMode === SignInMode.LinkingDevice) {
whiteButtonText = i18n('restoreUsingSeed'); return (
} else { <div>
whiteButtonText = i18n('linkDeviceToExistingAccount'); {this.renderContinueYourSessionButton()}
<div className="session-registration__or">{or}</div>
{this.renderRestoreUsingSeedButton(SessionButtonTypes.White)}
</div>
);
} }
return ( return (
<div> <div>
{this.renderContinueYourSessionButton()}
<div className="session-registration__or">{or}</div>
{this.renderLinkDeviceToExistingAccountButton()}
</div>
);
}
private renderTermsConditionAgreement() {
// FIXME link to our Terms and Conditions and privacy statement
// FIXME find a better way than dangerouslySetInnerHTML to set this in a localized way
return (
<div className="session-terms-conditions-agreement">
By using this service, you agree to our <a>Terms and Conditions</a> and{' '}
<a>Privacy Statement</a>
</div>
);
}
private renderContinueYourSessionButton() {
return (
<SessionButton
// tslint:disable-next-line: no-empty
onClick={async () => {
await this.register('english');
}}
buttonType={SessionButtonTypes.FullGreen}
text={this.props.i18n('continueYourSession')}
/>
);
}
private renderRestoreUsingSeedButton(buttonType: SessionButtonTypes) {
return (
<SessionButton <SessionButton
onClick={() => { onClick={() => {
this.setState({ this.setState({
signInMode: SignInMode.UsingSeed, signInMode: SignInMode.UsingSeed,
hexEncodedPubKey: '',
mnemonicSeed: '',
displayName: '',
signUpMode: SignUpMode.Default,
}); });
}} }}
buttonType={greenButtonType} buttonType={buttonType}
text={greenText} text={this.props.i18n('restoreUsingSeed')}
/> />
<div className="session-registration__or">{or}</div> );
}
private renderLinkDeviceToExistingAccountButton() {
return (
<SessionButton <SessionButton
onClick={() => { onClick={() => {
this.setState({ this.setState({
signInMode: SignInMode.LinkingDevice, signInMode: SignInMode.LinkingDevice,
hexEncodedPubKey: '',
mnemonicSeed: '',
displayName: '',
signUpMode: SignUpMode.Default,
}); });
}} }}
buttonType={SessionButtonTypes.White} buttonType={SessionButtonTypes.White}
text={whiteButtonText} text={this.props.i18n('linkDeviceToExistingAccount')}
/> />
</div>
); );
} }
private renderTermsConditionAgreement() { private trim(value: string) {
// FIXME link to our Terms and Conditions and privacy statement return value ? value.trim() : value;
// FIXME find a better way than dangerouslySetInnerHTML to set this in a localized way }
return ( private validatePassword() {
<div className="session-terms-conditions-agreement"> const input = this.trim(this.state.password);
By using this service, you agree to our <a>Terms and Conditions</a> and{' '} const confirmationInput = this.trim(this.state.validatePassword);
<a>Privacy Statement</a>
</div> // If user hasn't set a value then skip
if (!input && !confirmationInput) {
return null;
}
const error = window.passwordUtil.validatePassword(input, this.props.i18n);
if (error) {
return error;
}
if (input !== confirmationInput) {
return "Password don't match";
}
return null;
}
private onValidatePassword() {
const passwordValidation = this.validatePassword();
if (passwordValidation) {
this.setState({ passwordErrorString: passwordValidation });
/*this.$passwordInput.addClass('error-input');
this.$passwordConfirmationInput.addClass('error-input');
this.$passwordInput.removeClass('match-input');
this.$passwordConfirmationInput.removeClass('match-input');
this.$passwordInputError.text(passwordValidation);
this.$passwordInputError.show();*/
} else {
// Show green box around inputs that match
const input = this.trim(this.state.password);
const confirmationInput = this.trim(this.state.validatePassword);
const passwordFieldsMatch =
input !== undefined && input === confirmationInput;
this.setState({
passwordErrorString: '',
passwordFieldsMatch,
});
/*
this.$passwordInput.addClass('match-input'); //if password matches each other
this.$passwordInput.removeClass('error-input');
this.$passwordConfirmationInput.removeClass('error-input');
this.$passwordInputError.text('');
this.$passwordInputError.hide();*/
}
}
private sanitiseNameInput(val: string) {
return val.trim().replace(window.displayNameRegex, '');
/* if (_.isEmpty(newVal)) {
this.$('#save-button').attr('disabled', 'disabled');
}
this.$('#save-button').removeAttr('disabled'); */
}
private async resetRegistration() {
await window.Signal.Data.removeAllIdentityKeys();
await window.Signal.Data.removeAllPrivateConversations();
window.Whisper.Registration.remove();
// Do not remove all items since they are only set
// at startup.
textsecure.storage.remove('identityKey');
textsecure.storage.remove('secondaryDeviceStatus');
window.ConversationController.reset();
await window.ConversationController.load();
window.Whisper.RotateSignedPreKeyListener.stop(window.Whisper.events);
}
private async register(language: string) {
const { password, mnemonicSeed, displayName } = this.state;
// Make sure the password is valid
if (this.validatePassword()) {
//this.showToast(i18n('invalidPassword'));
return;
}
if (!mnemonicSeed) {
return;
}
if (!displayName) {
return;
}
// Ensure we clear the secondary device registration status
textsecure.storage.remove('secondaryDeviceStatus');
try {
await this.resetRegistration();
await window.setPassword(password);
await this.accountManager.registerSingleDevice(
mnemonicSeed,
language,
displayName
); );
trigger('openInbox');
} catch (e) {
if (typeof e === 'string') {
//this.showToast(e);
}
//this.log(e);
}
} }
} }

@ -25,6 +25,7 @@ export class SessionRegistrationView extends React.Component<Props> {
return ( return (
<div className="session-content"> <div className="session-content">
<div id="error" className="collapse" />
<div className="session-content-accent"> <div className="session-content-accent">
<AccentText showSubtitle={showSubtitle || true} i18n={i18n} /> <AccentText showSubtitle={showSubtitle || true} i18n={i18n} />
</div> </div>

Loading…
Cancel
Save