diff --git a/packages/entity/src/trait-components/behaved.jsx b/packages/entity/src/trait-components/behaved.jsx index a21cd09..b315fd0 100644 --- a/packages/entity/src/trait-components/behaved.jsx +++ b/packages/entity/src/trait-components/behaved.jsx @@ -3,18 +3,10 @@ import {join} from 'path'; import { PropTypes, React, - useEffect, - usePrevious, - useRef, - useState, } from '@latus/react'; -import {useJsonPatcher} from '@persea/json'; import { - Tab, - Tabs, - TabList, - TabPanel, -} from 'react-tabs'; + JsonTabs, +} from '@persea/json'; import Expressions from '../behavior-components/expressions'; @@ -22,133 +14,25 @@ const Behaved = ({ entity, json, path, -}) => { - const patch = useJsonPatcher(); - const editingRef = useRef(); - useEffect(() => { - editingRef.current?.focus(); - }); - const [isEditing, setIsEditing] = useState(false); - const [previousKey, setPreviousKey] = useState(false); - const previousEditing = usePrevious(isEditing); - useEffect(() => { - setTimeout(() => { - if (false === previousEditing) { - editingRef.current?.select(); - } - }, 10); - }, [editingRef, isEditing, previousEditing]); - const tabs = []; - const tabPanels = []; - Object.entries(json.params.routines).forEach(([key, expressions]) => { - const routinePath = join(path, 'params/routines', key); - const confirmEdit = () => { - if (isEditing && previousKey !== isEditing) { - patch({ - op: 'move', - from: join(path, 'params/routines', previousKey), - path: join(path, 'params/routines', isEditing), - }); - } - setIsEditing(false); - setPreviousKey(false); - }; - tabs.push( - { - setPreviousKey(key); - setIsEditing(key); - }} - > - { - key === previousKey - ? ( - { - setPreviousKey(key); - setIsEditing(value); - }} - onKeyPress={({key}) => { - if ('Enter' === key) { - confirmEdit(); - } - }} - ref={editingRef} - /> - ) - : key - } - - { - patch({ - op: 'remove', - path: routinePath, - }); - }} - > - ✕ - - - , - ); - tabPanels.push( - +}) => ( + + ( - , - ); - }); - return ( - - - Routines - - - { - let i = 1; - let name = 'untitled'; - while (json.params.routines[name]) { - name = `untitled (${i++})`; - } - patch({ - op: 'add', - path: join(path, 'params/routines', name), - value: { - type: 'expressions', - expressions: [], - }, - }); - setIsEditing(name); - setPreviousKey(name); - }} - type="button" - > - + - - - {tabs} - - - - {tabPanels} - - - - - ); -}; + )} + defaultValue={{ + type: 'expressions', + expressions: [], + }} + path={join(path, 'params/routines')} + map={json.params.routines} + /> + +); Behaved.displayName = 'Behaved';