010f78b138
Переносит вопросы из Microsoft Forms в собственный интерфейс: компания, анонимность, ФИО и должность, вид обращения, описание ситуации и предложение. Поля автора скрываются при анонимном обращении, а не блокируются: требовать ФИО у анонима — противоречие, а серое неактивное поле выглядит как ошибка формы. Состояние целиком в useFeedbackForm, правила заполнения — в отдельной чистой функции validateFeedback: её можно покрыть тестами без React. Отправки пока нет — по договорённости делаем только UI, submit пишет данные в консоль (TODO в useFeedbackForm). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
71 lines
2.2 KiB
TypeScript
71 lines
2.2 KiB
TypeScript
import { FormGrid, Select, TextInput, Toggle } from '@tnsu/ui-kit';
|
|
import { Field } from '../../../components/Field/Field';
|
|
import { COMPANY_OPTIONS } from '../model';
|
|
import { TEXTS } from '../texts';
|
|
import type { ISectionProps } from './ISectionProps';
|
|
|
|
/** Кто обращается: компания, анонимность, ФИО и должность. */
|
|
export const AuthorSection: React.FC<ISectionProps> = ({ data, errors, set }) => (
|
|
<FormGrid>
|
|
<Field
|
|
label={TEXTS.labels.company}
|
|
htmlFor="company"
|
|
required
|
|
error={errors.company}
|
|
>
|
|
<Select
|
|
id="company"
|
|
value={data.company}
|
|
onChange={(v) => set('company', v)}
|
|
options={COMPANY_OPTIONS}
|
|
placeholder={TEXTS.placeholders.company}
|
|
/>
|
|
</Field>
|
|
|
|
<Field label={TEXTS.labels.isAnonymous} hint={TEXTS.anonymousHint} full>
|
|
<Toggle
|
|
checked={data.isAnonymous}
|
|
onChange={(v) => set('isAnonymous', v)}
|
|
onLabel="Да"
|
|
/>
|
|
</Field>
|
|
|
|
{/* Анонимное обращение не собирает данные автора — поля просто скрываем,
|
|
чтобы не создавать впечатление, что их «всё равно надо» заполнить. */}
|
|
{!data.isAnonymous ? (
|
|
<>
|
|
<Field
|
|
label={TEXTS.labels.fullName}
|
|
htmlFor="fullName"
|
|
required
|
|
error={errors.fullName}
|
|
>
|
|
<TextInput
|
|
id="fullName"
|
|
value={data.fullName}
|
|
onChange={(v) => set('fullName', v)}
|
|
placeholder={TEXTS.placeholders.fullName}
|
|
/>
|
|
</Field>
|
|
|
|
<Field label={TEXTS.labels.position} htmlFor="position">
|
|
<TextInput
|
|
id="position"
|
|
value={data.position}
|
|
onChange={(v) => set('position', v)}
|
|
placeholder={TEXTS.placeholders.position}
|
|
/>
|
|
</Field>
|
|
|
|
<Field label={TEXTS.labels.wantsFeedback} full>
|
|
<Toggle
|
|
checked={data.wantsFeedback}
|
|
onChange={(v) => set('wantsFeedback', v)}
|
|
onLabel="Да"
|
|
/>
|
|
</Field>
|
|
</>
|
|
) : null}
|
|
</FormGrid>
|
|
);
|