move tests to tests folder

rename util modules
rename DbUpload to DbUploader
add tests for DbUploader component #27

src/components/CheckBox.vue

@@ -20,7 +20,7 @@
 
 <script>
 export default {
-  name: 'checkBox',
+  name: 'CheckBox',
   props: {
     theme: {
       type: String,

src/components/DbUploader.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="db-upload-container">
+  <div class="db-uploader-container">
     <change-db-icon v-if="type === 'small'" @click.native="browse"/>
     <div v-if="['regular', 'illustrated'].includes(type)" class="drop-area-container">
       <div
@@ -62,6 +62,7 @@
             width="93px"
             :disabled="disableDialog"
             class="char-input"
+            id="quote-char"
           />
           <text-field
             label="Escape char"
@@ -71,6 +72,7 @@
             width="93px"
             :disabled="disableDialog"
             class="char-input"
+            id="escape-char"
           />
         </div>
         <check-box
@@ -122,7 +124,7 @@
 </template>
 
 <script>
-import fu from '@/fileUtils'
+import fu from '@/file.utils'
 import csv from '@/csv'
 import CloseIcon from '@/components/svg/close'
 import TextField from '@/components/TextField'
@@ -135,7 +137,7 @@ import time from '@/time'
 import database from '@/database'
 
 export default {
-  name: 'DbUpload',
+  name: 'DbUploader',
   props: {
     type: {
       type: String,
@@ -164,7 +166,7 @@ export default {
       delimiter: '',
       quoteChar: '"',
       escapeChar: '"',
-      header: false,
+      header: true,
       previewData: null,
       importCsvMessages: [],
       disableDialog: false,
@@ -237,9 +239,9 @@ export default {
         this.delimiter = parseResult.delimiter
 
         // In parseResult.messages we can get parse errors
-        this.importCsvMessages = parseResult.messages
+        this.importCsvMessages = parseResult.messages || []
 
-        if (parseResult.messages.length === 0) {
+        if (!parseResult.hasErrors) {
           this.importCsvMessages.push({
             message: `Preview parsing is completed in ${time.getPeriod(start, end)}.`,
             type: 'success'
@@ -390,7 +392,7 @@ export default {
 </script>
 
 <style scoped>
-.db-upload-container {
+.db-uploader-container {
   position: relative;
 }
 .drop-area-container {

src/components/Logs.vue

@@ -35,7 +35,11 @@ export default {
     serializeMessage (msg) {
       let result = ''
       if (msg.row !== null && msg.row !== undefined) {
-        result += `Error in row ${msg.row}. `
+        if (msg.type === 'error') {
+          result += `Error in row ${msg.row}. `
+        } else {
+          result += `Information about row ${msg.row}. `
+        }
       }
 
       result += msg.message

src/components/Schema.vue

@@ -8,7 +8,7 @@
         <tree-chevron :expanded="schemaVisible"/>
         {{ dbName }}
       </div>
-        <db-upload id="db-edit" type="small" />
+        <db-uploader id="db-edit" type="small" />
     </div>
     <div v-show="schemaVisible" class="schema">
       <table-description
@@ -25,7 +25,7 @@
 import TableDescription from '@/components/TableDescription'
 import TextField from '@/components/TextField'
 import TreeChevron from '@/components/svg/treeChevron'
-import dbUpload from '@/components/DbUpload'
+import DbUploader from '@/components/DbUploader'
 
 export default {
   name: 'Schema',
@@ -33,7 +33,7 @@ export default {
     TableDescription,
     TextField,
     TreeChevron,
-    dbUpload
+    DbUploader
   },
   data () {
     return {

src/database.js

@@ -1,5 +1,5 @@
 import sqliteParser from 'sqlite-parser'
-import fu from '@/fileUtils'
+import fu from '@/file.utils'
 // We can import workers like so because of worker-loader:
 // https://webpack.js.org/loaders/worker-loader/
 import Worker from '@/db.worker.js'

src/sql.js

@@ -1,5 +1,5 @@
 import initSqlJs from 'sql.js/dist/sql-wasm.js'
-import dbUtils from '@/dbUtils'
+import dbUtils from '@/db.utils'
 
 let SQL = null
 const sqlModuleReady = initSqlJs().then(sqlModule => { SQL = sqlModule })

src/storedQueries.js

@@ -1,5 +1,5 @@
 import { nanoid } from 'nanoid'
-import fu from '@/fileUtils'
+import fu from '@/file.utils'
 
 export default {
   getStoredQueries () {

src/views/Editor.vue

@@ -11,7 +11,7 @@
           <div class="warning">
             Database is not loaded. Queries can’t be run without database.
           </div>
-          <db-upload id="db-uploader"/>
+          <db-uploader id="db-uploader"/>
         </div>
       </template>
       <template #right-pane>
@@ -25,7 +25,7 @@
 import Splitpanes from '@/components/Splitpanes'
 import Schema from '@/components/Schema'
 import Tabs from '@/components/Tabs'
-import dbUpload from '@/components/DbUpload'
+import DbUploader from '@/components/DbUploader'
 
 export default {
   name: 'Editor',
@@ -33,7 +33,7 @@ export default {
     Schema,
     Splitpanes,
     Tabs,
-    dbUpload
+    DbUploader
   }
 }
 </script>
@@ -64,7 +64,7 @@ export default {
   box-sizing: border-box;
 }
 
->>> .db-upload-container {
+>>> .db-uploader-container {
   width: 100%;
 }
 

src/views/Home.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="dbloader-container">
-    <db-upload type="illustrated" />
+    <db-uploader type="illustrated" />
     <div id="note">
       Sqliteviz is fully client-side. Your database never leaves your computer.
     </div>
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import dbUpload from '@/components/DbUpload'
+import DbUploader from '@/components/DbUploader'
 
 export default {
   name: 'Home',
-  components: { dbUpload }
+  components: { DbUploader }
 }
 </script>
 

src/views/MyQueries.vue

@@ -147,7 +147,7 @@ import TextField from '@/components/TextField'
 import CheckBox from '@/components/CheckBox'
 import tooltipMixin from '@/mixins/tooltips'
 import storedQueries from '@/storedQueries'
-import fu from '@/fileUtils'
+import fu from '@/file.utils'
 
 export default {
   name: 'MyQueries',