|
@@ -3,8 +3,8 @@ import { IconButton } from '../button/IconButton';
|
|
|
import styles from './caloriesInput.css';
|
|
|
|
|
|
type CaloriesInputProps = {
|
|
|
- addCalories: (calories: { title: string, count: number}) => void,
|
|
|
- saveCalories: (calories: { title: string, count: number}) => void,
|
|
|
+ addCalories: (calories: { title: string, count: number }) => void,
|
|
|
+ saveCalories: (calories: { title: string, count: number }) => void,
|
|
|
item?: CalorieValue
|
|
|
};
|
|
|
|
|
@@ -13,7 +13,7 @@ interface ICalorieInputForm extends HTMLFormElement {
|
|
|
caloriesCount: HTMLInputElement;
|
|
|
}
|
|
|
|
|
|
-function CaloriesInput ({ addCalories, saveCalories, item }: CaloriesInputProps) {
|
|
|
+function CaloriesInput ({addCalories, saveCalories, item}: CaloriesInputProps) {
|
|
|
function onSubmit (event: FormEvent<ICalorieInputForm>) {
|
|
|
event.preventDefault();
|
|
|
|
|
@@ -22,14 +22,14 @@ function CaloriesInput ({ addCalories, saveCalories, item }: CaloriesInputProps)
|
|
|
const count = Number(form.caloriesCount.value) || 0;
|
|
|
|
|
|
if (!item) {
|
|
|
- addCalories({ title, count });
|
|
|
+ addCalories({title, count});
|
|
|
|
|
|
form.querySelectorAll('input').forEach((formElement) => {
|
|
|
formElement.value = '';
|
|
|
formElement.blur();
|
|
|
});
|
|
|
} else {
|
|
|
- saveCalories({ title, count});
|
|
|
+ saveCalories({title, count});
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -47,12 +47,14 @@ function CaloriesInput ({ addCalories, saveCalories, item }: CaloriesInputProps)
|
|
|
<div className={styles.inputWrapper}>
|
|
|
<div className={styles.formRow}>
|
|
|
<label htmlFor="caloriesTitle">Nahrungsmittel:</label>
|
|
|
- <input id="caloriesTitle" name="caloriesTitle" type="text" defaultValue={itemTitle} required />
|
|
|
+ <input key={itemTitle} id="caloriesTitle" name="caloriesTitle" type="text" defaultValue={itemTitle}
|
|
|
+ required />
|
|
|
</div>
|
|
|
|
|
|
<div className={styles.formRow}>
|
|
|
<label htmlFor="caloriesCount">Kalorien:</label>
|
|
|
- <input id="caloriesCount" name="caloriesCount" type="number" defaultValue={itemCount} required />
|
|
|
+ <input key={itemCount} id="caloriesCount" name="caloriesCount" type="number" defaultValue={itemCount}
|
|
|
+ required />
|
|
|
</div>
|
|
|
</div>
|
|
|
|