maq/osintbuddy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix context menu showing invalid transforms on null selection

Browse Source 
ContextAction.tsx, ContextMenu.tsx, and index.tsx
This commit is contained in:
jerlendds
2023-12-09 22:37:14 -07:00
parent b7ecb9f109
commit d251e79b82
3 changed files with 58 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
frontend/src/routes/graph-inquiry/_components/ContextAction.tsx
View File

@@ -13,42 +13,42 @@ export default function ContextAction({
closeMenu: Function
}) {
console.log('id', ctx?.id)
return (
<>
{transforms && <div className='node-context max-h-32 overflow-y-scroll'>
{transforms.map((transform: any) => {
return (
<div key={transform.label}>
<button
className='capitalize'
onClick={(e) => {
e.preventDefault()
closeMenu()
if (ctx) {
sendJsonMessage({
action: 'transform:node',
node: {
id: ctx.id,
type: ctx.label,
data: ctx.data,
position: ctx.position,
transform: transform.label,
},
})
} else {
toast.error("Ctx not found!")
}
}}
>
<Icon icon={transform.icon}></Icon>
{transform.label}
</button>
</div>
);
})}
</div>}
{transforms && ctx && <>
<div className='node-context max-h-32 overflow-y-scroll'>
{transforms.map((transform: any) => {
return (
<div key={transform.label}>
<button
className='capitalize'
onClick={(e) => {
e.preventDefault()
closeMenu()
if (ctx) {
sendJsonMessage({
action: 'transform:node',
node: {
id: ctx.id,
type: ctx.label,
data: ctx.data,
position: ctx.position,
transform: transform.label,
},
})
} else {
toast.error("Ctx not found!")
}
}}
>
<Icon icon={transform.icon}></Icon>
{transform.label}
</button>
</div>
);
})}
</div>
</>}
</>
);
}

41
frontend/src/routes/graph-inquiry/_components/ContextMenu.tsx
View File

@@ -48,28 +48,31 @@ export default function ContextMenu({
</div>
{transformsData && transformsData?.transforms && (
<>
<div className=' '>
<div>
<div className='sm:col-span-2'>
<label
htmlFor='message'
className='sr-only block font-semibold leading-6 mt-4 text-slate-200 pl-8'
>
Search through the installed transforms for the {ctxSelection?.label} plugin
</label>
<div className='mt-2.5 hover:border-mirage-200/40 transition-colors duration-200 ease-in-out block justify-between items-center to-mirage-400/50 from-mirage-300/20 bg-gradient-to-br rounded border mb-2 mx-4 focus-within:!border-primary/40 px-3.5 py-1 text-slate-100 shadow-sm border-mirage-400/20 ring-light-900/10 focus-within:from-mirage-400/20 focus-within:to-mirage-400/30 focus-within:bg-gradient-to-l'>
<input
value={query}
onChange={(e) => setQuery(e.currentTarget.value)}
name='message'
id='message'
className='block w-full placeholder:text-slate-700 bg-transparent outline-none sm:text-sm'
placeholder='Search transforms...'
/>
{ctxSelection && (
<div className=' '>
<div>
<div className='sm:col-span-2'>
<label
htmlFor='message'
className='sr-only block font-semibold leading-6 mt-4 text-slate-200 pl-8'
>
Search through the installed transforms for the {ctxSelection?.label} plugin
</label>
<div className='mt-2.5 hover:border-mirage-200/40 transition-colors duration-200 ease-in-out block justify-between items-center to-mirage-400/50 from-mirage-300/20 bg-gradient-to-br rounded border mb-2 mx-4 focus-within:!border-primary/40 px-3.5 py-1 text-slate-100 shadow-sm border-mirage-400/20 ring-light-900/10 focus-within:from-mirage-400/20 focus-within:to-mirage-400/30 focus-within:bg-gradient-to-l'>
<input
value={query}
onChange={(e) => setQuery(e.currentTarget.value)}
name='message'
id='message'
className='block w-full placeholder:text-slate-700 bg-transparent outline-none sm:text-sm'
placeholder='Search transforms...'
/>
</div>
</div>
</div>
</div>
</div>
)}
<ContextAction
closeMenu={closeMenu}
nodeCtx={ctxSelection}

6
frontend/src/routes/graph-inquiry/index.tsx
View File

@@ -375,7 +375,8 @@ export default function GraphInquiry({ }: GraphInquiryProps) {
const [forceInitialized, { toggleForceLayout, isForceRunning }] = useForceLayoutElements();
// If not on a manual layout, update the manual layout positions
// for any drag changes, entity edit mode toggles, and transforms/deletions
useEffect(() => {
if (activeEditState.label === 'deleteNode') {
setEdgesBeforeLayout(edgesBeforeLayout.filter((edge: Edge) => edge.target !== activeEditState.id || edge.source !== activeEditState.id))
@@ -384,9 +385,6 @@ export default function GraphInquiry({ }: GraphInquiryProps) {
if (activeEditState.label === 'addNode') {
setNodesBeforeLayout([...nodesBeforeLayout, initialNodes.find((node: Node) => node.id === activeEditState.id) as Node])
}
if (activeEditState.label?.includes("layoutChange")) {
setNodesBeforeLayout([...nodesBeforeLayout])
}
if (activeEditState.label === "enableEditMode") {
setNodesBeforeLayout([...nodesBeforeLayout.map((node: Node) =>
node.id === activeEditState.id ? { ...node, type: 'base' } : node