WiP on #57

fda-ui/pages/db/_db_id/tables/table_from_csv.vue

 <template>
-  <v-stepper v-model="step" vertical>
-    <v-stepper-step :complete="step > 1" step="1">
-      Upload CSV file
-    </v-stepper-step>
+  <div>
+    <h3 class="mb-2 mt-1">Table from CSV</h3>
+    <v-stepper v-model="step" vertical>
+      <v-stepper-step :complete="step > 1" step="1">
+        Table
+      </v-stepper-step>
 
-    <v-stepper-content step="1">
-      <v-row dense>
-        <v-col cols="8">
-          <v-file-input
-            v-model="file"
-            accept="text/csv"
-            show-size
-            label="CSV File" />
-        </v-col>
-        <v-col cols="4" class="mt-3">
-          <v-btn :disabled="!file" :loading="loading" @click="upload">Upload</v-btn>
-        </v-col>
-      </v-row>
-    </v-stepper-content>
+      <v-stepper-content class="pt-0 pb-1" step="1">
+        <v-text-field v-model="tableName" required label="Name" />
+        <v-text-field v-model="tableDesc" label="Description" />
+        <v-btn color="primary" @click="step = 2">
+          Continue
+        </v-btn>
+      </v-stepper-content>
 
-    <v-stepper-step :complete="step > 2" step="2">
-      Choose data type of columns
-    </v-stepper-step>
-    <v-stepper-content step="2">
-      <div v-for="(c, idx) in columns" :key="idx">
-        <v-row dense class="column pa-2 ml-1 mr-1">
-          <v-col cols="4">
-            <v-text-field v-model="c.name" required label="Name" />
-          </v-col>
-          <v-col cols="3">
-            <v-select
-              v-model="c.type"
-              :items="columnTypes"
-              item-value="value"
-              required
-              label="Data Type" />
-          </v-col>
-          <v-col cols="auto" class="pl-2">
-            <v-checkbox v-model="c.primaryKey" label="Primary Key" />
+      <v-stepper-step :complete="step > 2" step="2">
+        Upload CSV file
+      </v-stepper-step>
+
+      <v-stepper-content step="2">
+        <v-row dense>
+          <v-col cols="8">
+            <v-file-input
+              v-model="file"
+              accept="text/csv"
+              show-size
+              label="CSV File" />
           </v-col>
-          <v-col cols="auto" class="pl-10">
-            <v-checkbox v-model="c.nullAllowed" label="Null Allowed" />
+          <v-col cols="4" class="mt-3">
+            <v-btn :disabled="!file" :loading="loading" @click="upload">Upload</v-btn>
           </v-col>
         </v-row>
-      </div>
+      </v-stepper-content>
+
+      <v-stepper-step :complete="step > 3" step="3">
+        Choose data type of columns
+      </v-stepper-step>
+      <v-stepper-content step="3">
+        <div v-for="(c, idx) in columns" :key="idx">
+          <v-row dense class="column pa-2 ml-1 mr-1">
+            <v-col cols="4">
+              <v-text-field v-model="c.name" required label="Name" />
+            </v-col>
+            <v-col cols="3">
+              <v-select
+                v-model="c.type"
+                :items="columnTypes"
+                item-value="value"
+                required
+                label="Data Type" />
+            </v-col>
+            <v-col cols="auto" class="pl-2">
+              <v-checkbox v-model="c.primaryKey" label="Primary Key" />
+            </v-col>
+            <v-col cols="auto" class="pl-10">
+              <v-checkbox v-model="c.nullAllowed" label="Null Allowed" />
+            </v-col>
+          </v-row>
+        </div>
 
-      <v-btn color="primary" @click="step = 3">
-        Continue
-      </v-btn>
-    </v-stepper-content>
+        <v-btn color="primary" @click="step = 4">
+          Continue
+        </v-btn>
+      </v-stepper-content>
 
-    <v-stepper-step
-      :complete="step > 3"
-      step="3">
-      Done
-    </v-stepper-step>
+      <v-stepper-step
+        :complete="step > 4"
+        step="4">
+        Done
+      </v-stepper-step>
 
-    <v-stepper-content step="3">
-      Done. Go to table.
-    </v-stepper-content>
-  </v-stepper>
+      <v-stepper-content step="4">
+        Done. Go to table.
+      </v-stepper-content>
+    </v-stepper>
+  </div>
 </template>
 <script>
 export default {
@@ -69,6 +84,8 @@ export default {
   data () {
     return {
       step: 1,
+      tableName: '',
+      tableDesc: '',
       loading: false,
       file: null,
       columns: [],
@@ -97,7 +114,7 @@ export default {
         })
         if (res.data.success) {
           this.columns = res.data.columns
-          this.step = 2
+          this.step = 3
         } else {
           this.$toast.error('Could not upload CSV data')
         }

fda-ui/server-middleware/index.js

@@ -24,7 +24,7 @@ app.post('/table_from_csv', upload.single('file'), async (req, res) => {
     analysis = await fetch(`${process.env.API_ANALYSE}/datatypesbypath?filepath=${path}`)
     analysis = await analysis.json()
   } catch (error) {
-    res.json({ success: false, error })
+    return res.json({ success: false, error })
   }
 
   // map messytables / CoMi's `determine_dt` column types to ours