@@ -11,6 +11,38 @@ import { SvgIcon } from '#/shared/ui/svg' import { Typography } from '@mui/material' import { ThreePOutlined } from '@mui/icons-material' +function buildTypeVersionsMap(inputs: IModelInputs[]): Record { + const byType = new Map() + for (const item of inputs) { + const list = byType.get(item.type) ?? [] + list.push(item.versions) + byType.set(item.type, list) + } + const result: Record = {} + for (const [type, versionsList] of byType) { + if (versionsList.some((v) => v.length === 0)) { + result[type] = [] + } else { + result[type] = [...new Set(versionsList.flat())] + } + } + return result +} + +function inputAppliesToVersion(input: IModelInputs, currentVersion: string): boolean { + return input.versions.length === 0 || input.versions.includes(currentVersion) +} + +/** Учитывает только inputs, актуальные для версии — иначе required с другой версии (второй image) ломает валидацию */ +function buildRequiredForVersion(inputs: IModelInputs[], currentVersion: string): (string | null)[] { + const requiredTypes = new Set() + for (const el of inputs) { + if (!inputAppliesToVersion(el, currentVersion)) continue + if (el.required) requiredTypes.add(el.type) + } + return [...requiredTypes] +} + interface Input { loading: boolean // requestImage: () => void @@ -81,11 +113,11 @@ export const ModelInput: FC = ({ useEffect(() => { if (input_types) { - setRequired(input_types.map((el) => (el.required ? el.type : null))) + setRequired(buildRequiredForVersion(input_types, currentVersion)) setTypes(input_types.map((el) => el.type)) - setTypeVersions(input_types.reduce((a, v) => ({ ...a, [v.type]: v.versions }), {})) + setTypeVersions(buildTypeVersionsMap(input_types)) } - }, [input_types]) + }, [input_types, currentVersion]) useEffect(() => { if (input_types && typeVersions && !typeVersions['text']) { @@ -96,7 +128,7 @@ export const ModelInput: FC = ({ ) { setDisabled(false) } - }, [typeVersions]) + }, [typeVersions, currentVersion, input_types]) useEffect(() => { if (resendValue) { @@ -28,10 +28,10 @@ .header { display: flex; align-items: center; + justify-content: space-between; width: 100%; gap: 22px; margin: 14px 0; - flex-direction: column; > *:first-child { min-width: 200px; @@ -25,6 +25,7 @@ @media screen and (max-width: 768px) { align-items: flex-start; width: 100%; + max-width: 100%; gap: 4px; flex-direction: column; } @@ -39,7 +39,7 @@ height: 44px; min-height: 44px; border: none; - border-radius: 13px; + border-radius: 8px; padding: 0 15px; text-transform: none; background-color: #1D1D21;