2023-05-16 13:50:47 +03:00

40 lines
1.2 KiB
TypeScript

import type { Elements } from '../config/map/values';
import { useStoreValue } from './hooks';
import { useOptions } from '@/stores/calculation/options/hooks';
import { useStatus } from '@/stores/calculation/statuses/hooks';
import { useValidation } from '@/stores/calculation/validation/hooks';
import type { Values } from '@/stores/calculation/values/types';
import { observer } from 'mobx-react-lite';
import type { ComponentType } from 'react';
import { Form } from 'ui/elements';
type BuilderProps = {
elementName: Elements;
valueName: Values;
};
export function buildOptions<T>(
Component: ComponentType<T>,
{ elementName, valueName }: BuilderProps
) {
return observer((props: T) => {
const [value, setValue] = useStoreValue(valueName);
const status = useStatus(elementName);
const { validateStatus, help } = useValidation(elementName);
const options = useOptions(elementName);
return (
<Form.Item help={help} validateStatus={validateStatus}>
<Component
disabled={status === 'Disabled'}
loading={status === 'Loading'}
options={options}
onChange={setValue}
value={value}
{...props}
/>
</Form.Item>
);
});
}