9c0df36e16
* style: enforce sorting of imports * style: alphabetize imports * style: merge duplicated imports
105 lines
2.5 KiB
JavaScript
105 lines
2.5 KiB
JavaScript
import React, { useState } from 'react';
|
|
import { useDispatch } from 'react-redux';
|
|
import { useHistory } from 'react-router-dom';
|
|
|
|
import { send } from 'loot-core/src/platform/client/fetch';
|
|
import { View, Text, Button } from 'loot-design/src/components/common';
|
|
import { colors } from 'loot-design/src/style';
|
|
|
|
import { Title } from './common';
|
|
import { ConfirmPasswordForm } from './ConfirmPasswordForm';
|
|
|
|
export default function ChangePassword() {
|
|
let dispatch = useDispatch();
|
|
let history = useHistory();
|
|
let [error, setError] = useState(null);
|
|
let [msg, setMessage] = useState(null);
|
|
|
|
function getErrorMessage(error) {
|
|
switch (error) {
|
|
case 'invalid-password':
|
|
return 'Password cannot be empty';
|
|
case 'password-match':
|
|
return 'Passwords do not match';
|
|
case 'network-failure':
|
|
return 'Unable to contact the server';
|
|
default:
|
|
return 'Internal server error';
|
|
}
|
|
}
|
|
|
|
async function onSetPassword(password) {
|
|
setError(null);
|
|
let { error } = await send('subscribe-change-password', { password });
|
|
|
|
if (error) {
|
|
setError(error);
|
|
} else {
|
|
setMessage('Password successfully changed');
|
|
|
|
setTimeout(() => {
|
|
history.push('/');
|
|
}, 1500);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<View style={{ width: 500, marginTop: -30 }}>
|
|
<Title text="Change server password" />
|
|
<Text
|
|
style={{
|
|
fontSize: 16,
|
|
color: colors.n2,
|
|
lineHeight: 1.4
|
|
}}
|
|
>
|
|
This will change the password for this server instance. All existing
|
|
sessions will stay logged in.
|
|
</Text>
|
|
|
|
{error && (
|
|
<Text
|
|
style={{
|
|
marginTop: 20,
|
|
color: colors.r4,
|
|
borderRadius: 4,
|
|
fontSize: 15
|
|
}}
|
|
>
|
|
{getErrorMessage(error)}
|
|
</Text>
|
|
)}
|
|
|
|
{msg && (
|
|
<Text
|
|
style={{
|
|
marginTop: 20,
|
|
color: colors.g4,
|
|
borderRadius: 4,
|
|
fontSize: 15
|
|
}}
|
|
>
|
|
{msg}
|
|
</Text>
|
|
)}
|
|
|
|
<ConfirmPasswordForm
|
|
buttons={
|
|
<Button
|
|
bare
|
|
type="button"
|
|
style={{ fontSize: 15, marginRight: 10 }}
|
|
onClick={() => history.push('/')}
|
|
>
|
|
Cancel
|
|
</Button>
|
|
}
|
|
onSetPassword={onSetPassword}
|
|
onError={setError}
|
|
/>
|
|
</View>
|
|
</>
|
|
);
|
|
}
|