/
lizardking
/
react_project
Обзор
Документация
Войти
/
lizardking
/
react_project
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
src/features/react19/ActionStateWithReducer/ui/ActionStateWithReducer.tsx
49 строк
2 KB
LizardKing
Task 9 - React 19
14 ноя 2025, 20:35
14 ноя 2025, 20:35
86e4531
Код
Авторство
О чём код?
import { Input } from 'shared/ui/Input' import { PrimaryButton } from 'shared/ui/PrimaryButton' import { useActionForm } from '../model/useActionForm' export function ActionStateWithReducer() { const { formRef, status, isDirty, isPending, statusLabel, formAction } = useActionForm() return ( <> <form ref={formRef} action={formAction} className="flex flex-col gap-3"> <Input id="name" name="name" type="text" title="Имя" placeholder="Введите имя" /> <Input id="email" name="email" type="email" title="Email" placeholder="Введите email" /> <Input id="message" name="message" type="text" title="Сообщение" placeholder="Введите сообщение" /> <PrimaryButton type="submit" disabled={isPending}> {isPending ? 'Отправка…' : 'Отправить'} </PrimaryButton> </form> <div className="text-sm text-[var(--color-muted)]"> <p> Статус: <span className="font-medium">{status}</span> </p> <p> Изменена после последнего сохранения:{' '} <span className="font-medium">{isDirty ? 'да' : 'нет'}</span> </p> {statusLabel && ( <p className="mt-1 text-sm text-[var(--color-fg)]">{statusLabel}</p> )} </div> </> ) }