Skip to content

Commit 5967a70

Browse files
florianbgtflorianbgt
committed
Some small UI fixes
1 parent 8165237 commit 5967a70

File tree

6 files changed

+44
-426
lines changed

6 files changed

+44
-426
lines changed

‎packages/app/src/components/FileExplorer/FileExplorer.tsx‎

Lines changed: 24 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
Tooltip,
88
} from "@radix-ui/themes";
99
import { useEffect, useRef, useState } from "react";
10-
import { Link, useParams } from "react-router";
10+
import { Link } from "react-router";
1111
import {
1212
PanelGroup,
1313
Panel,
@@ -16,7 +16,7 @@ import {
1616
} from "react-resizable-panels";
1717
import { ExtractionNode } from "@nanoapi.io/shared";
1818
import { FileExplorerSkeleton } from "./Skeleton.js";
19-
import { LuSearchCode, LuX } from "react-icons/lu";
19+
import { LuSearchCode, LuSearchSlash, LuX } from "react-icons/lu";
2020
import languageIcon from "./languageIcons.js";
2121
import {
2222
MdSearch,
@@ -378,8 +378,6 @@ function NodeElement(props: {
378378
hlNodeId: string | null;
379379
setHLNodeId: (node: string | null) => void;
380380
}) {
381-
const params = useParams<{ file?: string }>();
382-
383381
const [isOpen, setIsOpen] = useState(false);
384382

385383
const shouldAutoExpand = props.search.length > 0 && props.node.matchesSearch;
@@ -471,16 +469,30 @@ function NodeElement(props: {
471469
</div>
472470
</div>
473471
) : (
474-
<Button
475-
className={`w-full text-text-light dark:text-text-dark ${params.file === props.node.id && "bg-background-light dark:bg-background-dark"}`}
476-
variant="ghost"
477-
color="violet"
478-
>
479-
<div className="w-full flex items-center space-x-2">
472+
<div className="flex justify-between w-full items-center">
473+
<div className="flex items-center space-x-2 text-sm">
480474
<MdSubdirectoryArrowRight className="text-gray-light dark:text-gray-dark" />
481475
<DisplayedPath node={props.node} search={props.search} />
482476
</div>
483-
</Button>
477+
<div>
478+
<Button
479+
className="text-xl text-text-light dark:text-text-dark"
480+
variant="ghost"
481+
color="violet"
482+
>
483+
<Tooltip content="View details">
484+
<Link
485+
to={`/audit/${props.node.id
486+
.split("#")
487+
.map((id) => encodeURIComponent(id))
488+
.join("/")}`}
489+
>
490+
<LuSearchSlash className="text-gray-light dark:text-gray-dark" />
491+
</Link>
492+
</Tooltip>
493+
</Button>
494+
</div>
495+
</div>
484496
)}
485497
</>
486498
)}
@@ -504,7 +516,7 @@ function DisplayedPath({
504516
node: TreeData;
505517
search: string;
506518
}) {
507-
const maxPathLength = 35 - 2 * node.level;
519+
const maxPathLength = Math.max(25 - 2 * node.level, 5);
508520
let foundInSearch = false;
509521
if (search.length > 2) {
510522
foundInSearch = node.name.toLowerCase().includes(search.toLowerCase());

‎packages/app/src/helpers/cytoscape/fileDependencyVisualizer/index.ts‎

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,6 @@ export class FileDependencyVisualizer {
8888
data: NapiNodeData;
8989
}) => void;
9090
};
91-
/** Error and success character symbols for node labels */
92-
private errorChar = "⚠️";
93-
private successChar = "🎉";
9491

9592
constructor(
9693
container: HTMLElement,
@@ -709,7 +706,7 @@ export class FileDependencyVisualizer {
709706
{
710707
selector: "edge",
711708
style: {
712-
width: 1,
709+
width: 2,
713710
"line-color": tailwindConfig.theme.extend.colors.text[theme],
714711
"line-opacity": 1,
715712
"target-arrow-color": tailwindConfig.theme.extend.colors.text[theme],
@@ -719,19 +716,19 @@ export class FileDependencyVisualizer {
719716
},
720717
},
721718
{
722-
selector: `edge[customData.type = '${edgeTypeDependent}']`,
719+
selector: `edge[customData.type = '${edgeTypeDependency}']`,
723720
style: {
724-
"line-color": tailwindConfig.theme.extend.colors.secondary[theme],
721+
"line-color": tailwindConfig.theme.extend.colors.primary[theme],
725722
"target-arrow-color":
726-
tailwindConfig.theme.extend.colors.secondary[theme],
723+
tailwindConfig.theme.extend.colors.primary[theme],
727724
},
728725
},
729726
{
730-
selector: `edge[customData.type = '${edgeTypeDependency}']`,
727+
selector: `edge[customData.type = '${edgeTypeDependent}']`,
731728
style: {
732-
"line-color": tailwindConfig.theme.extend.colors.primary[theme],
729+
"line-color": tailwindConfig.theme.extend.colors.secondary[theme],
733730
"target-arrow-color":
734-
tailwindConfig.theme.extend.colors.primary[theme],
731+
tailwindConfig.theme.extend.colors.secondary[theme],
735732
},
736733
},
737734
{

‎packages/app/src/helpers/cytoscape/projectDependencyVisualizer/index.ts‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -363,28 +363,29 @@ export class ProjectDependencyVisualizer {
363363
selector: "edge",
364364
style: {
365365
width: 1,
366-
"line-color": tailwindConfig.theme.extend.colors.text[theme],
367-
"line-opacity": 1,
368-
"target-arrow-color": tailwindConfig.theme.extend.colors.text[theme],
366+
"line-color": tailwindConfig.theme.extend.colors.primary[theme],
367+
"target-arrow-color":
368+
tailwindConfig.theme.extend.colors.primary[theme],
369369
"target-arrow-shape": "triangle",
370370
"curve-style": "straight",
371-
"arrow-scale": 1,
372371
},
373372
},
374373
{
375374
selector: "edge.dependency",
376375
style: {
377-
"line-color": tailwindConfig.theme.extend.colors.secondary[theme],
376+
width: 2,
377+
"line-color": tailwindConfig.theme.extend.colors.primary[theme],
378378
"target-arrow-color":
379-
tailwindConfig.theme.extend.colors.secondary[theme],
379+
tailwindConfig.theme.extend.colors.primary[theme],
380380
},
381381
},
382382
{
383383
selector: "edge.dependent",
384384
style: {
385-
"line-color": tailwindConfig.theme.extend.colors.primary[theme],
385+
width: 2,
386+
"line-color": tailwindConfig.theme.extend.colors.secondary[theme],
386387
"target-arrow-color":
387-
tailwindConfig.theme.extend.colors.primary[theme],
388+
tailwindConfig.theme.extend.colors.secondary[theme],
388389
},
389390
},
390391
{

0 commit comments

Comments
 (0)