import React, { useState } from 'react'; import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControl, InputLabel, MenuItem, Select, TextField, } from '@material-ui/core'; import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; import t from '../common/localization'; import EditItemView from '../EditItemView'; import positionAttributes from '../attributes/positionAttributes'; const useStyles = makeStyles(() => ({ details: { flexDirection: 'column', }, })); const ComputedAttributePage = () => { const classes = useStyles(); const [item, setItem] = useState(); const [key, setKey] = useState(); const options = Object.entries(positionAttributes).map(([key, value]) => ({ key, name: value.name, type: value.type, })); const handleChange = (event) => { const newValue = event.target.value; setKey(newValue); const positionAttribute = positionAttributes[newValue]; if (positionAttribute && positionAttribute.type) { setItem({ ...item, attribute: newValue, type: positionAttribute.type }); } else { setItem({ ...item, attribute: newValue }); } }; return ( {item && ( }> {t('sharedRequired')} setItem({ ...item, description: event.target.value })} label={t('sharedDescription')} variant="filled" /> {t('sharedAttribute')} setItem({ ...item, expression: event.target.value })} label={t('sharedExpression')} multiline rows={4} variant="filled" /> {t('sharedType')} )} ); }; export default ComputedAttributePage;