From 918dd688f0d8057228a6e551d9e342fe8d5ca143 Mon Sep 17 00:00:00 2001 From: Kris McGinnes Date: Sat, 7 Jun 2025 22:12:38 -0500 Subject: [PATCH 1/6] Make selected layout readable --- .../src/modules/GraphViewer/SelectLayout.tsx | 21 ++++++++++--------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/packages/graph-explorer/src/modules/GraphViewer/SelectLayout.tsx b/packages/graph-explorer/src/modules/GraphViewer/SelectLayout.tsx index b03b617c0..389e45e67 100644 --- a/packages/graph-explorer/src/modules/GraphViewer/SelectLayout.tsx +++ b/packages/graph-explorer/src/modules/GraphViewer/SelectLayout.tsx @@ -20,6 +20,7 @@ export function SelectLayout({ ...selectTriggerProps }: ComponentPropsWithRef) { const [value, setValue] = useAtom(graphLayoutSelectionAtom); + return ( From 0df60ce8987557e904d198b5324ae6456b195287 Mon Sep 17 00:00:00 2001 From: Kris McGinnes Date: Sat, 7 Jun 2025 22:12:51 -0500 Subject: [PATCH 2/6] Add KeyboardKey component --- .../src/components/KeyboardKey.tsx | 17 +++++++++++++++++ packages/graph-explorer/src/components/index.ts | 2 ++ 2 files changed, 19 insertions(+) create mode 100644 packages/graph-explorer/src/components/KeyboardKey.tsx diff --git a/packages/graph-explorer/src/components/KeyboardKey.tsx b/packages/graph-explorer/src/components/KeyboardKey.tsx new file mode 100644 index 000000000..84994c865 --- /dev/null +++ b/packages/graph-explorer/src/components/KeyboardKey.tsx @@ -0,0 +1,17 @@ +import { ComponentPropsWithRef } from "react"; +import { cn } from "@/utils"; + +export function KeyboardKey({ + className, + ...props +}: ComponentPropsWithRef<"div">) { + return ( +
+ ); +} diff --git a/packages/graph-explorer/src/components/index.ts b/packages/graph-explorer/src/components/index.ts index 43c7656c0..61a632446 100644 --- a/packages/graph-explorer/src/components/index.ts +++ b/packages/graph-explorer/src/components/index.ts @@ -39,6 +39,8 @@ export * from "./Input"; export { default as InputField } from "./InputField"; export * from "./InputField"; +export * from "./KeyboardKey"; + export * from "./Label"; export { default as ListItem } from "./ListItem"; From f0e36911da495199c884d1f3c1e156ff946a9988 Mon Sep 17 00:00:00 2001 From: Kris McGinnes Date: Sat, 7 Jun 2025 22:13:01 -0500 Subject: [PATCH 3/6] Adjust button horizontal padding --- packages/graph-explorer/src/components/Button/Button.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/graph-explorer/src/components/Button/Button.tsx b/packages/graph-explorer/src/components/Button/Button.tsx index cff5d0c60..7f862ac29 100644 --- a/packages/graph-explorer/src/components/Button/Button.tsx +++ b/packages/graph-explorer/src/components/Button/Button.tsx @@ -18,8 +18,8 @@ export const buttonStyles = cva({ }, size: { small: "h-8 rounded px-1 text-base [&_svg]:size-5", - base: "h-10 rounded-md px-3 text-base [&_svg]:size-5", - large: "h-12 rounded-md px-4 text-lg [&_svg]:size-6", + base: "h-10 rounded-md px-4 text-base [&_svg]:size-5", + large: "h-12 rounded-md px-5 text-lg [&_svg]:size-6", }, }, compoundVariants: [ From ea2803f1a893c4d8c9eae416454b77b710fff834 Mon Sep 17 00:00:00 2001 From: Kris McGinnes Date: Sat, 7 Jun 2025 22:13:37 -0500 Subject: [PATCH 4/6] Update run query button style and tooltip --- .../SearchSidebar/QuerySearchTabContent.tsx | 35 +++++++++++++------ 1 file changed, 24 insertions(+), 11 deletions(-) diff --git a/packages/graph-explorer/src/modules/SearchSidebar/QuerySearchTabContent.tsx b/packages/graph-explorer/src/modules/SearchSidebar/QuerySearchTabContent.tsx index 1fecc1fab..4b4807853 100644 --- a/packages/graph-explorer/src/modules/SearchSidebar/QuerySearchTabContent.tsx +++ b/packages/graph-explorer/src/modules/SearchSidebar/QuerySearchTabContent.tsx @@ -4,15 +4,19 @@ import { FormControl, FormField, FormItem, + KeyboardKey, LoadingSpinner, PanelEmptyState, PanelError, SearchSadIcon, TextArea, + Tooltip, + TooltipContent, + TooltipTrigger, } from "@/components"; import { useExplorer, useUpdateSchemaFromEntities } from "@/core"; import { useMutation, useQueryClient } from "@tanstack/react-query"; -import { CornerDownRightIcon } from "lucide-react"; +import { SendHorizonalIcon } from "lucide-react"; import { z } from "zod"; import { useForm } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; @@ -90,16 +94,25 @@ export function QuerySearchTabContent() { )} /> -
- +
+ + + + + + Cmd +{" "} + Enter or{" "} + Ctrl +{" "} + Enter + +
From 5a53606f96f55e5a0251acd78f726767e6ff42ec Mon Sep 17 00:00:00 2001 From: Kris McGinnes Date: Sat, 7 Jun 2025 22:19:26 -0500 Subject: [PATCH 5/6] Update add all button to be more obvious --- .../SearchSidebar/SearchResultsList.tsx | 23 ++++++++++++------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/packages/graph-explorer/src/modules/SearchSidebar/SearchResultsList.tsx b/packages/graph-explorer/src/modules/SearchSidebar/SearchResultsList.tsx index 4c2c98361..8872eb547 100644 --- a/packages/graph-explorer/src/modules/SearchSidebar/SearchResultsList.tsx +++ b/packages/graph-explorer/src/modules/SearchSidebar/SearchResultsList.tsx @@ -8,7 +8,7 @@ import { import { MappedQueryResults } from "@/connector"; import { NodeSearchResult } from "./NodeSearchResult"; import { useAddToGraphMutation } from "@/hooks/useAddToGraph"; -import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react"; +import { ChevronLeftIcon, ChevronRightIcon, ListPlusIcon } from "lucide-react"; import { EdgeSearchResult } from "./EdgeSearchResult"; import { ScalarSearchResult } from "./ScalarSearchResult"; import { Edge, Vertex } from "@/core"; @@ -57,7 +57,7 @@ export function SearchResultsList(results: MappedQueryResults) { vertices={results.vertices} edges={results.edges} /> -
+
{isPagingNecessary ? (
@@ -135,22 +135,29 @@ function AddAllToGraphButton({ ...props }: ButtonProps & { vertices: Vertex[]; edges: Edge[] }) { const mutation = useAddToGraphMutation(); - const canSendToGraph = vertices.length > 0 || edges.length > 0; - const counts = vertices.length + edges.length; - if (counts === 0) { + // Ensure there are entities that can be added to the graph + const canSendToGraph = vertices.length + edges.length > 0; + if (!canSendToGraph) { return null; } return (