From 8793a8a94701f55b67ce36fe427396f7853b5c07 Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Sun, 1 Sep 2024 12:48:16 +0300 Subject: [PATCH 01/18] fix rerouting from setting when not admin --- app/settings/page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/settings/page.tsx b/app/settings/page.tsx index 43c909f9..ebf868fe 100644 --- a/app/settings/page.tsx +++ b/app/settings/page.tsx @@ -13,10 +13,10 @@ export default function Settings() { const [current, setCurrent] = useState('DB') const router = useRouter() - const {data: session} = useSession() + const { data: session } = useSession() useEffect(() => { - if (session?.user.role !== "Admin") router.back() + if (session && session?.user.role !== "Admin") router.back() }, [router, session]) const getCurrentTab = () => { From 7371b37db09779f381fe6fb98cae7c72690ce904 Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Sun, 1 Sep 2024 13:00:33 +0300 Subject: [PATCH 02/18] add key event for escape to close full screen --- app/graph/GraphView.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/graph/GraphView.tsx b/app/graph/GraphView.tsx index e6588326..e3be3927 100644 --- a/app/graph/GraphView.tsx +++ b/app/graph/GraphView.tsx @@ -448,7 +448,7 @@ const GraphView = forwardRef(({ graph, runQuery, historyQuery, fetchCount }: { + > { !maximize && @@ -536,6 +536,10 @@ const GraphView = forwardRef(({ graph, runQuery, historyQuery, fetchCount }: { icon={} title="Minimize" onClick={() => setMaximize(false)} + onKeyDown={(e) => { + debugger + e.code === "Escape" && setMaximize(false) + }} /> } Date: Sun, 1 Sep 2024 13:23:03 +0300 Subject: [PATCH 03/18] remove debugger --- app/graph/GraphView.tsx | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/app/graph/GraphView.tsx b/app/graph/GraphView.tsx index e3be3927..82106ddf 100644 --- a/app/graph/GraphView.tsx +++ b/app/graph/GraphView.tsx @@ -536,10 +536,7 @@ const GraphView = forwardRef(({ graph, runQuery, historyQuery, fetchCount }: { icon={} title="Minimize" onClick={() => setMaximize(false)} - onKeyDown={(e) => { - debugger - e.code === "Escape" && setMaximize(false) - }} + onKeyDown={(e) => e.code === "Escape" && setMaximize(false)} /> } Date: Mon, 2 Sep 2024 13:28:27 +0300 Subject: [PATCH 04/18] fix the overlay in the labels --- app/globals.css | 5 ++++ app/graph/labels.tsx | 65 ++++++++++++++++++++++++++++++-------------- 2 files changed, 49 insertions(+), 21 deletions(-) diff --git a/app/globals.css b/app/globals.css index 6d5ade16..0ce23e5c 100644 --- a/app/globals.css +++ b/app/globals.css @@ -26,6 +26,11 @@ } @layer components { + + .hide-scrollbar { + scrollbar-width: none; + -ms-overflow-style: none; + } .Page { @apply h-full w-full flex flex-col bg-background; diff --git a/app/graph/labels.tsx b/app/graph/labels.tsx index c00c6fff..22084770 100644 --- a/app/graph/labels.tsx +++ b/app/graph/labels.tsx @@ -1,7 +1,8 @@ -import { useState } from "react"; +import { useRef, useState } from "react"; import { cn } from "@/lib/utils"; import { Category, getCategoryColorName } from "../api/graph/model"; import Button from "../components/ui/Button"; +import { ChevronLeft, ChevronRight } from "lucide-react"; /* eslint-disable react/require-default-props */ interface Props { @@ -15,32 +16,54 @@ export default function Labels({ categories, onClick, label, className = "" }: P // fake state to force reload const [, setReload] = useState(false) + const listRef = useRef(null) + + const handelScroll = (scrollTo: number) => { + listRef.current?.scrollBy({ + behavior: "smooth", + left: scrollTo, + }) + } return ( -
+
{ label &&

{label}

} -
    - { - categories.map((category) => ( -
  • -
    • - )) - } -
+
+
+
+
    + { + categories.map((category) => ( +
  • +
    • + )) + } +
+
) } \ No newline at end of file From 3090ffca5b6b106f12a246f102717770b2e251ca Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Mon, 2 Sep 2024 14:36:45 +0300 Subject: [PATCH 05/18] make the labels containers scrollable --- app/graph/labels.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/graph/labels.tsx b/app/graph/labels.tsx index 22084770..d028a62c 100644 --- a/app/graph/labels.tsx +++ b/app/graph/labels.tsx @@ -36,12 +36,12 @@ export default function Labels({ categories, onClick, label, className = "" }: P
    From 54f683e6ca75951429cdfa6855d5c37166afdc16 Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Mon, 2 Sep 2024 14:48:51 +0300 Subject: [PATCH 06/18] make the non editable values cursor default --- app/settings/Configurations.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/app/settings/Configurations.tsx b/app/settings/Configurations.tsx index 22aea1fe..f9df316c 100644 --- a/app/settings/Configurations.tsx +++ b/app/settings/Configurations.tsx @@ -210,6 +210,7 @@ export default function Configurations() { value={configValue} /> :
+ { + isScrollable && + + ) +} \ No newline at end of file diff --git a/app/graph/labels.tsx b/app/graph/labels.tsx index c00c6fff..306db65a 100644 --- a/app/graph/labels.tsx +++ b/app/graph/labels.tsx @@ -1,17 +1,18 @@ import { useState } from "react"; import { cn } from "@/lib/utils"; -import { Category, getCategoryColorName } from "../api/graph/model"; +import { Category, Graph } from "../api/graph/model"; import Button from "../components/ui/Button"; /* eslint-disable react/require-default-props */ interface Props { + graph: Graph, categories: Category[], onClick: (category: Category) => void, label?: string, className?: string } -export default function Labels({ categories, onClick, label, className = "" }: Props) { +export default function Labels({ graph, categories, onClick, label, className = "" }: Props) { // fake state to force reload const [, setReload] = useState(false) @@ -30,12 +31,12 @@ export default function Labels({ categories, onClick, label, className = "" }: P className={cn(category.name && "flex gap-2 items-center")} label={category.name} icon={ -
+
} - onClick={() => { - onClick(category) - setReload(prev => !prev) - }} + onClick={() => { + onClick(category) + setReload(prev => !prev) + }} /> )) diff --git a/app/graph/page.tsx b/app/graph/page.tsx index 6536d5f7..8bd8c4d8 100644 --- a/app/graph/page.tsx +++ b/app/graph/page.tsx @@ -22,24 +22,25 @@ export default function Page() { "MATCH (n) RETURN COUNT(n) as nodes", "MATCH ()-[e]->() RETURN COUNT(e) as edges" ] - + const nodes = await (await securedFetch(`api/graph/${prepareArg(graphName)}/?query=${q[0]}`, { method: "GET" })).json() - + const edges = await (await securedFetch(`api/graph/${prepareArg(graphName)}/?query=${q[1]}`, { method: "GET" })).json() - + if (!edges || !nodes) return - + setEdgesCount(edges.result?.data[0].edges) setNodesCount(nodes.result?.data[0].nodes) }, [graphName]) - + useEffect(() => { if (graphName !== graph.Id) { - setGraph(Graph.empty()) + const colors = localStorage.getItem(graphName)?.split(/[[\]",]/).filter(c => c) + setGraph(Graph.empty(graphName, colors)) } }, [graph.Id, graphName]) @@ -68,7 +69,7 @@ export default function Page() { const result = await run(query) if (!result) return setQueries(prev => [...prev, { text: defaultQuery(query), metadata: result.metadata }]) - setGraph(Graph.create(graphName, result)) + setGraph(Graph.create(graphName, result, graph.Colors)) } const runHistoryQuery = async (query: string, setQueriesOpen: (open: boolean) => void) => { @@ -91,6 +92,9 @@ export default function Page() { runQuery={runHistoryQuery} edgesCount={edgesCount} nodesCount={nodesCount} + setGraph={setGraph} + graph={graph} + />
-
+

{selectedNodes[0]?.category}

-
+

{selectedNodes[1]?.category}

diff --git a/app/schema/SchemaView.tsx b/app/schema/SchemaView.tsx index 4cd115f9..247c4db1 100644 --- a/app/schema/SchemaView.tsx +++ b/app/schema/SchemaView.tsx @@ -11,7 +11,7 @@ import { ElementDataDefinition, Toast, cn, prepareArg, securedFetch } from "@/li import Toolbar from "../graph/toolbar" import SchemaDataPanel, { Attribute } from "./SchemaDataPanel" import Labels from "../graph/labels" -import { Category, getCategoryColorValue, Graph } from "../api/graph/model" +import { Category, Graph } from "../api/graph/model" import Button from "../components/ui/Button" import CreateElement from "./SchemaCreateElement" @@ -381,7 +381,7 @@ export default function SchemaView({ schema, fetchCount }: Props) { // eslint-disable-next-line no-param-reassign n.data().category = category // eslint-disable-next-line no-param-reassign - n.data().color = getCategoryColorValue(c.index) + n.data().color = schema.getCategoryColorValue(c.index) } }); chartRef.current?.elements().layout(LAYOUT).run(); @@ -523,8 +523,8 @@ export default function SchemaView({ schema, fetchCount }: Props) { { (schema.Categories.length > 0 || schema.Labels.length > 0) && <> - - + + }
diff --git a/app/schema/page.tsx b/app/schema/page.tsx index 9ee53ee5..0bd430a5 100644 --- a/app/schema/page.tsx +++ b/app/schema/page.tsx @@ -46,7 +46,8 @@ export default function Page() { return } const json = await result.json() - setSchema(Graph.create(schemaName, json.result)) + const colors = localStorage.getItem(schemaName)?.split(/[[\]",]/).filter(c => c) + setSchema(Graph.create(schemaName, json.result, colors)) fetchCount() @@ -63,6 +64,8 @@ export default function Page() { nodesCount={nodesCount} onChange={setSchemaName} graphName={schemaName} + graph={schema} + setGraph={setSchema} />
diff --git a/tailwind.config.js b/tailwind.config.js index dcfc8459..79fbadd9 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -23,12 +23,6 @@ module.exports = { }, extend: { colors: { - blue: "#7167F6", - pink: "#ED70B1", - orange: "#EF8759", - aqua: "#99E4E5", - yellow: "#F2EB47", - green: "#89D86D", border: "hsl(var(--border))", input: "hsl(var(--input))", ring: "hsl(var(--ring))", From 09f9672565aa0370c225543b021c6b1f49f987b2 Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Sun, 8 Sep 2024 14:28:37 +0300 Subject: [PATCH 10/18] un commit --- app/globals.css | 9 --------- 1 file changed, 9 deletions(-) diff --git a/app/globals.css b/app/globals.css index aa415aee..4d842e4d 100644 --- a/app/globals.css +++ b/app/globals.css @@ -79,15 +79,6 @@ } -input[type="number"]::-webkit-outer-spin-button, -input[type="number"]::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; -} -input[type="number"] { - -moz-appearance: textfield; -} - @font-face { font-family: 'Obviously Narrow'; src: url('/fonts/obviously_narrow.woff2') format('woff2'), From 0465fc40ecc6c6a1c36059c6f7379dcb5492f517 Mon Sep 17 00:00:00 2001 From: Anchel135 Date: Sun, 8 Sep 2024 14:58:51 +0300 Subject: [PATCH 11/18] add x and v buttons to set config and change the input type to number --- app/globals.css | 8 ++++ app/graph/toolbar.tsx | 2 - app/settings/Configurations.tsx | 70 ++++++++++++++++++++++----------- 3 files changed, 54 insertions(+), 26 deletions(-) diff --git a/app/globals.css b/app/globals.css index 6d5ade16..64fe52a6 100644 --- a/app/globals.css +++ b/app/globals.css @@ -73,6 +73,14 @@ } } +input[type="number"]::-webkit-outer-spin-button, +input[type="number"]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} +input[type="number"] { + -moz-appearance: textfield; +} @font-face { font-family: 'Obviously Narrow'; diff --git a/app/graph/toolbar.tsx b/app/graph/toolbar.tsx index e3a712bd..20a95524 100644 --- a/app/graph/toolbar.tsx +++ b/app/graph/toolbar.tsx @@ -44,7 +44,6 @@ export default function Toolbar({ disabled, chartRef, onDeleteElement, onAddEnti