edit parameters as JSON string

This commit is contained in:
Bowen Tan 2021-10-20 16:40:54 +08:00
parent a259fbd729
commit e63971fca7
2 changed files with 20 additions and 6 deletions

View File

@ -87,9 +87,8 @@ export const ComponentForm: React.FC<Props> = props => {
});
});
const eventHandlers =
selectedComponent.traits.find(t => t.type === 'core/v1/event')?.properties.handlers ||
([] as any);
const eventHandlers = selectedComponent.traits.find(t => t.type === 'core/v1/event')
?.properties.handlers;
return (
<VStack p={4} spacing="4" background="gray.50">

View File

@ -12,10 +12,10 @@ import { Static } from '@sinclair/typebox';
import { CloseIcon } from '@chakra-ui/icons';
import { useFormik } from 'formik';
import { EventHandlerSchema } from '@meta-ui/runtime';
import { registry } from '../../../metaUI';
import { useAppModel } from '../../../operations/useAppModel';
import { formWrapperCSS } from '../style';
import produce from 'immer';
type Props = {
eventTypes: string[];
@ -47,10 +47,25 @@ export const EventHandlerForm: React.FC<Props> = props => {
updateMethods(e.target.value);
};
// because parameters is object, so it has to be converted to string to edit
const initialValues = produce(handler, draft => {
draft.method.parameters = JSON.stringify(draft.method.parameters);
});
const formik = useFormik({
initialValues: handler,
initialValues,
onSubmit: values => {
onChange(values);
try {
const newHandler = produce(values, draft => {
draft.method.parameters = JSON.parse(draft.method.parameters);
});
onChange(newHandler);
} catch (e) {
console.error(
`Error happened when parsing method parameters. Cannot parse ${values.method.parameters} as JSON.`
);
return;
}
},
});