You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

48 lines
1.1 KiB

/** @jsx jsx */
import { useEffect } from 'react';
import { jsx, css } from '@emotion/core';
import { Button } from 'antd';
import { useTranslation } from 'react-i18next';
import EditorHead from './schema-head';
import SchemaForm from './schema-form';
import { useUIState } from '../store/ui';
import { useSchemaState } from '../store/schema';
import { SchemaState } from '../model';
let temp: SchemaState | null = null;
interface AA {
onChange: (value: SchemaState) => void;
}
function Layout({ onChange }: AA): JSX.Element {
const { t } = useTranslation();
const uiState = useUIState();
const key = 'properties';
const visible = uiState[key] !== false;
const schemaState = useSchemaState();
useEffect(() => {
if (temp !== schemaState) {
temp = schemaState;
onChange(schemaState);
}
});
return (
<div
className="json-schema-editor"
css={css`
padding: 5px;
`}
>
<Button type="primary">{t('import_json')}</Button>
<EditorHead />
{visible && <SchemaForm data={schemaState} keyRoute={['properties']} />}
</div>
);
}
export default Layout;