diff --git a/packages/unigraph-dev-explorer/src/components/ObjectView/AutoDynamicView.tsx b/packages/unigraph-dev-explorer/src/components/ObjectView/AutoDynamicView.tsx index 207cb79b..9912448b 100644 --- a/packages/unigraph-dev-explorer/src/components/ObjectView/AutoDynamicView.tsx +++ b/packages/unigraph-dev-explorer/src/components/ObjectView/AutoDynamicView.tsx @@ -40,7 +40,7 @@ export function AutoDynamicView({ const [showSubentities, setShowSubentities] = React.useState(!!subentityExpandByDefault); const [isSelected, setIsSelected] = React.useState(false); - const [isFocused, setIsFocused] = React.useState(false); + const [isFocused, setIsFocused] = React.useState(window.unigraph.getState('global/focused').value.uid === object?.uid && tabContext.isVisible()); const [DynamicViews, setDynamicViews] = React.useState({ ...window.unigraph.getState('registry/dynamicView').value, ...(component || {}) }); @@ -198,9 +198,7 @@ export function AutoDynamicView({ }} onClick={() => { window.wsnavigator(`/library/backlink?uid=${object?.uid}`); }} > - {noParents ? '' : `${backlinks?.[0]?.length} / `} - {' '} - {backlinks?.[1]?.length} + {(noParents ? 0 : backlinks?.[0]?.length || 0) + (backlinks?.[1]?.length || 0)} ); diff --git a/packages/unigraph-dev-explorer/src/components/ObjectView/DynamicObjectListView.tsx b/packages/unigraph-dev-explorer/src/components/ObjectView/DynamicObjectListView.tsx index 73532ef5..5b37d03c 100644 --- a/packages/unigraph-dev-explorer/src/components/ObjectView/DynamicObjectListView.tsx +++ b/packages/unigraph-dev-explorer/src/components/ObjectView/DynamicObjectListView.tsx @@ -12,7 +12,9 @@ import { UnigraphObject } from 'unigraph-dev-common/lib/api/unigraph'; import { buildGraph as buildGraphFn, getRandomInt } from 'unigraph-dev-common/lib/utils/utils'; import InfiniteScroll from 'react-infinite-scroll-component'; import { byElementIndex } from 'unigraph-dev-common/lib/utils/entityUtils'; -import { TransitionGroup } from 'react-transition-group'; +import { + TransitionGroup, +} from 'react-transition-group'; import { getDynamicViews } from '../../unigraph-react'; import { AutoDynamicView } from './AutoDynamicView'; import { DataContext, isMobile, TabContext } from '../../utils'; @@ -70,20 +72,19 @@ function DynamicListItem({ reverse, listUid, item, index, context, callbacks, itemUids, itemRemover, noRemover, removeOnEnter, compact, }: any) { return ( - - - { + + { itemRemover([item.uid]); }} - style={{ display: (itemRemover === _.noop || isMobile() || noRemover) ? 'none' : '' }} - > - - - + + + - - + /> + ); } @@ -137,25 +137,31 @@ function DynamicListBasic({ }: any) { const tabContext = React.useContext(TabContext); return ( - - - {items.map((el: any, index: number) => ( - itemGetter(ell).uid)} - itemRemover={itemRemover} - reverse={reverse} - noRemover={noRemover} - removeOnEnter={removeOnEnter} - /> - ))} - - + + {items.map((el: any, index: number) => ( + itemGetter(ell).uid)} + itemRemover={itemRemover} + reverse={reverse} + noRemover={noRemover} + removeOnEnter={removeOnEnter} + /> + ))} + ); } @@ -199,26 +205,32 @@ function DynamicList({ scrollableTarget={`scrollableDiv${parId}`} endMessage="" > - - - {loadedItems.map((el: any, index: number) => ( - itemGetter(ell).uid)} - itemRemover={itemRemover} - noRemover={noRemover} - removeOnEnter={removeOnEnter} - /> + + + {loadedItems.map((el: any, index: number) => ( + itemGetter(ell).uid)} + itemRemover={itemRemover} + noRemover={noRemover} + removeOnEnter={removeOnEnter} + /> ))} - - + ); } diff --git a/packages/unigraph-dev-explorer/src/examples/notes/NoteBlock.tsx b/packages/unigraph-dev-explorer/src/examples/notes/NoteBlock.tsx index 7f1452cc..2a453ae4 100644 --- a/packages/unigraph-dev-explorer/src/examples/notes/NoteBlock.tsx +++ b/packages/unigraph-dev-explorer/src/examples/notes/NoteBlock.tsx @@ -253,16 +253,18 @@ export function DetailedNoteBlock({ React.useEffect(() => { if (focused) { setIsEditing(true); - console.log(isEditing); - if (isEditing) editorRef.current.click(); + if (isEditing) textInput.current.focus(); setTimeout(() => { let tail; const focusedState = window.unigraph.getState('global/focused').value; const el = textInput.current.firstChild || textInput.current; - el?.click?.(); if (focusedState.tail) tail = el.textContent.length; setCaret(document, el, tail || focusedState.caret); }, 0); + } + }, [focused]); + React.useEffect(() => { + if (focused) { window.unigraph.getState('global/focused/actions').setValue({ splitChild: () => { const sel = document.getSelection(); @@ -273,7 +275,7 @@ export function DetailedNoteBlock({ unindentChild: callbacks['unindent-child-in-parent'], }); } - }, [focused]); + }, [data, focused]); React.useEffect(commandFn, [command]); @@ -305,7 +307,6 @@ export function DetailedNoteBlock({ }} onBlur={(ev) => { setIsEditing(false); - console.log('onBlur'); inputDebounced.current.flush(); if (focused) { window.unigraph.getState('global/focused').setValue({ uid: '', caret: 0, type: '' }); @@ -523,7 +524,6 @@ export function DetailedNoteBlock({ createBelow={() => { addChild(dataref.current, editorContext); }} > () => focusUid(targetUid)); }; export const unsplitChild = async (data: any, context: NoteEditorContext, index: number) => { @@ -216,7 +215,7 @@ export const indentChild = (data: any, context: NoteEditorContext, index: number window.unigraph.updateObject(data?._value?.uid, { children: { '_value[': finalChildren } }, false, false, context.callbacks.subsId, parents); context.edited.current = true; - context.setCommand(() => () => focusUid(newUid._value.uid)); + // context.setCommand(() => () => focusUid(newUid._value.uid)); // context.setCommand(() => noteBlockCommands['set-focus'].bind(this, data, {...context, childrenref: {current: context.childrenref.current.children[parent as number].children[0].children[0].children[1]}}, -1)) }; @@ -271,7 +270,7 @@ export const unindentChild = async (data: any, context: NoteEditorContext, paren await window.unigraph.updateObject(data?._value?.uid, { ...data._value, children: { '_value[': newChildren } }, false, false, [], parents); await window.unigraph.deleteItemFromArray(delUidPar, delUidChild); context.edited.current = true; - context.setCommand(() => () => focusUid(newChildren[parent + 1]._value._value.uid)); + // context.setCommand(() => () => focusUid(newChildren[parent + 1]._value._value.uid)); }; export const focusLastDFSNode = (data: any, context: NoteEditorContext, index: number, tail?: boolean) => {