Pull password settings apart into individual components
This commit is contained in:
@@ -7,7 +7,8 @@ export const shared = {
|
||||
incorrectPassword: 'Password incorrect',
|
||||
incorrectPasswordMessage: 'That password is incorrect.',
|
||||
tryAgain: 'Try again',
|
||||
ok: 'OK'
|
||||
ok: 'OK',
|
||||
unlock: 'Unlock'
|
||||
}
|
||||
|
||||
export const settings = {
|
||||
@@ -58,7 +59,8 @@ export const settings = {
|
||||
explainerDisabled: "Encrypt the app's database with a password. You need to enter the password every time the app is started.",
|
||||
explainerEnabled: "Password protection and database encryption is currently enabled",
|
||||
setPassword: 'Set password',
|
||||
deletePassword: "Delete password",
|
||||
changePassword: 'Change password',
|
||||
deletePassword: 'Delete password',
|
||||
enterCurrent: "Please enter your current password",
|
||||
enterNew: "Please enter a new password",
|
||||
backupReminderTitle: 'Read this before making changes to your password',
|
||||
|
||||
@@ -15,7 +15,7 @@ export default class PasswordPrompt extends Component {
|
||||
}
|
||||
|
||||
nodejs.channel.addListener(
|
||||
'message',
|
||||
'check-pw',
|
||||
this.passHashToDb,
|
||||
this
|
||||
)
|
||||
@@ -27,6 +27,7 @@ export default class PasswordPrompt extends Component {
|
||||
try {
|
||||
await openDb({ persistConnection: true })
|
||||
await saveEncryptionFlag(false)
|
||||
this.props.showApp()
|
||||
} catch (err) {
|
||||
this.setState({ showPasswordPrompt: true })
|
||||
await saveEncryptionFlag(true)
|
||||
@@ -34,18 +35,16 @@ export default class PasswordPrompt extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
passHashToDb = async msg => {
|
||||
msg = JSON.parse(msg)
|
||||
if (msg.type != 'sha512') return
|
||||
passHashToDb = async hash => {
|
||||
try {
|
||||
await openDb({hash: msg.message, persistConnection: true })
|
||||
await openDb({ hash, persistConnection: true })
|
||||
} catch (err) {
|
||||
Alert.alert(
|
||||
shared.incorrectPassword,
|
||||
shared.incorrectPasswordMessage,
|
||||
[{
|
||||
text: shared.tryAgain,
|
||||
onPress: () => this.setState({password: null})
|
||||
onPress: () => this.setState({ password: null })
|
||||
}]
|
||||
)
|
||||
return
|
||||
@@ -73,6 +72,7 @@ export default class PasswordPrompt extends Component {
|
||||
text: labels.reallyDeleteData,
|
||||
onPress: async () => {
|
||||
await deleteDbAndOpenNew()
|
||||
await saveEncryptionFlag(false)
|
||||
this.props.showApp()
|
||||
}
|
||||
}]
|
||||
@@ -83,7 +83,7 @@ export default class PasswordPrompt extends Component {
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
nodejs.channel.removeListener('message', this.passHashToDb)
|
||||
nodejs.channel.removeListener('check-pw', this.passHashToDb)
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -104,7 +104,7 @@ export default class PasswordPrompt extends Component {
|
||||
<TouchableOpacity
|
||||
style={styles.passwordPromptButton}
|
||||
onPress={() => {
|
||||
requestHash(this.state.password)
|
||||
requestHash('check-pw', this.state.password)
|
||||
}}
|
||||
disabled={!this.state.password}
|
||||
>
|
||||
|
||||
@@ -11,7 +11,7 @@ import TempReminderPicker from './temp-reminder-picker'
|
||||
import TempSlider from './temp-slider'
|
||||
import openImportDialogAndImport from './import-dialog'
|
||||
import openShareDialogAndExport from './export-dialog'
|
||||
import PasswordSetting from './password-setting'
|
||||
import PasswordSetting from './password'
|
||||
|
||||
export default class Settings extends Component {
|
||||
constructor(props) {
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
import { Alert } from 'react-native'
|
||||
import { openDb } from '../../../db'
|
||||
import { shared } from '../../labels'
|
||||
|
||||
export default async function checkPassword({hash, onCancel, onTryAgain }) {
|
||||
try {
|
||||
await openDb({ hash, persistConnection: false })
|
||||
return true
|
||||
} catch (err) {
|
||||
Alert.alert(
|
||||
shared.incorrectPassword,
|
||||
shared.incorrectPasswordMessage,
|
||||
[{
|
||||
text: shared.cancel,
|
||||
onPress: onCancel
|
||||
}, {
|
||||
text: shared.tryAgain,
|
||||
onPress: onTryAgain
|
||||
}]
|
||||
)
|
||||
return false
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
import React, { Component } from 'react'
|
||||
import {
|
||||
View,
|
||||
TouchableOpacity,
|
||||
} from 'react-native'
|
||||
import nodejs from 'nodejs-mobile-react-native'
|
||||
import { AppText } from '../../app-text'
|
||||
import styles from '../../../styles'
|
||||
import { settings as labels } from '../../labels'
|
||||
import { requestHash, changeEncryptionAndRestartApp } from '../../../db'
|
||||
import PasswordField from './password-field'
|
||||
import showBackUpReminder from './show-backup-reminder'
|
||||
|
||||
export default class CreatePassword extends Component {
|
||||
constructor() {
|
||||
super()
|
||||
this.state = {
|
||||
enteringNewPassword: false,
|
||||
newPassword: null
|
||||
}
|
||||
nodejs.channel.addListener(
|
||||
'create-pw-hash',
|
||||
changeEncryptionAndRestartApp,
|
||||
this
|
||||
)
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
nodejs.channel.removeListener('create-pw-hash', changeEncryptionAndRestartApp)
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<View>
|
||||
{this.state.enteringNewPassword &&
|
||||
<PasswordField
|
||||
placeholder={labels.passwordSettings.enterNew}
|
||||
value={this.state.newPassword}
|
||||
onChangeText={val => this.setState({newPassword: val})}
|
||||
/>
|
||||
}
|
||||
<TouchableOpacity
|
||||
onPress={() => {
|
||||
if (!this.state.enteringNewPassword) {
|
||||
showBackUpReminder(() => {
|
||||
this.setState({ enteringNewPassword: true })
|
||||
})
|
||||
} else {
|
||||
requestHash('create-pw-hash', this.state.newPassword)
|
||||
}
|
||||
}}
|
||||
disabled={this.state.enteringNewPassword && !this.state.newPassword}
|
||||
style={styles.settingsButton}>
|
||||
<AppText style={styles.settingsButtonText}>
|
||||
{labels.passwordSettings.setPassword}
|
||||
</AppText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
import React, { Component } from 'react'
|
||||
import {
|
||||
View,
|
||||
TouchableOpacity
|
||||
} from 'react-native'
|
||||
import nodejs from 'nodejs-mobile-react-native'
|
||||
import { AppText } from '../../app-text'
|
||||
import styles from '../../../styles'
|
||||
import { settings as labels } from '../../labels'
|
||||
import { requestHash, changeEncryptionAndRestartApp } from '../../../db'
|
||||
import PasswordField from './password-field'
|
||||
import showBackUpReminder from './show-backup-reminder'
|
||||
import checkCurrentPassword from './check-current-password'
|
||||
|
||||
export default class DeletePassword extends Component {
|
||||
constructor() {
|
||||
super()
|
||||
this.state = {
|
||||
enteringCurrentPassword: false,
|
||||
currentPassword: null
|
||||
}
|
||||
|
||||
nodejs.channel.addListener(
|
||||
'pre-delete-pw-check',
|
||||
this.removeEncryption,
|
||||
this
|
||||
)
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
nodejs.channel.removeListener('pre-delete-pw-check', this.removeEncryption)
|
||||
}
|
||||
|
||||
removeEncryption = async hash => {
|
||||
const passwordIsCorrect = await checkCurrentPassword({
|
||||
hash,
|
||||
onTryAgain: () => this.setState({currentPassword: null}),
|
||||
onCancel: () => this.setState({
|
||||
enteringCurrentPassword: false,
|
||||
currentPassword: null
|
||||
})
|
||||
})
|
||||
|
||||
if (passwordIsCorrect) await changeEncryptionAndRestartApp()
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View>
|
||||
{this.state.enteringCurrentPassword &&
|
||||
<PasswordField
|
||||
onChangeText={val => this.setState({ currentPassword: val })}
|
||||
value={this.state.currentPassword}
|
||||
placeholder={labels.passwordSettings.enterCurrent}
|
||||
/>
|
||||
}
|
||||
<TouchableOpacity
|
||||
onPress={() => {
|
||||
if (!this.state.enteringCurrentPassword) {
|
||||
showBackUpReminder(() => {
|
||||
this.setState({ enteringCurrentPassword: true })
|
||||
})
|
||||
} else {
|
||||
requestHash('pre-delete-pw-check', this.state.currentPassword)
|
||||
}
|
||||
}}
|
||||
style={styles.settingsButton}
|
||||
>
|
||||
<AppText style={styles.settingsButtonText}>
|
||||
{labels.passwordSettings.deletePassword}
|
||||
</AppText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
import React, { Component } from 'react'
|
||||
import { View } from 'react-native'
|
||||
import CreatePassword from './create'
|
||||
import ChangePassword from './update'
|
||||
import DeletePassword from './delete'
|
||||
import { AppText } from '../../app-text'
|
||||
import {
|
||||
hasEncryptionObservable
|
||||
} from '../../../local-storage'
|
||||
import styles from '../../../styles/index'
|
||||
import { settings as labels } from '../../labels'
|
||||
|
||||
export default class PasswordSetting extends Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
showUpdateAndDelete: hasEncryptionObservable.value,
|
||||
showCreate: !hasEncryptionObservable.value
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={styles.settingsSegment}>
|
||||
|
||||
<AppText style={styles.settingsSegmentTitle}>
|
||||
{labels.passwordSettings.title}
|
||||
</AppText>
|
||||
|
||||
{this.state.showUpdateAndDelete ?
|
||||
<AppText>{labels.passwordSettings.explainerEnabled}</AppText>
|
||||
:
|
||||
<AppText>{labels.passwordSettings.explainerDisabled}</AppText>
|
||||
}
|
||||
|
||||
{this.state.showUpdateAndDelete &&
|
||||
<View>
|
||||
<ChangePassword/>
|
||||
<DeletePassword/>
|
||||
</View>
|
||||
}
|
||||
|
||||
{this.state.showCreate &&
|
||||
<CreatePassword/>
|
||||
}
|
||||
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import React from 'react'
|
||||
import { TextInput } from 'react-native'
|
||||
import styles from '../../../styles'
|
||||
|
||||
export default function PasswordField(props) {
|
||||
return (
|
||||
<TextInput
|
||||
style={styles.passwordField}
|
||||
autoFocus={true}
|
||||
secureTextEntry={true}
|
||||
onChangeText={props.onChangeText}
|
||||
value={props.value}
|
||||
placeholder={props.placeholder}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import { Alert } from 'react-native'
|
||||
import { settings as labels, shared } from '../../labels'
|
||||
|
||||
export default function showBackUpReminder(okHandler) {
|
||||
Alert.alert(
|
||||
labels.passwordSettings.backupReminderTitle,
|
||||
labels.passwordSettings.backupReminder,
|
||||
[{
|
||||
text: shared.cancel,
|
||||
style: 'cancel'
|
||||
}, {
|
||||
text: shared.ok,
|
||||
onPress: okHandler
|
||||
}]
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,129 @@
|
||||
|
||||
import React, { Component } from 'react'
|
||||
import {
|
||||
View,
|
||||
TouchableOpacity} from 'react-native'
|
||||
import nodejs from 'nodejs-mobile-react-native'
|
||||
import { AppText } from '../../app-text'
|
||||
import styles from '../../../styles'
|
||||
import { settings as labels, shared } from '../../labels'
|
||||
import { requestHash, changeEncryptionAndRestartApp } from '../../../db'
|
||||
import PasswordField from './password-field'
|
||||
import showBackUpReminder from './show-backup-reminder'
|
||||
import checkCurrentPassword from './check-current-password'
|
||||
|
||||
export default class ChangePassword extends Component {
|
||||
constructor() {
|
||||
super()
|
||||
this.state = {
|
||||
enteringCurrentPassword: false,
|
||||
currentPassword: null,
|
||||
enteringNewPassword: false,
|
||||
newPassword: null
|
||||
}
|
||||
|
||||
nodejs.channel.addListener(
|
||||
'pre-change-pw-check',
|
||||
this.openNewPasswordField,
|
||||
this
|
||||
)
|
||||
|
||||
nodejs.channel.addListener(
|
||||
'change-pw',
|
||||
changeEncryptionAndRestartApp,
|
||||
this
|
||||
)
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
nodejs.channel.removeListener('pre-change-pw-check', this.openNewPasswordField)
|
||||
nodejs.channel.removeListener('change-pw', changeEncryptionAndRestartApp)
|
||||
}
|
||||
|
||||
openNewPasswordField = async hash => {
|
||||
const passwordCorrect = await checkCurrentPassword({
|
||||
hash,
|
||||
onTryAgain: () => this.setState({ currentPassword: null }),
|
||||
onCancel: () => this.setState({
|
||||
enteringCurrentPassword: false,
|
||||
currentPassword: null
|
||||
})
|
||||
})
|
||||
|
||||
if (passwordCorrect) {
|
||||
this.setState({
|
||||
enteringCurrentPassword: false,
|
||||
currentPassword: null,
|
||||
enteringNewPassword: true
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View>
|
||||
{!this.state.enteringCurrentPassword &&
|
||||
!this.state.enteringNewPassword &&
|
||||
<TouchableOpacity
|
||||
onPress={() => showBackUpReminder(() => {
|
||||
this.setState({ enteringCurrentPassword: true })
|
||||
})}
|
||||
disabled={this.state.currentPassword}
|
||||
style={styles.settingsButton}>
|
||||
<AppText style={styles.settingsButtonText}>
|
||||
{labels.passwordSettings.changePassword}
|
||||
</AppText>
|
||||
</TouchableOpacity>
|
||||
}
|
||||
|
||||
{this.state.enteringCurrentPassword &&
|
||||
<View>
|
||||
<PasswordField
|
||||
onChangeText={val => {
|
||||
this.setState({
|
||||
currentPassword: val,
|
||||
wrongPassword: false
|
||||
})
|
||||
}}
|
||||
value={this.state.currentPassword}
|
||||
placeholder={labels.passwordSettings.enterCurrent}
|
||||
/>
|
||||
<TouchableOpacity
|
||||
onPress={() => requestHash('pre-change-pw-check', this.state.currentPassword)}
|
||||
disabled={!this.state.currentPassword}
|
||||
style={styles.settingsButton}>
|
||||
<AppText style={styles.settingsButtonText}>
|
||||
{shared.unlock}
|
||||
</AppText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
}
|
||||
|
||||
{this.state.enteringNewPassword &&
|
||||
<View>
|
||||
<PasswordField
|
||||
style={styles.passwordField}
|
||||
onChangeText={val => {
|
||||
this.setState({
|
||||
newPassword: val
|
||||
})
|
||||
}}
|
||||
value={this.state.changedPassword}
|
||||
placeholder={labels.passwordSettings.enterNew}
|
||||
/>
|
||||
|
||||
<TouchableOpacity
|
||||
onPress={() => requestHash('change-pw', this.state.newPassword)}
|
||||
disabled={ !this.state.newPassword }
|
||||
style={styles.settingsButton}>
|
||||
<AppText style={styles.settingsButtonText}>
|
||||
{labels.passwordSettings.changePassword}
|
||||
</AppText>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
}
|
||||
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
+3
-6
@@ -11,7 +11,6 @@ import {
|
||||
longAndComplicatedCycleWithCervix,
|
||||
cycleWithTempAndNoCervixShift
|
||||
} from './fixtures'
|
||||
import { saveEncryptionFlag } from '../local-storage'
|
||||
import dbSchema from './schema'
|
||||
|
||||
let db
|
||||
@@ -154,9 +153,9 @@ export function tryToImportWithoutDelete(cycleDays) {
|
||||
})
|
||||
}
|
||||
|
||||
export function requestHash(pw) {
|
||||
nodejs.channel.send(JSON.stringify({
|
||||
type: 'request-SHA512',
|
||||
export function requestHash(type, pw) {
|
||||
nodejs.channel.post('request-SHA512', JSON.stringify({
|
||||
type: type,
|
||||
message: pw
|
||||
}))
|
||||
}
|
||||
@@ -190,7 +189,6 @@ export async function changeEncryptionAndRestartApp(hash) {
|
||||
db.close()
|
||||
await fs.unlink(defaultPath)
|
||||
await fs.moveFile(copyPath, defaultPath)
|
||||
await saveEncryptionFlag(key ? true : false)
|
||||
restart.Restart()
|
||||
}
|
||||
|
||||
@@ -198,7 +196,6 @@ export async function deleteDbAndOpenNew() {
|
||||
const exists = await fs.exists(Realm.defaultPath)
|
||||
if (exists) await fs.unlink(Realm.defaultPath)
|
||||
await openDb({ persistConnection: true })
|
||||
await saveEncryptionFlag(false)
|
||||
}
|
||||
|
||||
function hashToInt8Array(hash) {
|
||||
|
||||
@@ -3,15 +3,10 @@
|
||||
const rnBridge = require('rn-bridge')
|
||||
const crypto = require('crypto')
|
||||
|
||||
rnBridge.channel.on('message', (msg) => {
|
||||
rnBridge.channel.on('request-SHA512', (msg) => {
|
||||
msg = JSON.parse(msg)
|
||||
if (msg.type === 'request-SHA512') {
|
||||
const hash = crypto.createHash('sha512')
|
||||
hash.update(msg.message)
|
||||
const result = hash.digest('hex')
|
||||
rnBridge.channel.send(JSON.stringify({
|
||||
type: 'sha512',
|
||||
message: result
|
||||
}))
|
||||
}
|
||||
const hash = crypto.createHash('sha512')
|
||||
hash.update(msg.message)
|
||||
const result = hash.digest('hex')
|
||||
rnBridge.channel.post(msg.type, result)
|
||||
})
|
||||
Reference in New Issue
Block a user