Data import feature (#212)

* Fix grammar generation * Publish next branch as dev build (#151) * Update Dockerfile to install libatomic1 * Implemented query progress (#152) * Implemented query progress * Run linters * Fix grammar generation * Publish next branch as dev build (#151) * Update Dockerfile to install libatomic1 * Implemented query progress * Run linters * Publish next branch as dev build (#151) * Implemented query progress * Run linters * Implemented feedback --------- Co-authored-by: Lint Bot <[email protected]> Co-authored-by: Chang Liu <[email protected]> * Update kuzu * Fix deduplication issue (#172) * Update kuzu * Data import UI (#174) * X * Update kuzu * Update kuzu * Update grammar * X * X * X * X * X * X * X * X * X * X * X * Add dialog when files are initially selected * X * X * Improve parquet format detection * X * X * X * Minor fix * Fix custom CSV format issues for previewing and type detection (#175) * X * X * X * X * X * X * Additional import ui fixes I (#176) * Refactor ImporterViewFileProcessingModal with ImporterViewProcessingModal * Fix column ignore functionality * Additional validation rules for import ui (#177) * Fix preview header display * X * Address column name change for from and to keys * X * X * X * X * X * Refactor ImporterViewValidationModal component for error display * Refactor planning to use DDL module * Import UI fix (#178) * Handle simple import cases independently * Refactor ImporterViewValidationModal and ImporterViewProcessingModal components * Improve uploading efficiency with multer dependency (#179) * Improve uploading efficiency with multer dependency * X * Lint * X * X * Fix several issues in planning * Lint * Additional fixes (#180) * Fix table name handling with special chars * Delete temporary files in Import.js router * X * Refactor * X * Lint * Import UI fix (#181) * Improve wording * Improve UI consistency * Update kuzu * Update grammar * Update server API routes for read-only mode * Bump kuzu to 0.5.0 * Address #183 (#194) * Fix rel validation (#195) * Enable src and dst key validation for existing rel tables * Add file remove confirmation hack * Address 188 (#196) * Address #188 * Improve error message * Improve style for very long table name (#199) * Make column name case insensitive (#200) * Add in-memory mode support * Update kuzu * Update submodule * Address comments in #201 (#206) * Fix #203 * Fix #202 * Fix #209 (#211) * Handle #210 * Update grammar --------- Co-authored-by: Mattias <[email protected]> Co-authored-by: Lint Bot <[email protected]>
kuzudb · Aug 19, 2024 · fd663e6 · fd663e6
1 parent e24e6ff
commit fd663e6
Show file tree

Hide file tree

Showing 24 changed files with 4,536 additions and 100 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -17,18 +17,21 @@
   },
   "dependencies": {
     "@antv/g6": "^4.8.24",
+    "@duckdb/duckdb-wasm": "1.28.1-dev218.0",
     "@popperjs/core": "^2.11.8",
     "antlr4-c3": "3.2.3",
     "antlr4ng": "1.0.7",
     "axios": "^1.4.0",
     "bootstrap": "^5.3.1",
     "core-js": "^3.8.3",
     "cors": "^2.8.5",
+    "dropzone": "^6.0.0-beta.2",
     "express": "^4.18.2",
     "kuzu": "0.6.0",
     "moment": "^2.29.4",
     "monaco-editor": "^0.41.0",
     "monaco-themes": "^0.4.4",
+    "multer": "^1.4.5-lts.1",
     "openai": "^4.20.1",
     "pinia": "^2.0.23",
     "pino": "^8.16.1",
@@ -46,6 +49,7 @@
     "@vue/cli-plugin-typescript": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
     "antlr4ng-cli": "^1.0.0",
+    "copy-webpack-plugin": "^12.0.2",
     "eslint": "^8.55.0",
     "eslint-plugin-vue": "^9.19.2",
     "monaco-editor-webpack-plugin": "^7.1.0",

diff --git a/src/App.vue b/src/App.vue
@@ -14,6 +14,7 @@ export default {
   mounted() {
     this.tooltip = new Tooltip(document.body, {
       selector: "[data-bs-toggle='tooltip']",
+      trigger: "hover",
     });
   },
   beforeUnmount() {

diff --git a/src/components/DatasetView/DatasetMainView.vue b/src/components/DatasetView/DatasetMainView.vue
@@ -4,64 +4,78 @@
     ref="wrapper"
     class="dataset-view__wrapper"
   >
-    <div
-      v-if="!isSchemaEmpty && isProduction && !datasetLoadingLog && modeStore.isReadWrite"
-      class="alert alert-warning"
-      role="alert"
-    >
-      <i class="fa-solid fa-info-circle" />
-      You have already loaded a database. You can still review the schema of the bundled
-      datasets. If you want to load a different dataset, please restart your Kùzu Explorer
-      Docker image with an empty database or drop all tables in the current database.
-    </div>
+    <div class="alert-and-button-wrapper">
+      <button
+        class="btn btn-lg btn-secondary"
+        title="Back"
+        @click="$emit('back')"
+      >
+        <i class="fa-solid  fa-arrow-left" />
+        &nbsp;
+        Back
+      </button>
 
-    <div
-      v-if="isSchemaEmpty && isProduction && !datasetLoadingLog && modeStore.isReadWrite"
-      class="alert alert-info"
-      role="alert"
-    >
-      <i class="fa-solid fa-info-circle" />
-      The schema of the current database is empty. You can load a dataset into the
-      database.
-    </div>
+      <div
+        v-if=" !isSchemaEmpty && isProduction && !datasetLoadingLog && modeStore.isReadWrite"
+        class="alert alert-warning"
+        role="alert"
+      >
+        <i class="fa-solid fa-info-circle" />
+        You have already loaded a database. You can still review the schema of the bundled
+        datasets. If you want to load a different dataset, please restart your Kùzu Explorer
+        Docker image with an empty database or drop all tables in the current database.
+      </div>
 
-    <div
-      v-if="!isProduction && modeStore.isReadWrite"
-      class="alert alert-warning"
-      role="alert"
-    >
-      <i class="fa-solid fa-info-circle" />
-      You are running Kùzu Explorer in development mode. You can load any dataset into the
-      database. However, please make sure there is no conflict with the existing schema.
-    </div>
+      <div
+        v-if="isSchemaEmpty && isProduction && !datasetLoadingLog && modeStore.isReadWrite"
+        class="alert alert-info"
+        role="alert"
+      >
+        <i class="fa-solid fa-info-circle" />
+        The schema of the current database is empty. You can load a dataset into the
+        database.
+      </div>
 
-    <div
-      v-if="modeStore.isReadOnly"
-      class="alert alert-warning"
-      role="alert"
-    >
-      <i class="fa-solid fa-info-circle" />
-      Kùzu Explorer is running in read-only mode. You can still review the schema of the
-      bundled datasets. If you want to load a dataset, please restart your Kùzu Explorer
-      Docker image in read-write mode with an empty database.
-    </div>
+      <div
+        v-if="!isProduction && modeStore.isReadWrite"
+        class="alert alert-warning"
+        role="alert"
+      >
+        <i class="fa-solid fa-info-circle" />
+        You are running Kùzu Explorer in development mode. You can load any dataset into the
+        database. However, please make sure there is no conflict with the existing schema.
+      </div>
 
-    <div
-      v-if="modeStore.isDemo"
-      class="alert alert-warning"
-      role="alert"
-    >
-      <i class="fa-solid fa-info-circle" />
-      Kùzu Explorer is running in demo mode. You can still review the schema of the bundled
-      datasets. Loading a dataset is not possible in this demo. However, you can load a
-      bundled dataset or use your own dataset if you run Kùzu Explorer locally. Please
-      refer to
-      <a
-        target="_blank"
-        href="https://docs.kuzudb.com"
+      <div
+        v-if="modeStore.isReadOnly"
+        class="alert alert-warning"
+        role="alert"
+      >
+        <i class="fa-solid fa-info-circle" />
+        Kùzu Explorer is running in read-only mode. You can still review the schema of the
+        bundled datasets. If you want to load a dataset, please restart your Kùzu Explorer
+        Docker image in read-write mode with an empty database.
+      </div>
+
+      <div
+        v-if="modeStore.isDemo"
+        class="alert alert-warning"
+        role="alert"
       >
-        the documentation </a>for more information.
+        <i class="fa-solid fa-info-circle" />
+        Kùzu Explorer is running in demo mode. You can still review the schema of the bundled
+        datasets. Loading a dataset is not possible in this demo. However, you can load a
+        bundled dataset or use your own dataset if you run Kùzu Explorer locally. Please
+        refer to
+        <a
+          target="_blank"
+          href="https://docs.kuzudb.com"
+        >
+          the documentation </a>for more information.
+      </div>
     </div>
+
+
     <div
       v-if="!datasetLoadingLog"
       class="form-group"
@@ -130,7 +144,7 @@ export default {
       default: null,
     },
   },
-  emits: ["reloadSchema"],
+  emits: ["reloadSchema", "back"],
   data: () => ({
     selectedDataset: null,
     selectedDatasetSchema: null,
@@ -242,5 +256,19 @@ export default {
     background-color: $gray-100;
     font-size: 16px;
   }
+
+  .alert-and-button-wrapper {
+    display: flex;
+    flex-direction: row;
+    gap: 10px;
+    align-items: center;
+
+    div {
+      flex: 1;
+      margin-bottom: 0;
+    }
+
+    margin-bottom: 16px;
+  }
 }
 </style>