From 7c7662c62fda25ef73fef75c39c0e54e47990bf3 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 12:04:57 -0400
Subject: [PATCH 01/12] Add slot to FileUploadForm, add key field

---
 src/components/FileUploadForm.vue |  6 ++++++
 src/components/TableDialog.vue    | 15 ++++++++++++++-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/components/FileUploadForm.vue b/src/components/FileUploadForm.vue
index 9c0f5a2b..5b6034c5 100644
--- a/src/components/FileUploadForm.vue
+++ b/src/components/FileUploadForm.vue
@@ -46,6 +46,7 @@
           />
         </v-flex>
       </v-layout>
+      <slot :uploadParams="uploadParams"/>
     </v-card-text>
 
     <v-divider></v-divider>
@@ -62,6 +63,7 @@
 <script lang="ts">
 import { UploadType, validUploadType } from 'multinet';
 import Vue, { PropType } from 'vue';
+import { AxiosRequestConfig } from 'axios';
 
 import api from '@/api';
 import { FileType } from '@/types';
@@ -108,6 +110,7 @@ export default Vue.extend({
       fileName: null as string | null,
       selectedType: null as FileType | null,
       file: null as File | null,
+      uploadParams: {} as AxiosRequestConfig,
     };
   },
 
@@ -150,6 +153,7 @@ export default Vue.extend({
         workspace,
         fileName,
         selectedType,
+        uploadParams,
       } = this;
 
       if (file === null || fileName === null) {
@@ -160,6 +164,8 @@ export default Vue.extend({
         await api.uploadTable(workspace, fileName, {
           type: selectedType!.queryCall as UploadType,
           data: file,
+        }, {
+          params: uploadParams,
         });
 
         this.tableCreationError = null;
diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index e4e35bdf..78f8abde 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -27,7 +27,20 @@
         :types="types"
         :workspace="workspace"
         @success="uploadSuccess"
-      />
+      >
+        <template v-slot:default="{ uploadParams }">
+          <v-row no-gutters>
+            <v-col cols="4">
+              <v-text-field
+                v-model="uploadParams.key"
+                dense
+                label="Key"
+                outlined
+              />
+            </v-col>
+          </v-row>
+        </template>
+      </file-upload-form>
     </v-card>
   </v-dialog>
 </template>

From 7f708436733c18b6caee92bbe3ffc577d62627e6 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 13:09:30 -0400
Subject: [PATCH 02/12] Add switch for overwriting _key field

---
 src/components/TableDialog.vue | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index 78f8abde..60b08cee 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -36,6 +36,16 @@
                 dense
                 label="Key"
                 outlined
+                hide-details
+              />
+            </v-col>
+            <v-col cols="8">
+              <v-switch
+                v-model="uploadParams.overwrite"
+                class="mt-1 ml-2"
+                dense
+                label="Overwrite _key field"
+                outlined
               />
             </v-col>
           </v-row>

From cfa77122f731c3f24553c4cedfa5234b3972724d Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 14:54:56 -0400
Subject: [PATCH 03/12] Add file utils

---
 src/utils/files.ts | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
 create mode 100644 src/utils/files.ts

diff --git a/src/utils/files.ts b/src/utils/files.ts
new file mode 100644
index 00000000..6864cc8b
--- /dev/null
+++ b/src/utils/files.ts
@@ -0,0 +1,16 @@
+import { validUploadType } from 'multinet';
+import { FileType } from '@/types';
+
+
+const fileExtension = (file: File) => file.name.split('.').slice(-1)[0];
+const fileName = (file: File) => file.name.split('.')[0];
+
+function validFileType(file: File, allowedTypes: FileType[]) {
+  const extension = fileExtension(file);
+  return allowedTypes.some((type) => type.extension.includes(extension) && validUploadType(type.queryCall));
+}
+
+export {
+  fileName,
+  validFileType,
+};

From 0b04e7626004529881e9bac620e1808dec00c1ef Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 14:55:28 -0400
Subject: [PATCH 04/12] Remove added slot to FileUploadForm

---
 src/components/FileUploadForm.vue | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/src/components/FileUploadForm.vue b/src/components/FileUploadForm.vue
index 5b6034c5..d0473ad0 100644
--- a/src/components/FileUploadForm.vue
+++ b/src/components/FileUploadForm.vue
@@ -46,7 +46,6 @@
           />
         </v-flex>
       </v-layout>
-      <slot :uploadParams="uploadParams"/>
     </v-card-text>
 
     <v-divider></v-divider>
@@ -110,7 +109,6 @@ export default Vue.extend({
       fileName: null as string | null,
       selectedType: null as FileType | null,
       file: null as File | null,
-      uploadParams: {} as AxiosRequestConfig,
     };
   },
 
@@ -153,7 +151,6 @@ export default Vue.extend({
         workspace,
         fileName,
         selectedType,
-        uploadParams,
       } = this;
 
       if (file === null || fileName === null) {
@@ -164,8 +161,6 @@ export default Vue.extend({
         await api.uploadTable(workspace, fileName, {
           type: selectedType!.queryCall as UploadType,
           data: file,
-        }, {
-          params: uploadParams,
         });
 
         this.tableCreationError = null;

From 7c06aa1abcf37b7d3ba9c30711a692f1e42807f2 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 15:12:09 -0400
Subject: [PATCH 05/12] Remove use of FileUploadForm in TableDialog

---
 src/components/TableDialog.vue | 115 ++++++++++++++++++++++++++++-----
 1 file changed, 98 insertions(+), 17 deletions(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index 60b08cee..fc728d27 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -23,34 +23,65 @@
       >
         Create Table
       </v-card-title>
-      <file-upload-form
-        :types="types"
-        :workspace="workspace"
-        @success="uploadSuccess"
-      >
-        <template v-slot:default="{ uploadParams }">
+      <v-card>
+        <v-card-text class="px-4 pt-4 pb-1">
+          <v-layout wrap>
+            <v-flex>
+              <v-file-input
+                @change="handleFileInput"
+                :error-messages="fileUploadError"
+                label="Upload File"
+                prepend-inner-icon="attach_file"
+                prepend-icon=""
+                single-line
+                clearable
+                dense
+                outlined
+              />
+            </v-flex>
+          </v-layout>
+          <v-layout wrap>
+            <v-flex>
+              <v-text-field
+                v-model="fileName"
+                :error-messages="tableCreationError"
+                label="Table Name"
+                outlined
+                dense
+              />
+            </v-flex>
+          </v-layout>
           <v-row no-gutters>
             <v-col cols="4">
               <v-text-field
-                v-model="uploadParams.key"
-                dense
+                v-model="key"
                 label="Key"
-                outlined
                 hide-details
+                outlined
+                dense
               />
             </v-col>
-            <v-col cols="8">
+            <v-col cols="4">
               <v-switch
-                v-model="uploadParams.overwrite"
+                v-model="overwrite"
                 class="mt-1 ml-2"
                 dense
-                label="Overwrite _key field"
+                label="Overwrite Default Key"
                 outlined
               />
             </v-col>
           </v-row>
-        </template>
-      </file-upload-form>
+        </v-card-text>
+
+        <v-divider></v-divider>
+
+        <v-card-actions class="px-4 py-3">
+          <v-spacer></v-spacer>
+          <v-btn :disabled="createDisabled" @click="createTable">
+            Create
+          </v-btn>
+        </v-card-actions>
+      </v-card>
     </v-card>
   </v-dialog>
 </template>
@@ -60,6 +91,7 @@ import Vue from 'vue';
 
 import api from '@/api';
 import { FileType } from '@/types';
+import { validFileType, fileName as getFileName } from '@/utils/files';
 import FileUploadForm from '@/components/FileUploadForm.vue';
 
 
@@ -83,12 +115,61 @@ export default Vue.extend({
           displayName: 'CSV',
         },
       ] as FileType[],
+      file: null as File | null,
+      fileName: null as string | null,
+      fileUploadError: null as string | null,
+      tableCreationError: null as string | null,
+      key: undefined as string | undefined,
+      overwrite: false,
     };
   },
+  computed: {
+    createDisabled(): boolean {
+      return (
+        !this.file ||
+        !this.fileName ||
+        !!this.fileUploadError
+      );
+    },
+  },
   methods: {
-    uploadSuccess() {
-      this.tableDialog = false;
-      this.$emit('success');
+    handleFileInput(file: File) {
+      this.file = file;
+
+      if (!file) {
+        this.fileUploadError = null;
+      } else if (!validFileType(file, this.types)) {
+        this.fileUploadError = 'Invalid file type';
+      } else {
+        this.fileName = this.fileName || getFileName(file);
+        this.fileUploadError = null;
+      }
+    },
+    async createTable() {
+      const {
+        file,
+        workspace,
+        fileName,
+        key,
+        overwrite,
+      } = this;
+
+      if (file === null || fileName === null) {
+        return;
+      }
+
+      try {
+        await api.uploadTable(workspace, fileName, {
+          type: 'csv',
+          data: file,
+        }, key, overwrite);
+
+        this.tableCreationError = null;
+        this.tableDialog = false;
+        this.$emit('success');
+      } catch (err) {
+        this.tableCreationError = err.statusText;
+      }
     },
   },
 });

From ab252e39ea1064abe75857363fe6ab4a5fc20253 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 15:16:50 -0400
Subject: [PATCH 06/12] Remove unused import

---
 src/components/FileUploadForm.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/FileUploadForm.vue b/src/components/FileUploadForm.vue
index d0473ad0..9c0f5a2b 100644
--- a/src/components/FileUploadForm.vue
+++ b/src/components/FileUploadForm.vue
@@ -62,7 +62,6 @@
 <script lang="ts">
 import { UploadType, validUploadType } from 'multinet';
 import Vue, { PropType } from 'vue';
-import { AxiosRequestConfig } from 'axios';
 
 import api from '@/api';
 import { FileType } from '@/types';

From 649646e569ca4512e779896c8a66cf9534622fb0 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Thu, 26 Mar 2020 20:10:54 -0400
Subject: [PATCH 07/12] Remove unused import

---
 src/components/TableDialog.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index fc728d27..a4223188 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -92,7 +92,6 @@ import Vue from 'vue';
 import api from '@/api';
 import { FileType } from '@/types';
 import { validFileType, fileName as getFileName } from '@/utils/files';
-import FileUploadForm from '@/components/FileUploadForm.vue';
 
 
 export default Vue.extend({
@@ -101,9 +100,6 @@ export default Vue.extend({
   props: {
     workspace: String,
   },
-  components: {
-    FileUploadForm,
-  },
   data() {
     return {
       tableDialog: false,

From 077c20cceeb908adbb12c0bfb1aa2aa628b215b4 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Fri, 27 Mar 2020 12:05:59 -0400
Subject: [PATCH 08/12] Upload call to `uploadTable` to match multinetjs

---
 src/components/TableDialog.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index a4223188..c3dda7be 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -158,7 +158,9 @@ export default Vue.extend({
         await api.uploadTable(workspace, fileName, {
           type: 'csv',
           data: file,
-        }, key, overwrite);
+          key,
+          overwrite,
+        });
 
         this.tableCreationError = null;
         this.tableDialog = false;

From f6cc4491f6ed881f8d7a41dc9e7f552bd9cce3d1 Mon Sep 17 00:00:00 2001
From: Roni Choudhury <roni.choudhury@kitware.com>
Date: Fri, 27 Mar 2020 13:46:59 -0400
Subject: [PATCH 09/12] Upgrade multinet to 0.12.0

---
 package.json | 2 +-
 yarn.lock    | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index 40b9d83c..ab8da818 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
     "axios": "^0.18.1",
     "core-js": "^2.6.5",
     "material-design-icons-iconfont": "^5.0.1",
-    "multinet": "0.10.0",
+    "multinet": "0.12.0",
     "vue": "^2.6.10",
     "vue-gtag": "^1.2.1",
     "vue-router": "^3.0.2",
diff --git a/yarn.lock b/yarn.lock
index 0ab794af..68621254 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5502,10 +5502,10 @@ multimatch@^2.1.0:
     arrify "^1.0.0"
     minimatch "^3.0.0"
 
-multinet@0.10.0:
-  version "0.10.0"
-  resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.10.0.tgz#92470b0b1020632ec4effe538f9e7c584a719f29"
-  integrity sha512-GAPUCVqHoG9RBqbx5F2vI3Mp15gLeYuOrkGvZC/Rl1DUe7vuNxiVEKXzoa9N59F0vYVR/eoDAtp+UPjTOtnsLw==
+multinet@0.12.0:
+  version "0.12.0"
+  resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.12.0.tgz#44c4c47272a609373edabf384c637f1d5641ae39"
+  integrity sha512-dkufPqpnRX6KNYPdxtE3cOKXtmyIQiZS1kCH6NjeALrP/a5+/eptEunN45cGL7huCIV8PLeLxkmkpLS6nr1M+A==
   dependencies:
     axios "^0.19.0"
 

From 05a55833c1c8df9581e2d15dfc1b41cc7a1cb6a0 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Fri, 27 Mar 2020 16:01:57 -0400
Subject: [PATCH 10/12] switch -> checkbox, set default key value

---
 src/components/TableDialog.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index c3dda7be..76f2bd9c 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -62,7 +62,7 @@
               />
             </v-col>
             <v-col cols="4">
-              <v-switch
+              <v-checkbox
                 v-model="overwrite"
                 class="mt-1 ml-2"
                 dense
@@ -115,7 +115,7 @@ export default Vue.extend({
       fileName: null as string | null,
       fileUploadError: null as string | null,
       tableCreationError: null as string | null,
-      key: undefined as string | undefined,
+      key: '_key',
       overwrite: false,
     };
   },

From 07f663afc2e69f60877551fed4bbf787cce6cd01 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Fri, 27 Mar 2020 16:28:16 -0400
Subject: [PATCH 11/12] Add restore button in key field specifier

---
 src/components/TableDialog.vue | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index 76f2bd9c..d96d5f81 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -56,7 +56,8 @@
               <v-text-field
                 v-model="key"
                 label="Key"
-                hide-details
+                append-icon="restore"
+                @click:append="restoreKeyField"
                 outlined
                 dense
               />
@@ -93,7 +94,7 @@ import api from '@/api';
 import { FileType } from '@/types';
 import { validFileType, fileName as getFileName } from '@/utils/files';
 
-
+const defaultKeyField = '_key';
 export default Vue.extend({
   name: 'TableDialog',
 
@@ -115,7 +116,7 @@ export default Vue.extend({
       fileName: null as string | null,
       fileUploadError: null as string | null,
       tableCreationError: null as string | null,
-      key: '_key',
+      key: defaultKeyField,
       overwrite: false,
     };
   },
@@ -129,6 +130,9 @@ export default Vue.extend({
     },
   },
   methods: {
+    restoreKeyField() {
+      this.key = defaultKeyField;
+    },
     handleFileInput(file: File) {
       this.file = file;
 

From 42ccfa6ac7037206d87b3ec7cdc4c76be55e9e40 Mon Sep 17 00:00:00 2001
From: Jacob Nesbitt <jjnesbitt2@gmail.com>
Date: Sat, 28 Mar 2020 17:51:41 -0400
Subject: [PATCH 12/12] Change label from "Key" to "Key Column"

---
 src/components/TableDialog.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/TableDialog.vue b/src/components/TableDialog.vue
index d96d5f81..519a17dd 100644
--- a/src/components/TableDialog.vue
+++ b/src/components/TableDialog.vue
@@ -55,7 +55,7 @@
             <v-col cols="4">
               <v-text-field
                 v-model="key"
-                label="Key"
+                label="Key Column"
                 append-icon="restore"
                 @click:append="restoreKeyField"
                 outlined