From c0e70847861ed7bca038ac57bc99bce471e9660f Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Tue, 16 Apr 2024 14:38:08 +0300 Subject: [PATCH 01/10] fix styling --- app/graph/DataPanel.tsx | 9 ++++--- app/graph/GraphView.tsx | 2 +- app/graph/query.tsx | 19 +++++-------- app/graph/toolbar.tsx | 52 ++++++++++++------------------------ app/providers.tsx | 8 +++--- components/custom/navbar.tsx | 5 ++-- 6 files changed, 37 insertions(+), 58 deletions(-) diff --git a/app/graph/DataPanel.tsx b/app/graph/DataPanel.tsx index 2b482fcb..318d2507 100644 --- a/app/graph/DataPanel.tsx +++ b/app/graph/DataPanel.tsx @@ -1,4 +1,4 @@ -import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; +import { Table, TableBody, TableCaption, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; interface Props { @@ -17,9 +17,10 @@ const excludedProperties = new Set([ // eslint-disable-next-line @typescript-eslint/no-explicit-any export default function DataPanel({ object }: Props) { const rowClass = "dark:hover:bg-slate-700 hover:bg-gray-400 border-y-[1px] border-y-gray-700" - + const type = object.sucre ? "edge" : "node" return ( + {type} properties Field @@ -38,10 +39,10 @@ export default function DataPanel({ object }: Props) { const text = cellIndex === 1 ? JSON.parse(strCell) : strCell return ( // eslint-disable-next-line react/no-array-index-key - + - + {text} diff --git a/app/graph/GraphView.tsx b/app/graph/GraphView.tsx index f99ee12e..df7934ba 100644 --- a/app/graph/GraphView.tsx +++ b/app/graph/GraphView.tsx @@ -216,7 +216,7 @@ const GraphView = forwardRef(({ graph, darkmode }: GraphViewProps, ref) => { { selectedObject && - } diff --git a/app/graph/query.tsx b/app/graph/query.tsx index 07246ae1..f8affe56 100644 --- a/app/graph/query.tsx +++ b/app/graph/query.tsx @@ -88,8 +88,10 @@ export function Query({ onSubmit, onQueryUpdate, onDelete, className = "" }: { />
- - + + - - - - - - -

Run Query

- - - +
diff --git a/app/graph/toolbar.tsx b/app/graph/toolbar.tsx index 07768fbf..2073e722 100644 --- a/app/graph/toolbar.tsx +++ b/app/graph/toolbar.tsx @@ -1,4 +1,3 @@ -import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; import { CircleDot, ZoomIn, ZoomOut } from "lucide-react"; import { cn } from "@/lib/utils" @@ -22,39 +21,22 @@ export default function Toolbar({ chartRef, className = "" }: { } return ( - -
    -
  • - - handleZoomClick(1.1)}> - - - -

    Zoom In

    -     -     -
    • -
  • - - handleZoomClick(0.9)}> - - - -

    Zoom Out

    -     -     -
    • -
  • - - - - - -

    Center

    -     -     -
    • -
- +
    +
  • + +
    • +
  • + +
    • +
  • + +
    • +
) } diff --git a/app/providers.tsx b/app/providers.tsx index 1d236b2f..cbc1e2ac 100644 --- a/app/providers.tsx +++ b/app/providers.tsx @@ -12,7 +12,7 @@ import useScreenSize from "./useScreenSize"; export default function NextAuthProvider({ children }: { children: React.ReactNode }) { const { screenSize } = useScreenSize(); - const isSmallScreen = screenSize === 'sm' || screenSize === 'xs' + const isSmallScreen = screenSize === 'sm' || screenSize === 'xs' || screenSize === 'md' const [isCollapsed, setCollapsed] = useState(isSmallScreen) const navPanel = useRef(null) @@ -35,8 +35,8 @@ export default function NextAuthProvider({ children }: { children: React.ReactNo } } } - const panelSize = 9 - const collapsedSize = 3 + const panelSize = isSmallScreen ? 7 : 9 + const collapsedSize = isSmallScreen ? 7 : 3 return ( @@ -51,7 +51,7 @@ export default function NextAuthProvider({ children }: { children: React.ReactNo minSize={panelSize} onCollapse={() => { setCollapsed(true) }} onExpand={() => { setCollapsed(false) }}> - diff --git a/components/custom/navbar.tsx b/components/custom/navbar.tsx index c1f98318..c16c6d1d 100644 --- a/components/custom/navbar.tsx +++ b/components/custom/navbar.tsx @@ -49,7 +49,7 @@ export default function Navbar({ collapsed }: { collapsed: boolean }) { const [mounted, setMounted] = useState(false) const pathName = usePathname() const darkmode = theme === "dark" || (theme === "system" && systemTheme === "dark") - + useEffect(() => { setMounted(true) }, []) @@ -62,6 +62,7 @@ export default function Navbar({ collapsed }: { collapsed: boolean }) { // eslint-disable-next-line react/no-array-index-key
  • @@ -81,7 +82,7 @@ export default function Navbar({ collapsed }: { collapsed: boolean }) {
  • { mounted && - @@ -102,6 +102,7 @@ export function Query({ onSubmit, onQueryUpdate, onDelete, className = "" }: { /> diff --git a/app/graph/toolbar.tsx b/app/graph/toolbar.tsx index 2073e722..def50ac7 100644 --- a/app/graph/toolbar.tsx +++ b/app/graph/toolbar.tsx @@ -23,17 +23,20 @@ export default function Toolbar({ chartRef, className = "" }: { return (
    • -
    • -
    • -
      • From f4892d9ed43707d741b29ad70f6027c457e25327 Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Tue, 16 Apr 2024 14:47:32 +0300 Subject: [PATCH 03/10] fix code rabbit --- app/components/combobox.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/combobox.tsx b/app/components/combobox.tsx index dc882684..019c486f 100644 --- a/app/components/combobox.tsx +++ b/app/components/combobox.tsx @@ -151,9 +151,9 @@ export default function Combobox({ className = '', type = '', options, addOption - Are you absolutely sure you? + Are you absolutely sure? - Are you absolutely sure you want to delete {deleteGraph}? + Are you sure you want to delete {deleteGraph}? From 79d45dffea356c2f318fbef05d690bbcbe58a849 Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Tue, 16 Apr 2024 14:48:24 +0300 Subject: [PATCH 04/10] remove log --- app/api/graph/[graph]/route.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/app/api/graph/[graph]/route.ts b/app/api/graph/[graph]/route.ts index e98a8309..a741e18e 100644 --- a/app/api/graph/[graph]/route.ts +++ b/app/api/graph/[graph]/route.ts @@ -24,7 +24,6 @@ export async function DELETE(request: NextRequest, { params }: { params: { graph const graph = client.selectGraph(graphId); await graph.delete() - console.log(client.list()); return NextResponse.json({ message: `${graphId} graph deleted` }) } From c3a0eb2b6c6d0c96f65afa72c4de95e5ababc900 Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Tue, 16 Apr 2024 14:56:35 +0300 Subject: [PATCH 05/10] remove unnecessary useEffect --- app/graph/query.tsx | 7 ------- 1 file changed, 7 deletions(-) diff --git a/app/graph/query.tsx b/app/graph/query.tsx index ac5efed2..1dda9d58 100644 --- a/app/graph/query.tsx +++ b/app/graph/query.tsx @@ -39,13 +39,6 @@ export function Query({ onSubmit, onQueryUpdate, onDelete, className = "" }: { const height = getHeight(); - useEffect(() => { - if (monacoEditor) { - const scrollLine = query?.split("\n").length || lineHeight - monacoEditor.setScrollPosition({ scrollTop: scrollLine }); - } - }, [height]) - onQueryUpdate(new QueryState(query, graphName)) return ( From ba74aa9ca33efadf6dbe94847ee131367ed03d9c Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Tue, 16 Apr 2024 15:42:20 +0300 Subject: [PATCH 06/10] remove unnecessary state of the monaco editor --- app/graph/query.tsx | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/app/graph/query.tsx b/app/graph/query.tsx index 1dda9d58..c4d5e735 100644 --- a/app/graph/query.tsx +++ b/app/graph/query.tsx @@ -1,9 +1,8 @@ import { cn } from "@/lib/utils"; -import { useEffect, useState } from "react"; +import { useState } from "react"; import { Maximize, Play } from "lucide-react"; import Editor from "@monaco-editor/react"; import { useTheme } from "next-themes"; -import { editor } from "monaco-editor"; import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog"; import GraphsList from "./GraphList"; @@ -24,7 +23,6 @@ export function Query({ onSubmit, onQueryUpdate, onDelete, className = "" }: { const [query, setQuery] = useState(); const [graphName, setGraphName] = useState(''); const { theme, systemTheme } = useTheme() - const [monacoEditor, setMonacoEditor] = useState(null) const darkmode = theme === "dark" || (theme === "system" && systemTheme === "dark") const getHeight = () => { @@ -54,7 +52,6 @@ export function Query({ onSubmit, onQueryUpdate, onDelete, className = "" }: { height={height} value={query} onChange={setQuery} - onMount={setMonacoEditor} theme={`${darkmode ? "vs-dark" : "light"}`} language="cypher" options={{ From a1aba7aa62789b2114cfeb1a34dd1786b558d783 Mon Sep 17 00:00:00 2001 From: Guy Korland Date: Sun, 21 Apr 2024 10:33:53 +0300 Subject: [PATCH 07/10] Fix #185 Update README.md - Add title (#186) * Fix #185 Update README.md * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --- README.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 4e8ca046..d0669c51 100644 --- a/README.md +++ b/README.md @@ -3,9 +3,13 @@ [![Discord](https://img.shields.io/discord/1146782921294884966?style=flat-square)](https://discord.gg/6M4QwDXn2w) [![Workflow](https://github.com/FalkorDB/falkordb-browser/actions/workflows/nextjs.yml/badge.svg?branch=main)](https://github.com/FalkorDB/falkordb-browser/actions/workflows/nextjs.yml) +# FalkorDB-Browser + +[![Try Free](https://img.shields.io/badge/Try%20Free-FalkorDB%20Cloud-FF8101?labelColor=FDE900&style=for-the-badge&link=https://app.falkordb.cloud)](https://app.falkordb.cloud) + FalkorDB-Browser is a visualization UI for FalkorDB. -To see a running demo check: https://browser.falkordb.com/ +To see a running demo, check: https://browser.falkordb.com/ ![image](https://github.com/FalkorDB/falkordb-browser/assets/753206/51a81ef9-6bb2-40ce-ad9b-6381978c7562) From c1f0fc473733b1b07fb66704cfa8a761b6ae8540 Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Sun, 21 Apr 2024 10:40:17 +0300 Subject: [PATCH 08/10] Update route.ts --- app/api/graph/[graph]/route.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/app/api/graph/[graph]/route.ts b/app/api/graph/[graph]/route.ts index e98a8309..a741e18e 100644 --- a/app/api/graph/[graph]/route.ts +++ b/app/api/graph/[graph]/route.ts @@ -24,7 +24,6 @@ export async function DELETE(request: NextRequest, { params }: { params: { graph const graph = client.selectGraph(graphId); await graph.delete() - console.log(client.list()); return NextResponse.json({ message: `${graphId} graph deleted` }) } From 1d502419c431846da88dad4ccc32056b977ca7fd Mon Sep 17 00:00:00 2001 From: Avi Avni Date: Sun, 21 Apr 2024 14:40:59 +0300 Subject: [PATCH 09/10] fix attribute name --- app/graph/DataPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/graph/DataPanel.tsx b/app/graph/DataPanel.tsx index 318d2507..3af69da7 100644 --- a/app/graph/DataPanel.tsx +++ b/app/graph/DataPanel.tsx @@ -17,7 +17,7 @@ const excludedProperties = new Set([ // eslint-disable-next-line @typescript-eslint/no-explicit-any export default function DataPanel({ object }: Props) { const rowClass = "dark:hover:bg-slate-700 hover:bg-gray-400 border-y-[1px] border-y-gray-700" - const type = object.sucre ? "edge" : "node" + const type = object.source ? "edge" : "node" return (
    • {type} properties From a8b37e24fd177724a0db4e1304f12c98c3e18ebb Mon Sep 17 00:00:00 2001 From: Anchel123 <110421452+Anchel123@users.noreply.github.com> Date: Sun, 21 Apr 2024 15:23:52 +0300 Subject: [PATCH 10/10] remove log --- app/api/graph/[graph]/route.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/app/api/graph/[graph]/route.ts b/app/api/graph/[graph]/route.ts index 8e95a132..48be8b2b 100644 --- a/app/api/graph/[graph]/route.ts +++ b/app/api/graph/[graph]/route.ts @@ -83,7 +83,6 @@ export async function PATCH(request: NextRequest, { params }: { params: { graph: if (!newName) throw (new Error("Missing parameter 'newName'")) const data = await client.connection.renameNX(graphId, newName); - console.log(data); if (!data) throw (new Error(`${newName} already exists`))