Skip to content

Commit 3b7f93a

Browse files
Anchel123Anchel123
authored
Merge branch 'staging' into add-multi-graph-to-chat
2 parents 1fe9f19 + 14c09c1 commit 3b7f93a

File tree

16 files changed

+526
-89
lines changed

16 files changed

+526
-89
lines changed

‎app/components/chat.tsx‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -219,7 +219,6 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
219219
: elements.nodes.push(e)
220220
}
221221
})
222-
console.log(chart.add(graph.extend(elements)).map((e) => e.id()));
223222

224223
chart.elements().filter((e) => {
225224
console.log(e.id());
@@ -230,6 +229,7 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
230229
} else if (e.isNode()) {
231230
e.removeStyle().style(PATH_NODE_STYLE);
232231
}
232+
233233
if (e.isEdge()) {
234234
e.removeStyle().style(SELECTED_PATH_EDGE_STYLE);
235235
}
@@ -363,7 +363,6 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
363363
className="Tip"
364364
onClick={() => {
365365
setTipOpen(false)
366-
setPath({})
367366
setMessages(prev => [
368367
...RemoveLastPath(prev),
369368
{ type: MessageTypes.Query, text: "Create a path" },
@@ -378,7 +377,10 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
378377
type: MessageTypes.Response,
379378
text: "Please select a starting point and the end point. Select or press relevant item on the graph"
380379
}]), 300)
381-
setTimeout(() => setMessages(prev => [...prev, { type: MessageTypes.Path }]), 4000)
380+
setTimeout(() => {
381+
setPath({})
382+
setMessages(prev => [...prev, { type: MessageTypes.Path }])
383+
}, 4000)
382384
}}
383385
>
384386
<Lightbulb />
@@ -455,8 +457,9 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
455457
key={i}
456458
className={cn(
457459
"flex text-wrap border p-2 gap-2 rounded-md",
458-
p.nodes.length === selectedPath?.nodes.length &&
459-
selectedPath?.nodes.every(node => p?.nodes.some((n) => n.id === node.id)) && "border-[#FF66B3] bg-[#FFF0F7]",
460+
p.nodes.length === selectedPath?.nodes.length
461+
&& selectedPath?.nodes.every(node => p?.nodes.some((n) => n.id === node.id))
462+
&& "border-[#FF66B3] bg-[#FFF0F7]",
460463
message.graphName !== graph.Id && "opacity-50 bg-gray-200"
461464
)}
462465
title={message.graphName !== graph.Id ? `Move to graph ${message.graphName} to use this path` : undefined}
@@ -469,13 +472,14 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
469472
});
470473
return;
471474
}
475+
472476
if (p.nodes.length === selectedPath?.nodes.length &&
473477
selectedPath?.nodes.every(node => p?.nodes.some((n) => n.id === node.id))) return;
474478
handleSetSelectedPath(p);
475479
setIsPath(true);
476480
}}
477481
>
478-
<p className="font-bold">#{i}</p>
482+
<p className="font-bold">#{i + 1}</p>
479483
<div className="flex flex-wrap">
480484
{p.nodes.map((node: any, j: number) => (
481485
<span key={j} className={cn((j === 0 || j === p.nodes.length - 1) && "font-bold")}>
@@ -533,7 +537,7 @@ export function Chat({ repo, path, setPath, graph, chartRef, selectedPathId, isP
533537
</button>
534538
<form className="grow flex items-center border rounded-md px-2" onSubmit={sendQuery}>
535539
<DropdownMenuTrigger asChild>
536-
<button className="bg-gray-200 p-2 rounded-md hover:bg-gray-300">
540+
<button data-name="questionOptionsMenu" className="bg-gray-200 p-2 rounded-md hover:bg-gray-300">
537541
<ArrowDown color="white" />
538542
</button>
539543
</DropdownMenuTrigger>

‎app/components/code-graph.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ interface Props {
2121
onFetchGraph: (graphName: string) => void,
2222
onFetchNode: (nodeIds: string[]) => Promise<any[]>,
2323
options: string[]
24+
setOptions: Dispatch<SetStateAction<string[]>>
2425
isShowPath: boolean
2526
setPath: Dispatch<SetStateAction<Path | undefined>>
2627
chartRef: MutableRefObject<cytoscape.Core | null>
@@ -119,6 +120,7 @@ export function CodeGraph({
119120
onFetchGraph,
120121
onFetchNode,
121122
options,
123+
setOptions,
122124
isShowPath,
123125
setPath,
124126
chartRef,
@@ -380,7 +382,7 @@ export function CodeGraph({
380382
chartNode.select()
381383
chartNode.style({ display: "element" })
382384
setIsSelectedObj(String(n.id))
383-
const layout = { ...LAYOUT, padding: 250 }
385+
const layout = { ...LAYOUT, padding: chart.width() / 5 }
384386
chartNode.layout(layout).run()
385387
setSearchNode(n)
386388
}
@@ -397,6 +399,7 @@ export function CodeGraph({
397399
<header className="flex flex-col gap-4">
398400
<Combobox
399401
options={options}
402+
setOptions={setOptions}
400403
selectedValue={graphName}
401404
onSelectedValue={handleSelectedValue}
402405
/>
@@ -432,8 +435,8 @@ export function CodeGraph({
432435
</button>
433436
}
434437
</div>
435-
<div className="w-full absolute bottom-0 left-0 flex justify-between items-center p-4 z-10 pointer-events-none">
436-
<div className="flex gap-4 text-gray-500">
438+
<div data-name="canvas-info-panel" className="w-full absolute bottom-0 left-0 flex justify-between items-center p-4 z-10 pointer-events-none">
439+
<div data-name="metrics-panel" className="flex gap-4 text-gray-500">
437440
<p>{nodesCount} Nodes</p>
438441
<p>{edgesCount} Edges</p>
439442
</div>

‎app/components/combobox.tsx‎

Lines changed: 43 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,56 @@
11
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
2+
import { toast } from "@/components/ui/use-toast";
3+
import { useEffect, useState } from "react";
24

35
interface Props {
46
options: string[]
7+
setOptions: (options: string[]) => void
58
selectedValue: string
69
onSelectedValue: (value: string) => void
710

811
}
912

10-
export default function Combobox({ options, selectedValue, onSelectedValue }: Props) {
13+
export default function Combobox({ options, setOptions, selectedValue, onSelectedValue }: Props) {
14+
15+
const [open, setOpen] = useState(false)
16+
const [lastOpened, setLastOpened] = useState<number>();
17+
18+
const fetchOptions = async () => {
19+
const result = await fetch(`/api/repo`, {
20+
method: 'GET',
21+
})
22+
23+
if (!result.ok) {
24+
toast({
25+
variant: "destructive",
26+
title: "Uh oh! Something went wrong.",
27+
description: await result.text(),
28+
})
29+
return
30+
}
31+
32+
const json = await result.json()
33+
setOptions(json.result)
34+
}
35+
36+
useEffect(() => {
37+
fetchOptions()
38+
}, [])
39+
40+
useEffect(() => {
41+
if (!open) return
42+
43+
const now = Date.now();
44+
45+
if (lastOpened && now - lastOpened < 30000) return;
46+
47+
setLastOpened(now);
48+
49+
fetchOptions()
50+
}, [open])
51+
1152
return (
12-
<Select value={selectedValue} onValueChange={onSelectedValue}>
53+
<Select open={open} onOpenChange={setOpen} value={selectedValue} onValueChange={onSelectedValue}>
1354
<SelectTrigger className="rounded-md border focus:ring-0 focus:ring-offset-0">
1455
<SelectValue placeholder="Select a repo" />
1556
</SelectTrigger>

‎app/components/dataPanel.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,14 @@ export default function DataPanel({ obj, setObj, url }: Props) {
3636
const object = Object.entries(obj).filter(([k]) => !excludedProperties.includes(k))
3737

3838
return (
39-
<div className="z-20 absolute -top-10 left-20 bg-[#343434] text-white shadow-lg rounded-lg flex flex-col max-h-[88%] max-w-[56%] overflow-hidden" >
39+
<div data-name="node-details-panel" className="z-20 absolute -top-10 left-20 bg-[#343434] text-white shadow-lg rounded-lg flex flex-col max-h-[88%] max-w-[56%] overflow-hidden" >
4040
<header className="bg-[#191919] flex items-center gap-8 justify-between p-8">
4141
<p title={label} className="truncate font-bold">{label.toUpperCase()}</p>
4242
<button onClick={() => setObj(undefined)}>
4343
<X color="white" />
4444
</button>
4545
</header>
46-
<main ref={containerRef} className="bg-[#343434] flex flex-col grow overflow-y-auto p-4 justify-center">
46+
<main ref={containerRef} className="bg-[#343434] flex flex-col grow overflow-y-auto p-4">
4747
{
4848
object.map(([key, value]) => (
4949
<div key={key} className="flex gap-2">
@@ -74,7 +74,7 @@ export default function DataPanel({ obj, setObj, url }: Props) {
7474
<button
7575
className="flex items-center gap-2 p-2"
7676
title="Copy src to clipboard"
77-
onClick={() => navigator.clipboard.writeText(obj.src)}
77+
onClick={() => navigator.clipboard.writeText(obj.src || "")}
7878
>
7979
<Copy color="white" />
8080
Copy

‎app/page.tsx‎

Lines changed: 1 addition & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -65,28 +65,6 @@ export default function Home() {
6565
const [isSubmit, setIsSubmit] = useState<boolean>(false);
6666
const chartRef = useRef<cytoscape.Core | null>(null)
6767

68-
useEffect(() => {
69-
const run = async () => {
70-
const result = await fetch(`/api/repo`, {
71-
method: 'GET',
72-
})
73-
74-
if (!result.ok) {
75-
toast({
76-
variant: "destructive",
77-
title: "Uh oh! Something went wrong.",
78-
description: await result.text(),
79-
})
80-
return
81-
}
82-
83-
const json = await result.json()
84-
setOptions(json.result)
85-
}
86-
87-
run()
88-
}, [])
89-
9068
async function onCreateRepo(e: React.FormEvent<HTMLFormElement>) {
9169
e.preventDefault()
9270

@@ -279,6 +257,7 @@ export default function Home() {
279257
<CodeGraph
280258
chartRef={chartRef}
281259
options={options}
260+
setOptions={setOptions}
282261
onFetchGraph={onFetchGraph}
283262
onFetchNode={onFetchNode}
284263
setPath={setPath}

‎e2e/config/constants.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export const GRAPH_ID = "1";
1+
export const GRAPH_ID = "GraphRAG-SDK";
22
export const PROJECT_NAME = "GraphRAG-SDK";
33
export const CHAT_OPTTIONS_COUNT = 1;
44
export const Node_Question = "how many nodes do we have?";

‎e2e/config/testData.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,8 @@ export const specialCharacters: { character: string; expectedRes: boolean }[] =
1313
...categorizeCharacters(['%', '*', '(', ')', '-', '[', ']', '{', '}', ';', ':', '"', '|', '~'], false),
1414
...categorizeCharacters(['!', '@', '$', '^', '_', '=', '+', "'", ',', '.', '<', '>', '/', '?', '\\', '`', '&', '#'], true)
1515
];
16+
17+
export const nodesPath: { firstNode: string; secondNode: string }[] = [
18+
{ firstNode: "import_data", secondNode: "add_edge" },
19+
{ firstNode: "test_kg_delete", secondNode: "list_graphs" },
20+
];

‎e2e/infra/ui/browserWrapper.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,9 @@ export default class BrowserWrapper {
1313
if (!this.browser) {
1414
this.browser = await chromium.launch();
1515
}
16-
if (!this.context) {
17-
this.context = await this.browser.newContext();
18-
}
16+
this.context = await this.browser.newContext({
17+
permissions: ['clipboard-read', 'clipboard-write'],
18+
});
1919
if (!this.page) {
2020
this.page = await this.context.newPage();
2121
}

0 commit comments

Comments
 (0)