Merge pull request #149 from FalkorDB/empty-graph-after-delete

fix #146 empty the graph after delete
FalkorDB · Apr 4, 2024 · cd818ba · cd818ba
2 parents cb3e6ba + 69af9ba
commit cd818ba
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/app/graph/page.tsx b/app/graph/page.tsx
@@ -9,7 +9,7 @@ import { Query, QueryState } from "./query";
 import { TableView } from "./tableview";
 import MetaDataView from "./metadataview";
 import { Graph } from "./model";
-import GraphView,  { GraphViewRef } from "./GraphView";
+import GraphView, { GraphViewRef } from "./GraphView";
 
 
 
@@ -94,7 +94,12 @@ export default function Page() {
 
     return (
         <div className="h-full flex flex-col p-2 gap-y-2">
-            <Query className="border rounded-lg border-gray-300 p-2" onSubmit={runQuery} onQueryUpdate={(state) => { queryState.current = state }} />
+            <Query
+                className="border rounded-lg border-gray-300 p-2"
+                onSubmit={runQuery}
+                onQueryUpdate={(state) => { queryState.current = state }}
+                onDeleteGraph={() => setGraph(Graph.empty())}
+            />
             <div className="flex flex-col grow border border-gray-300 rounded-lg p-2 overflow-auto">
                 {
                     graph.Id &&

diff --git a/app/graph/query.tsx b/app/graph/query.tsx
@@ -18,9 +18,10 @@ export class QueryState {
     ) { }
 }
 
-export function Query({ onSubmit, onQueryUpdate, className = "" }: {
+export function Query({ onSubmit, onQueryUpdate, onDeleteGraph, className = "" }: {
     onSubmit: (event: React.FormEvent<HTMLFormElement>) => void,
     onQueryUpdate: (state: QueryState) => void,
+    onDeleteGraph: () => void,
     className: string
 }) {
     const [query, setQuery] = useState('');
@@ -40,6 +41,7 @@ export function Query({ onSubmit, onQueryUpdate, className = "" }: {
             })
             setOnDelete(prev => !prev)
             setGraphName('')
+            onDeleteGraph()
         }).catch(err => {
             toast({
                 title: "Error",
@@ -57,8 +59,13 @@ export function Query({ onSubmit, onQueryUpdate, className = "" }: {
                 <GraphsList onDelete={onDelete} onSelectedGraph={setGraphName} />
             </div>
             <div className="flex flex-row space-x-3 w-full md:w-8/12 items-center">
-                <Input id="query" className="border-gray-500 w-full"
-                    placeholder="MATCH (n) OPTIONAL MATCH (n)-[e]-(m) RETURN n,e,m limit 100" type="text" onChange={(event) => setQuery(event.target.value)} />
+                <Input
+                    id="query"
+                    className="border-gray-500 w-full"
+                    placeholder="MATCH (n) OPTIONAL MATCH (n)-[e]-(m) RETURN n,e,m limit 100"
+                    type="text"
+                    onChange={(event) => setQuery(event.target.value)}
+                />
                 <TooltipProvider>
                     <Tooltip>
                         <TooltipTrigger asChild>