From 898d81d6e90c7ac8579e01bffb731cc5042e3a76 Mon Sep 17 00:00:00 2001
From: 1ilit <lilitmousheghyan@gmail.com>
Date: Sat, 20 Apr 2024 18:16:41 +0300
Subject: [PATCH] Display sql error location and message on import

---
 .../EditorHeader/Modal/ImportSource.jsx       | 32 +++++++++++++++++--
 src/components/EditorHeader/Modal/Modal.jsx   | 17 +++++++---
 2 files changed, 43 insertions(+), 6 deletions(-)

diff --git a/src/components/EditorHeader/Modal/ImportSource.jsx b/src/components/EditorHeader/Modal/ImportSource.jsx
index 1b86454..f5283ab 100644
--- a/src/components/EditorHeader/Modal/ImportSource.jsx
+++ b/src/components/EditorHeader/Modal/ImportSource.jsx
@@ -1,7 +1,12 @@
-import { Upload, Checkbox } from "@douyinfe/semi-ui";
+import { Upload, Checkbox, Banner } from "@douyinfe/semi-ui";
 import { STATUS } from "../../../data/constants";
 
-export default function ImportSource({ importData, setImportData, setError }) {
+export default function ImportSource({
+  importData,
+  setImportData,
+  error,
+  setError,
+}) {
   return (
     <div>
       <Upload
@@ -60,6 +65,29 @@ export default function ImportSource({ importData, setImportData, setError }) {
         >
           Overwrite existing diagram
         </Checkbox>
+        <div className="mt-2">
+          {error.type === STATUS.ERROR ? (
+            <Banner
+              type="danger"
+              fullMode={false}
+              description={<div>{error.message}</div>}
+            />
+          ) : error.type === STATUS.OK ? (
+            <Banner
+              type="info"
+              fullMode={false}
+              description={<div>{error.message}</div>}
+            />
+          ) : (
+            error.type === STATUS.WARNING && (
+              <Banner
+                type="warning"
+                fullMode={false}
+                description={<div>{error.message}</div>}
+              />
+            )
+          )}
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/EditorHeader/Modal/Modal.jsx b/src/components/EditorHeader/Modal/Modal.jsx
index 462503b..841881c 100644
--- a/src/components/EditorHeader/Modal/Modal.jsx
+++ b/src/components/EditorHeader/Modal/Modal.jsx
@@ -114,9 +114,17 @@ export default function Modal({
     try {
       ast = parser.astify(importSource.src, { database: "MySQL" });
     } catch (err) {
-      Toast.error(
-        "Could not parse the sql file. Make sure there are no syntax errors.",
-      );
+      setError({
+        type: STATUS.ERROR,
+        message:
+          err.name +
+          " [Ln " +
+          err.location.start.line +
+          ", Col " +
+          err.location.start.column +
+          "]: " +
+          err.message,
+      });
       return;
     }
 
@@ -133,6 +141,7 @@ export default function Modal({
       setTables((prev) => [...prev, ...d.tables]);
       setRelationships((prev) => [...prev, ...d.relationships]);
     }
+    setModal(MODAL.NONE);
   };
 
   const createNewDiagram = (id) => {
@@ -167,7 +176,6 @@ export default function Modal({
         return;
       case MODAL.IMPORT_SRC:
         parseSQLAndLoadDiagram();
-        setModal(MODAL.NONE);
         return;
       case MODAL.OPEN:
         if (selectedDiagramId === 0) return;
@@ -207,6 +215,7 @@ export default function Modal({
           <ImportSource
             importData={importSource}
             setImportData={setImportSource}
+            error={error}
             setError={setError}
           />
         );