Skip to content

Commit 375f0d7

Browse files
Anchel123Anchel123
committed
Refactor components and update dependencies for improved functionality and performance
1 parent 44ae35e commit 375f0d7

15 files changed

Lines changed: 46 additions & 43 deletions

File tree

‎.github/workflows/playwright.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ jobs:
3838
npm run build
3939
NEXTAUTH_SECRET=SECRET npm start & npx playwright test --shard=${{ matrix.shard }}/2 --reporter=dot,list
4040
- name: Ensure required directories exist
41+
if: always()
4142
run: |
4243
mkdir -p playwright-report
4344
mkdir -p playwright-report/artifacts

‎app/components/chat.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { toast } from "@/components/ui/use-toast";
2-
import { Dispatch, FormEvent, MutableRefObject, SetStateAction, useEffect, useRef, useState } from "react";
2+
import { Dispatch, FormEvent, SetStateAction, useEffect, useRef, useState } from "react";
33
import Image from "next/image";
44
import { AlignLeft, ArrowRight, ChevronDown, Lightbulb, Undo2 } from "lucide-react";
5-
import { Message, MessageTypes, Path, PathData } from "@/lib/utils";
5+
import { Message, MessageTypes, Path, PathData, PATH_COLOR } from "@/lib/utils";
66
import Input from "./Input";
77
import { Graph, GraphData, Node } from "./model";
88
import { cn, GraphRef } from "@/lib/utils";
@@ -32,7 +32,6 @@ interface Props {
3232
setPaths: Dispatch<SetStateAction<PathData[]>>
3333
}
3434

35-
const PATH_COLOR = "#ffde21";
3635
const SUGGESTIONS = [
3736
"List a few recursive functions",
3837
"What is the name of the most used method?",

‎app/components/code-graph.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,8 @@ export function CodeGraph({
105105
useEffect(() => {
106106
const handleKeyDown = (event: KeyboardEvent) => {
107107
if (event.key === 'Delete') {
108-
if (selectedObjects.length === 0 && !selectedObj) return
108+
if (selectedObjects.length === 0 && (!selectedObj || "source" in selectedObj)) return
109+
109110
handleRemove([...selectedObjects.map(obj => obj.id), selectedObj?.id].filter(id => id !== undefined), "nodes");
110111
}
111112
};
@@ -174,7 +175,7 @@ export function CodeGraph({
174175

175176
async function handleSelectedValue(value: string) {
176177
setGraphName(value)
177-
onFetchGraph(value)
178+
await onFetchGraph(value)
178179
}
179180

180181
const deleteNeighbors = (nodes: Node[]) => {

‎app/components/combobox.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ interface Props {
66
options: string[]
77
setOptions: (options: string[]) => void
88
selectedValue: string
9-
onSelectedValue: (value: string) => void
9+
onSelectedValue: (value: string) => Promise<void>
1010

1111
}
1212

‎app/components/dataPanel.tsx‎

Lines changed: 14 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ export default function DataPanel({ obj, setObj, url }: Props) {
7070
>
7171
{value}
7272
</SyntaxHighlighter>
73-
: typeof value === "object" ?
73+
: typeof value === "object" && value !== null ?
7474
<JSONTree
7575
data={Object.fromEntries(Object.entries(value).filter(([k]) => !excludedProperties.includes(k)))}
7676
theme={{
@@ -91,22 +91,22 @@ export default function DataPanel({ obj, setObj, url }: Props) {
9191
base0E: '#ae81ff',
9292
base0F: '#cc6633'
9393
}}
94-
valueRenderer={(valueAsString, value, keyPath) => {
94+
valueRenderer={(_valueAsString, value, keyPath) => {
9595
if (keyPath === "src") {
9696
return <SyntaxHighlighter
9797
language="python"
9898
style={{
99-
...dark,
100-
hljs: {
101-
...dark.hljs,
102-
maxHeight: `9rem`,
103-
background: '#343434',
104-
padding: 2,
105-
}
106-
}}
107-
>
108-
{value as string}
109-
</SyntaxHighlighter>
99+
...dark,
100+
hljs: {
101+
...dark.hljs,
102+
maxHeight: `9rem`,
103+
background: '#343434',
104+
padding: 2,
105+
}
106+
}}
107+
>
108+
{value as string}
109+
</SyntaxHighlighter>
110110
}
111111
return <span className="text-white">{value as string}</span>
112112
}}
@@ -132,18 +132,9 @@ export default function DataPanel({ obj, setObj, url }: Props) {
132132
<a
133133
className="flex items-center gap-2 p-2"
134134
href={url}
135+
rel="noopener noreferrer"
135136
target="_blank"
136137
title="Go to repo"
137-
onClick={() => {
138-
const newTab = window.open(url, '_blank');
139-
140-
if (!obj.data.src_start || !obj.data.src_end || !newTab) return
141-
142-
newTab.scroll({
143-
top: obj.data.src_start,
144-
behavior: 'smooth'
145-
})
146-
}}
147138
>
148139
<SquareArrowOutUpRight color="white" />
149140
Go to repo

‎app/components/graphView.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -250,6 +250,10 @@ export default function GraphView({
250250
return null
251251
}, [])
252252

253+
const mobileBreakpointRaw = Number(process.env.NEXT_PUBLIC_MOBILE_BREAKPOINT)
254+
const mobileBreakpoint = Number.isFinite(mobileBreakpointRaw) ? mobileBreakpointRaw : 0
255+
const isDesktop = screenSize > mobileBreakpoint
256+
253257
return (
254258
<div className="relative w-full md:h-full h-1 grow">
255259
<div className="md:hidden absolute bottom-4 right-4 z-10">
@@ -261,11 +265,11 @@ export default function GraphView({
261265
id={id}
262266
data={data}
263267
canvasRef={canvasRef}
264-
onNodeClick={screenSize > Number(process.env.NEXT_PUBLIC_MOBILE_BREAKPOINT) || isShowPath ? (node: Node, _evt: MouseEvent) => handleNodeClick(node) : (node: Node, evt: MouseEvent) => handleRightClick(node, evt)}
268+
onNodeClick={isDesktop || isShowPath ? (node: Node, _evt: MouseEvent) => handleNodeClick(node) : (node: Node, evt: MouseEvent) => handleRightClick(node, evt)}
265269
onNodeHover={handleNodeHover}
266270
onNodeRightClick={handleRightClick}
267271
isNodeSelected={isNodeSelected}
268-
onLinkClick={screenSize > Number(process.env.NEXT_PUBLIC_MOBILE_BREAKPOINT) && isPathResponse ? handleLinkClick : handleRightClick}
272+
onLinkClick={isDesktop && isPathResponse ? handleLinkClick : handleRightClick}
269273
onLinkHover={handleLinkHover}
270274
onLinkRightClick={handleRightClick}
271275
isLinkSelected={isLinkSelected}

‎components/ui/carousel.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@ const Carousel = React.forwardRef<
116116
api.on("select", onSelect)
117117

118118
return () => {
119+
api?.off("reInit", onSelect)
119120
api?.off("select", onSelect)
120121
}
121122
}, [api, onSelect])
@@ -197,7 +198,7 @@ CarouselItem.displayName = "CarouselItem"
197198
const CarouselPrevious = React.forwardRef<
198199
HTMLButtonElement,
199200
React.ComponentProps<typeof Button>
200-
>(({ className, variant = "outline", size = "icon", ...props }, ref) => {
201+
>(({ className, variant = "outline", size = "icon", onClick, ...props }, ref) => {
201202
const { orientation, scrollPrev, canScrollPrev } = useCarousel()
202203

203204
return (
@@ -213,7 +214,7 @@ const CarouselPrevious = React.forwardRef<
213214
className
214215
)}
215216
disabled={!canScrollPrev}
216-
onClick={scrollPrev}
217+
onClick={(e) => { scrollPrev(); onClick?.(e); }}
217218
{...props}
218219
>
219220
<ArrowLeft className="h-4 w-4" />
@@ -226,7 +227,7 @@ CarouselPrevious.displayName = "CarouselPrevious"
226227
const CarouselNext = React.forwardRef<
227228
HTMLButtonElement,
228229
React.ComponentProps<typeof Button>
229-
>(({ className, variant = "outline", size = "icon", ...props }, ref) => {
230+
>(({ className, variant = "outline", size = "icon", onClick, ...props }, ref) => {
230231
const { orientation, scrollNext, canScrollNext } = useCarousel()
231232

232233
return (
@@ -242,7 +243,7 @@ const CarouselNext = React.forwardRef<
242243
className
243244
)}
244245
disabled={!canScrollNext}
245-
onClick={scrollNext}
246+
onClick={(e) => { scrollNext(); onClick?.(e); }}
246247
{...props}
247248
>
248249
<ArrowRight className="h-4 w-4" />

‎e2e/config/constants.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
export const GRAPHRAG_SDK = "GraphRAG-SDK";
22
export const FLASK_GRAPH = "flask";
3-
export const CHAT_OPTTIONS_COUNT = 6;
3+
export const CHAT_OPTIONS_COUNT = 6;
44
export const Node_Question = "how many nodes do we have?";
55
export const Edge_Question = "how many edges do we have?";

‎e2e/logic/POM/codeGraph.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,10 @@ export default class CodeGraph extends BasePage {
2121
}
2222

2323
private get scopedLocator(): (selector: string) => Locator {
24-
return (selector: string) => this.container.locator(selector);
24+
return (selector: string) => {
25+
const scoped = selector.startsWith("//") ? `.${selector}` : selector;
26+
return this.container.locator(scoped);
27+
};
2528
}
2629

2730
/* NavBar Locators*/

‎e2e/tests/canvas.spec.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,10 +64,12 @@ test.describe("Canvas tests", () => {
6464
await codeGraph.waitForCanvasAnimationToEnd();
6565
const initialGraph = await codeGraph.getGraphNodes();
6666
const targetNode = findNodeByName(initialGraph, nodes[0].nodeName);
67+
expect(targetNode).toBeDefined();
6768
await codeGraph.nodeClick(targetNode.screenX, targetNode.screenY);
6869
await codeGraph.clickOnRemoveNodeViaElementMenu();
6970
const updatedGraph = await codeGraph.getGraphNodes();
7071
const updatedNode = findNodeByName(updatedGraph, nodes[0].nodeName);
72+
expect(updatedNode).toBeDefined();
7173
expect(updatedNode.visible).toBe(false);
7274
});
7375

0 commit comments

Comments
 (0)