mirror of
https://github.com/remvze/moodist.git
synced 2025-12-17 17:04:15 +00:00
fix: reset values on cancel
This commit is contained in:
parent
af92b1ed90
commit
89a83089c5
1 changed files with 11 additions and 10 deletions
|
|
@ -14,18 +14,26 @@ interface SettingProps {
|
||||||
export function Setting({ onChange, onClose, show, times }: SettingProps) {
|
export function Setting({ onChange, onClose, show, times }: SettingProps) {
|
||||||
const [values, setValues] = useState(times);
|
const [values, setValues] = useState(times);
|
||||||
|
|
||||||
useEffect(() => setValues(times), [times]);
|
useEffect(() => {
|
||||||
|
if (show) setValues(times);
|
||||||
|
}, [times, show]);
|
||||||
|
|
||||||
const handleChange = (id: string) => (value: number) => {
|
const handleChange = (id: string) => (value: number) => {
|
||||||
setValues(prev => ({ ...prev, [id]: value * 60 }));
|
setValues(prev => ({ ...prev, [id]: value * 60 }));
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleSubmit = e => {
|
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
||||||
onChange(values);
|
onChange(values);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handleCancel = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
onClose();
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Modal lockBody={false} show={show} onClose={onClose}>
|
<Modal lockBody={false} show={show} onClose={onClose}>
|
||||||
<h2 className={styles.title}>Change Times</h2>
|
<h2 className={styles.title}>Change Times</h2>
|
||||||
|
|
@ -51,14 +59,7 @@ export function Setting({ onChange, onClose, show, times }: SettingProps) {
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className={styles.buttons}>
|
<div className={styles.buttons}>
|
||||||
<button
|
<button onClick={handleCancel}>Cancel</button>
|
||||||
onClick={e => {
|
|
||||||
e.preventDefault();
|
|
||||||
onClose();
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</button>
|
|
||||||
<button className={styles.primary}>Save</button>
|
<button className={styles.primary}>Save</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue