mirror of
https://github.com/Cockatrice/Cockatrice.git
synced 2026-06-30 10:33:54 -07:00
fix login inputs
This commit is contained in:
parent
e045f498a8
commit
db1530c9e9
1 changed files with 9 additions and 18 deletions
|
|
@ -1,4 +1,4 @@
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { Form, Field, useFormState, FormApi } from 'react-final-form';
|
import { Form, Field, useFormState, FormApi } from 'react-final-form';
|
||||||
import { OnChange } from 'react-final-form-listeners';
|
import { OnChange } from 'react-final-form-listeners';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
@ -9,6 +9,7 @@ import FormControlLabel from '@mui/material/FormControlLabel';
|
||||||
|
|
||||||
import { CheckboxField, InputField, KnownHosts } from '@app/components';
|
import { CheckboxField, InputField, KnownHosts } from '@app/components';
|
||||||
import { LoadingState, useKnownHosts, useSettings } from '@app/hooks';
|
import { LoadingState, useKnownHosts, useSettings } from '@app/hooks';
|
||||||
|
import { HostDTO } from '@app/services';
|
||||||
|
|
||||||
import './LoginForm.css';
|
import './LoginForm.css';
|
||||||
|
|
||||||
|
|
@ -48,27 +49,16 @@ const LoginFormBody = ({
|
||||||
const togglePasswordLabel = (on: boolean) => setUseStoredPasswordLabel(on);
|
const togglePasswordLabel = (on: boolean) => setUseStoredPasswordLabel(on);
|
||||||
|
|
||||||
// @critical Host-sync must not touch autoConnect — app-level setting, not per-host.
|
// @critical Host-sync must not touch autoConnect — app-level setting, not per-host.
|
||||||
useEffect(() => {
|
const onSelectedHostChange = (host: HostDTO | undefined) => {
|
||||||
if (!selectedHost) {
|
if (!host) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
form.change('userName', host.userName ?? '');
|
||||||
form.change('userName', selectedHost.userName);
|
|
||||||
form.change('password', '');
|
form.change('password', '');
|
||||||
form.change('remember', Boolean(selectedHost.remember));
|
form.change('remember', Boolean(host.remember));
|
||||||
|
|
||||||
setStoredHashInvalidated(false);
|
setStoredHashInvalidated(false);
|
||||||
togglePasswordLabel(
|
togglePasswordLabel(Boolean(host.remember && host.hashedPassword));
|
||||||
Boolean(selectedHost.remember && selectedHost.hashedPassword)
|
};
|
||||||
);
|
|
||||||
}, [selectedHost, form]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (settings.status !== LoadingState.READY) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
form.change('autoConnect', settings.value?.autoConnect);
|
|
||||||
}, [settings, form]);
|
|
||||||
|
|
||||||
const onUserNameChange = (userName: string | undefined) => {
|
const onUserNameChange = (userName: string | undefined) => {
|
||||||
const fieldChanged = selectedHost?.userName?.toLowerCase() !== userName?.toLowerCase();
|
const fieldChanged = selectedHost?.userName?.toLowerCase() !== userName?.toLowerCase();
|
||||||
|
|
@ -139,6 +129,7 @@ const LoginFormBody = ({
|
||||||
</div>
|
</div>
|
||||||
<div className="loginForm-item">
|
<div className="loginForm-item">
|
||||||
<Field name="selectedHost" component={KnownHosts} />
|
<Field name="selectedHost" component={KnownHosts} />
|
||||||
|
<OnChange name="selectedHost">{onSelectedHostChange}</OnChange>
|
||||||
</div>
|
</div>
|
||||||
<div className="loginForm-actions">
|
<div className="loginForm-actions">
|
||||||
<Field name="autoConnect" type="checkbox">
|
<Field name="autoConnect" type="checkbox">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue