diff --git a/Changelog.md b/Changelog.md index 56c808568..d461b6cbf 100644 --- a/Changelog.md +++ b/Changelog.md @@ -10,7 +10,8 @@ [#956](https://github.com/aws/graph-explorer/pull/956), [#957](https://github.com/aws/graph-explorer/pull/957), [#974](https://github.com/aws/graph-explorer/pull/974), - [#958](https://github.com/aws/graph-explorer/pull/958)) + [#958](https://github.com/aws/graph-explorer/pull/958), + [#989](https://github.com/aws/graph-explorer/pull/989)) - **Updated** graph layout options to include better descriptions and new directions for hierarchical and subway ([#973](https://github.com/aws/graph-explorer/pull/973)) 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: [ 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"; 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 ( 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 + +
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 (