[
  {
    "path": ".editorconfig",
    "content": "root = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size = 2\nend_of_line = lf\ninsert_final_newline = true\ntrim_trailing_whitespace = true\n"
  },
  {
    "path": ".github/ISSUE_TEMPLATE/bug_report.md",
    "content": "---\nname: Bug report\nabout: Create a report to help us improve\ntitle: ''\nlabels: ''\nassignees: ''\n\n---\n\n**Describe the bug**\nA clear and concise description of what the bug is.\n\n**To Reproduce**\nSteps to reproduce the behavior:\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'\n4. See error\n\n**Expected behavior**\nA clear and concise description of what you expected to happen.\n\n**Screenshots**\nIf applicable, add screenshots to help explain your problem.\n\n**Desktop (please complete the following information):**\n - OS: [e.g. iOS]\n - Browser [e.g. chrome, safari]\n - Version [e.g. 22]\n\n**Smartphone (please complete the following information):**\n - Device: [e.g. iPhone6]\n - OS: [e.g. iOS8.1]\n - Browser [e.g. stock browser, safari]\n - Version [e.g. 22]\n\n**Additional context**\nAdd any other context about the problem here.\n"
  },
  {
    "path": ".github/ISSUE_TEMPLATE/feature_request.md",
    "content": "---\nname: Feature request\nabout: Suggest an idea for this project\ntitle: ''\nlabels: ''\nassignees: ''\n\n---\n\n**Is your feature request related to a problem? Please describe.**\nA clear and concise description of what the problem is. Ex. I'm always frustrated when [...]\n\n**Describe the solution you'd like**\nA clear and concise description of what you want to happen.\n\n**Describe alternatives you've considered**\nA clear and concise description of any alternative solutions or features you've considered.\n\n**Additional context**\nAdd any other context or screenshots about the feature request here.\n"
  },
  {
    "path": ".gitignore",
    "content": ".DS_Store\n.thumbs.db\nnode_modules\n\n# Quasar core related directories\n.quasar\n/dist\n\n# Cordova related directories and files\n/src-cordova/node_modules\n/src-cordova/platforms\n/src-cordova/plugins\n/src-cordova/www\n\n# Capacitor related directories and files\n/src-capacitor/www\n/src-capacitor/node_modules\n\n# Log files\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# Editor directories and files\n.idea\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n"
  },
  {
    "path": ".npmrc",
    "content": "# pnpm-related options\nshamefully-hoist=true\nstrict-peer-dependencies=false\n"
  },
  {
    "path": ".vscode/extensions.json",
    "content": "{\n  \"recommendations\": [\n    \"editorconfig.editorconfig\",\n    \"vue.volar\",\n    \"wayou.vscode-todo-highlight\"\n  ],\n  \"unwantedRecommendations\": [\n    \"octref.vetur\",\n    \"hookyqr.beautify\",\n    \"dbaeumer.jshint\",\n    \"ms-vscode.vscode-typescript-tslint-plugin\"\n  ]\n}"
  },
  {
    "path": ".vscode/settings.json",
    "content": "{\n  \"editor.bracketPairColorization.enabled\": true,\n  \"editor.guides.bracketPairs\": true\n}"
  },
  {
    "path": "Dockerfile",
    "content": "# Use Node.js Alpine image as base\nFROM node:alpine\n\n# Set working directory in the container\nWORKDIR /usr/src/app\n\n# Copy package.json and package-lock.json to the working directory\nCOPY package*.json ./\n\n# Install project dependencies\nRUN npm install\n\nRUN npm install -g @quasar/cli\n\n# Copy the rest of the application files to the working directory\nCOPY . .\n\n# Expose port 8080 to the outside world\nEXPOSE 9000\n\n# Default command to start Quasar development server\nCMD [\"quasar\", \"dev\"]\n"
  },
  {
    "path": "LICENSE.md",
    "content": "MIT License\n\nCopyright (c) 2024 incentius-foss\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "<p align=\"center\">\n  <img src=\"/public/logo3.svg\" alt=\"Image Description\" height=\"120px\" width=\"320px\" />\n</p>\n\n\n\nWhatTheDuck is an open-source web application built on DuckDB, designed to allow users to upload CSV files, store them\nin tables, and perform SQL queries on the uploaded data. The application also provides the functionality to download\nfiltered results in CSV format, supports uploading multiple files, and enables users to perform join queries. It's\nimportant to note that the application stores data temporarily in memory, and refreshing the page will clear all\nuploaded data.\n\n> [!NOTE]  \n> Your data will be processed locally in your browser and won't be sent anywhere.\n\n\n<a href=\"https://www.producthunt.com/posts/whattheduck?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-whattheduck\" target=\"_blank\"><img src=\"https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=404278&theme=light\" alt=\"WhatTheDuck - Your&#0032;browser&#0032;based&#0032;SQL&#0032;engine&#0032;for&#0032;CSV&#0032;files | Product Hunt\" style=\"width: 250px; height: 54px;\" width=\"250\" height=\"54\" /></a>\n<a href=\"https://incentius.com/\" target=\"_blank\"><img src=\"https://incentius.com/img_astro/incentius-logo.png\" alt=\"Incentius\" style=\"width: 56px; height: 56px;\" width=\"56\" height=\"56\" /></a>\n\n## Table of Contents\n\n- [Installation](#installation)\n- [Usage](#usage)\n- [Configuration](#configuration)\n- [Contributing](#contributing)\n- [License](#license)\n\n## Using docker\n\nTo run the application using docker, follow these steps:\n\n```cmd\ndocker-compose build\ndocker-compose up\n```\n\n## Installation\n\nTo install the necessary dependencies, please follow these steps:\n\n1. Clone the WhatTheDuck repository to your local machine.\n2. Navigate to the project directory.\n3. Run the following command to install the dependencies using Yarn:\n   ```bash\n   yarn\n   ```\n   or using npm:\n\n   ```bash\n   npm install\n   ```\n\n## Usage\n\nTo start the application in development mode, with hot-code reloading and error reporting, follow these steps:\n\n1. Make sure you have completed the installation steps mentioned above.\n2. Run the following command:\n    ```bash\n    quasar dev\n    ```\n\nThis will start the application in development mode, and you can access it in your browser at http://localhost:9000 (or\na different port if specified).\nTo build the application for production, use the following command:\n\n   ```bash\n   quasar build\n  ```\n\nThe production build of the application will be available in the **dist/** directory.\n\n## Configuration\n\nThe application's configuration can be customized by modifying\nthe [quasar.config.js](https://v2.quasar.dev/quasar-cli-vite/quasar-config-js) file. Please refer to the Configuring\nquasar.config.js documentation for detailed instructions on how to customize the configuration according to your needs.\n\n## Contributing\n\nContributions to WhatTheDuck are welcome! If you would like to contribute to the project, please follow these steps:\n\n1. Fork the repository on GitHub.\n2. Clone your forked repository to your local machine.\n3. Create a new branch for your feature or bug fix.\n4. Make the necessary changes and commit them.\n5. Push the changes to your forked repository.\n6. Submit a pull request to the main repository.\n\n# Created by Incentius\n\nIf you are seeking to leverage innovative technologies to create a custom application or transform your business\nprocesses, we invite you to reach out to Incentius. Discover how we can help you enable digital transformation and\naccelerate your business progress. For more information, visit us at [Incentius](https://incentius.com)\n\n## License\n\nWhatTheDuck is open-source software released under the [MIT License](./LICENSE.md). You are free to use, modify, and\ndistribute the\napplication in accordance with the terms of the license.\n\n\n## Star History\n\n[![Star History Chart](https://api.star-history.com/svg?repos=incentius-foss/WhatTheDuck&type=Date)](https://star-history.com/#incentius-foss/WhatTheDuck&Date)\n"
  },
  {
    "path": "docker-compose.yaml",
    "content": "version: '3.7'\n\nservices:\n  quasar:\n    build:\n      context: .\n      dockerfile: Dockerfile\n    ports:\n      - \"9000:9000\"  # Expose Quasar app's port\n"
  },
  {
    "path": "index.html",
    "content": "<!DOCTYPE html>\n<html>\n<head>\n  <title>WhatTheDuck - Run SQL queries on your CSV|Parquet files in browser</title>\n\n  <meta charset=\"utf-8\">\n  <meta name=\"title\" content=\"WhatTheDuck\"/>\n  <meta name=\"description\"\n        content=\"It allows users to upload CSV|Parquet files, store them in tables, and perform SQL queries on the data. The application supports downloading filtered results in CSV format, uploading multiple files, and running join queries. Please note that the data is stored temporarily in memory\"/>\n\n  <!-- Open Graph / Facebook -->\n  <meta property=\"og:type\" content=\"website\"/>\n  <meta property=\"og:url\" content=\"https://whattheduck.incentius.com/\"/>\n  <meta property=\"og:title\" content=\"WhatTheDuck\"/>\n  <meta property=\"og:description\"\n        content=\"It allows users to upload CSV|Parquet files, store them in tables, and perform SQL queries on the data. The application supports downloading filtered results in CSV format, uploading multiple files, and running join queries. Please note that the data is stored temporarily in memory\"/>\n  <meta property=\"og:image\" content=\"https://whattheduck.incentius.com/images/WhatTheDuck.png\"/>\n\n\n  <!-- Twitter -->\n  <meta property=\"twitter:card\" content=\"summary_large_image\"/>\n  <meta property=\"twitter:url\" content=\"https://whattheduck.incentius.com/\"/>\n  <meta property=\"twitter:title\" content=\"WhatTheDuck\"/>\n  <meta property=\"twitter:description\"\n        content=\"It allows users to upload CSV files, store them in tables, and perform SQL queries on the data. The application supports downloading filtered results in CSV format, uploading multiple files, and running join queries. Please note that the data is stored temporarily in memory\"/>\n  <meta property=\"twitter:image\" content=\"https://whattheduck.incentius.com/images/WhatTheDuck.png\"/>\n\n  <meta name=\"format-detection\" content=\"telephone=no\">\n  <meta name=\"msapplication-tap-highlight\" content=\"no\">\n  <meta name=\"viewport\"\n        content=\"user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>\">\n\n  <link rel=\"icon\" type=\"image/png\" sizes=\"128x128\" href=\"favicon.png\">\n  <link rel=\"icon\" type=\"image/png\" sizes=\"96x96\" href=\"favicon.png\">\n  <link rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"favicon.png\">\n  <link rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"favicon.png\">\n  <link rel=\"icon\" type=\"image/ico\" href=\"favicon.png\">\n  <script src=\"https://cdn.jsdelivr.net/npm/ace-builds@1.23.1/src-min-noconflict/ace.min.js\"></script>\n  <link href=\"https://cdn.jsdelivr.net/npm/ace-builds@1.23.1/css/ace.min.css\" rel=\"stylesheet\">\n  <!-- Google Tag Manager -->\n  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\n  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\n  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=\n  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);\n  })(window,document,'script','dataLayer','GTM-WTWSQLP');</script>\n  <!-- End Google Tag Manager -->\n</head>\n<body>\n  <!-- Google Tag Manager (noscript) -->\n  <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-WTWSQLP\"\n  height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n  <!-- End Google Tag Manager (noscript) -->\n<!-- quasar:entry-point -->\n</body>\n</html>\n"
  },
  {
    "path": "jsconfig.json",
    "content": "{\n  \"compilerOptions\": {\n    \"baseUrl\": \".\",\n    \"paths\": {\n      \"src/*\": [\n        \"src/*\"\n      ],\n      \"app/*\": [\n        \"*\"\n      ],\n      \"components/*\": [\n        \"src/components/*\"\n      ],\n      \"layouts/*\": [\n        \"src/layouts/*\"\n      ],\n      \"pages/*\": [\n        \"src/pages/*\"\n      ],\n      \"assets/*\": [\n        \"src/assets/*\"\n      ],\n      \"boot/*\": [\n        \"src/boot/*\"\n      ],\n      \"stores/*\": [\n        \"src/stores/*\"\n      ],\n      \"vue$\": [\n        \"node_modules/vue/dist/vue.runtime.esm-bundler.js\"\n      ]\n    }\n  },\n  \"exclude\": [\n    \"dist\",\n    \".quasar\",\n    \"node_modules\"\n  ]\n}"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"duckdb\",\n  \"version\": \"0.0.1\",\n  \"description\": \"A Quasar Project\",\n  \"productName\": \"Quasar App\",\n  \"author\": \"pratikpatel <pratik.patel@aurochssoftware.com>\",\n  \"private\": true,\n  \"scripts\": {\n    \"test\": \"echo \\\"No test specified\\\" && exit 0\"\n  },\n  \"dependencies\": {\n    \"@duckdb/duckdb-wasm\": \"^1.20.0\",\n    \"@quasar/extras\": \"^1.17.0\",\n    \"ace-builds\": \"^1.32.8\",\n    \"axios\": \"^0.21.1\",\n    \"echarts\": \"^5.5.1\",\n    \"file-saver\": \"^2.0.5\",\n    \"numeral\": \"^2.0.6\",\n    \"quasar\": \"^2.18.1\",\n    \"vue\": \"^3.0.0\",\n    \"vue-echarts\": \"^7.0.3\",\n    \"vue-router\": \"^4.0.0\",\n    \"vue3-ace-editor\": \"^2.2.2\",\n    \"xlsx\": \"^0.18.5\"\n  },\n  \"devDependencies\": {\n    \"@quasar/app-vite\": \"^1.11.0\",\n    \"autoprefixer\": \"^9.8.8\",\n    \"postcss\": \"^7.0.39\",\n    \"tailwindcss\": \"npm:@tailwindcss/postcss7-compat@^2.2.17\"\n  },\n  \"engines\": {\n    \"node\": \"^18 || ^16 || ^14.19\",\n    \"npm\": \">= 6.13.4\",\n    \"yarn\": \">= 1.21.1\"\n  }\n}\n"
  },
  {
    "path": "postcss.config.js",
    "content": "/* eslint-disable */\n// https://github.com/michael-ciniawsky/postcss-load-config\n\nmodule.exports = {\n  plugins: [\n    // https://github.com/postcss/autoprefixer\n    require('tailwindcss'),\n    require('autoprefixer')({\n      overrideBrowserslist: [\n        'last 4 Chrome versions',\n        'last 4 Firefox versions',\n        'last 4 Edge versions',\n        'last 4 Safari versions',\n        'last 4 Android versions',\n        'last 4 ChromeAndroid versions',\n        'last 4 FirefoxAndroid versions',\n        'last 4 iOS versions'\n      ]\n    })\n\n    // https://github.com/elchininet/postcss-rtlcss\n    // If you want to support RTL css, then\n    // 1. yarn/npm install postcss-rtlcss\n    // 2. optionally set quasar.config.js > framework > lang to an RTL language\n    // 3. uncomment the following line:\n    // require('postcss-rtlcss')\n  ]\n}\n"
  },
  {
    "path": "quasar.config.js",
    "content": "/* eslint-env node */\n\n/*\n * This file runs in a Node context (it's NOT transpiled by Babel), so use only\n * the ES6 features that are supported by your Node version. https://node.green/\n */\n\n// Configuration for your app\n// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js\n\n\nconst { configure } = require('quasar/wrappers');\n\n\nmodule.exports = configure(function (/* ctx */) {\n  return {\n\n\n    // https://v2.quasar.dev/quasar-cli/prefetch-feature\n    // preFetch: true,\n\n    // app boot file (/src/boot)\n    // --> boot files are part of \"main.js\"\n    // https://v2.quasar.dev/quasar-cli/boot-files\n    boot: [\n\n      'duckdb',\n      'bus',\n    ],\n\n    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css\n    css: [\n      'app.css'\n    ],\n\n    // https://github.com/quasarframework/quasar/tree/dev/extras\n    extras: [\n      // 'ionicons-v4',\n      // 'mdi-v5',\n      'fontawesome-v6',\n      // 'eva-icons',\n      // 'themify',\n      // 'line-awesome',\n      // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!\n\n      'roboto-font', // optional, you are not bound to it\n      'material-icons', // optional, you are not bound to it\n    ],\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#build\n    build: {\n      target: {\n        browser: [ 'es2019', 'edge88', 'firefox78', 'chrome87', 'safari13.1' ],\n        node: 'node16'\n      },\n\n      vueRouterMode: 'history', // available values: 'hash', 'history'\n      // vueRouterBase,\n      // vueDevtools,\n      // vueOptionsAPI: false,\n\n      // rebuildCache: true, // rebuilds Vite/linter/etc cache on startup\n\n      // publicPath: '/',\n      // analyze: true,\n      // env: {},\n      // rawDefine: {}\n      // ignorePublicFolder: true,\n      // minify: false,\n      // polyfillModulePreload: true,\n      // distDir\n\n      // extendViteConf (viteConf) {},\n      // viteVuePluginOptions: {},\n\n\n      // vitePlugins: [\n      //   [ 'package-name', { ..options.. } ]\n      // ]\n    },\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#devServer\n    devServer: {\n      // https: true\n      open: true // opens browser window automatically\n    },\n\n    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#framework\n    framework: {\n      config: {},\n\n      // iconSet: 'material-icons', // Quasar icon set\n      // lang: 'en-US', // Quasar language pack\n\n      // For special cases outside of where the auto-import strategy can have an impact\n      // (like functional components as one of the examples),\n      // you can manually specify Quasar components/directives to be available everywhere:\n      //\n      // components: [],\n      // directives: [],\n\n      // Quasar plugins\n      plugins: ['Notify', 'Loading']\n    },\n\n    // animations: 'all', // --- includes all animations\n    // https://v2.quasar.dev/options/animations\n    animations: [],\n\n    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#property-sourcefiles\n    // sourceFiles: {\n    //   rootComponent: 'src/App.vue',\n    //   router: 'src/router/index',\n    //   store: 'src/store/index',\n    //   registerServiceWorker: 'src-pwa/register-service-worker',\n    //   serviceWorker: 'src-pwa/custom-service-worker',\n    //   pwaManifestFile: 'src-pwa/manifest.json',\n    //   electronMain: 'src-electron/electron-main',\n    //   electronPreload: 'src-electron/electron-preload'\n    // },\n\n    // https://v2.quasar.dev/quasar-cli/developing-ssr/configuring-ssr\n    ssr: {\n      // ssrPwaHtmlFilename: 'offline.html', // do NOT use index.html as name!\n                                          // will mess up SSR\n\n      // extendSSRWebserverConf (esbuildConf) {},\n      // extendPackageJson (json) {},\n\n      pwa: false,\n\n      // manualStoreHydration: true,\n      // manualPostHydrationTrigger: true,\n\n      prodPort: 3000, // The default port that the production server should use\n                      // (gets superseded if process.env.PORT is specified at runtime)\n\n      middlewares: [\n        'render' // keep this as last one\n      ]\n    },\n\n    // https://v2.quasar.dev/quasar-cli/developing-pwa/configuring-pwa\n    pwa: {\n      workboxMode: 'generateSW', // or 'injectManifest'\n      injectPwaMetaTags: true,\n      swFilename: 'sw.js',\n      manifestFilename: 'manifest.json',\n      useCredentialsForManifestTag: false,\n      // useFilenameHashes: true,\n      // extendGenerateSWOptions (cfg) {}\n      // extendInjectManifestOptions (cfg) {},\n      // extendManifestJson (json) {}\n      // extendPWACustomSWConf (esbuildConf) {}\n    },\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova\n    cordova: {\n      // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing\n    },\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli/developing-capacitor-apps/configuring-capacitor\n    capacitor: {\n      hideSplashscreen: true\n    },\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli/developing-electron-apps/configuring-electron\n    electron: {\n      // extendElectronMainConf (esbuildConf)\n      // extendElectronPreloadConf (esbuildConf)\n\n      inspectPort: 5858,\n\n      bundler: 'packager', // 'packager' or 'builder'\n\n      packager: {\n        // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options\n\n        // OS X / Mac App Store\n        // appBundleId: '',\n        // appCategoryType: '',\n        // osxSign: '',\n        // protocol: 'myapp://path',\n\n        // Windows only\n        // win32metadata: { ... }\n      },\n\n      builder: {\n        // https://www.electron.build/configuration/configuration\n\n        appId: 'duckdb'\n      }\n    },\n\n    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-browser-extensions/configuring-bex\n    bex: {\n      contentScripts: [\n        'my-content-script'\n      ],\n\n      // extendBexScriptsConf (esbuildConf) {}\n      // extendBexManifestJson (json) {}\n    }\n  }\n});\n"
  },
  {
    "path": "src/App.vue",
    "content": "<template>\n  <router-view />\n</template>\n\n<script>\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  name: 'App'\n})\n</script>\n"
  },
  {
    "path": "src/assets/Sample-Spreadsheet-10-rows.csv",
    "content": "1,\"Eldon Base for stackable storage shelf, platinum\",Muhammed MacIntyre,3,-213.25,38.94,35,Nunavut,Storage & Organization,0.8\n2,\"1.7 Cubic Foot Compact \"\"Cube\"\" Office Refrigerators\",Barry French,293,457.81,208.16,68.02,Nunavut,Appliances,0.58\n3,\"Cardinal Slant-D Ring Binder, Heavy Gauge Vinyl\",Barry French,293,46.71,8.69,2.99,Nunavut,Binders and Binder Accessories,0.39\n4,R380,Clay Rozendal,483,1198.97,195.99,3.99,Nunavut,Telephones and Communication,0.58\n5,Holmes HEPA Air Purifier,Carlos Soltero,515,30.94,21.78,5.94,Nunavut,Appliances,0.5\n6,G.E. Longer-Life Indoor Recessed Floodlight Bulbs,Carlos Soltero,515,4.43,6.64,4.95,Nunavut,Office Furnishings,0.37\n7,\"Angle-D Binders with Locking Rings, Label Holders\",Carl Jackson,613,-54.04,7.3,7.72,Nunavut,Binders and Binder Accessories,0.38\n8,\"SAFCO Mobile Desk Side File, Wire Frame\",Carl Jackson,613,127.70,42.76,6.22,Nunavut,Storage & Organization,\n9,\"SAFCO Commercial Wire Shelving, Black\",Monica Federle,643,-695.26,138.14,35,Nunavut,Storage & Organization,\n10,Xerox 198,Dorothy Badders,678,-226.36,4.98,8.33,Nunavut,Paper,0.38\n"
  },
  {
    "path": "src/assets/customers-100.csv",
    "content": "Index,Customer Id,First Name,Last Name,Company,City,Country,Phone 1,Phone 2,Email,Subscription Date,Website\r\n1,DD37Cf93aecA6Dc,Sheryl,Baxter,Rasmussen Group,East Leonard,Chile,229.077.5154,397.884.0519x718,zunigavanessa@smith.info,2020-08-24,http://www.stephenson.com/\r\n2,1Ef7b82A4CAAD10,Preston,Lozano,Vega-Gentry,East Jimmychester,Djibouti,5153435776,686-620-1820x944,vmata@colon.com,2021-04-23,http://www.hobbs.com/\r\n3,6F94879bDAfE5a6,Roy,Berry,Murillo-Perry,Isabelborough,Antigua and Barbuda,+1-539-402-0259,(496)978-3969x58947,beckycarr@hogan.com,2020-03-25,http://www.lawrence.com/\r\n4,5Cef8BFA16c5e3c,Linda,Olsen,\"Dominguez, Mcmillan and Donovan\",Bensonview,Dominican Republic,001-808-617-6467x12895,+1-813-324-8756,stanleyblackwell@benson.org,2020-06-02,http://www.good-lyons.com/\r\n5,053d585Ab6b3159,Joanna,Bender,\"Martin, Lang and Andrade\",West Priscilla,Slovakia (Slovak Republic),001-234-203-0635x76146,001-199-446-3860x3486,colinalvarado@miles.net,2021-04-17,https://goodwin-ingram.com/\r\n6,2d08FB17EE273F4,Aimee,Downs,Steele Group,Chavezborough,Bosnia and Herzegovina,(283)437-3886x88321,999-728-1637,louis27@gilbert.com,2020-02-25,http://www.berger.net/\r\n7,EA4d384DfDbBf77,Darren,Peck,\"Lester, Woodard and Mitchell\",Lake Ana,Pitcairn Islands,(496)452-6181x3291,+1-247-266-0963x4995,tgates@cantrell.com,2021-08-24,https://www.le.com/\r\n8,0e04AFde9f225dE,Brett,Mullen,\"Sanford, Davenport and Giles\",Kimport,Bulgaria,001-583-352-7197x297,001-333-145-0369,asnow@colon.com,2021-04-12,https://hammond-ramsey.com/\r\n9,C2dE4dEEc489ae0,Sheryl,Meyers,Browning-Simon,Robersonstad,Cyprus,854-138-4911x5772,+1-448-910-2276x729,mariokhan@ryan-pope.org,2020-01-13,https://www.bullock.net/\r\n10,8C2811a503C7c5a,Michelle,Gallagher,Beck-Hendrix,Elaineberg,Timor-Leste,739.218.2516x459,001-054-401-0347x617,mdyer@escobar.net,2021-11-08,https://arias.com/\r\n11,216E205d6eBb815,Carl,Schroeder,\"Oconnell, Meza and Everett\",Shannonville,Guernsey,637-854-0256x825,114.336.0784x788,kirksalas@webb.com,2021-10-20,https://simmons-hurley.com/\r\n12,CEDec94deE6d69B,Jenna,Dodson,\"Hoffman, Reed and Mcclain\",East Andrea,Vietnam,(041)737-3846,+1-556-888-3485x42608,mark42@robbins.com,2020-11-29,http://www.douglas.net/\r\n13,e35426EbDEceaFF,Tracey,Mata,Graham-Francis,South Joannamouth,Togo,001-949-844-8787,(855)713-8773,alex56@walls.org,2021-12-02,http://www.beck.com/\r\n14,A08A8aF8BE9FaD4,Kristine,Cox,Carpenter-Cook,Jodyberg,Sri Lanka,786-284-3358x62152,+1-315-627-1796x8074,holdenmiranda@clarke.com,2021-02-08,https://www.brandt.com/\r\n15,6fEaA1b7cab7B6C,Faith,Lutz,Carter-Hancock,Burchbury,Singapore,(781)861-7180x8306,207-185-3665,cassieparrish@blevins-chapman.net,2022-01-26,http://stevenson.org/\r\n16,8cad0b4CBceaeec,Miranda,Beasley,Singleton and Sons,Desireeshire,Oman,540.085.3135x185,+1-600-462-6432x21881,vduncan@parks-hardy.com,2022-04-12,http://acosta.org/\r\n17,a5DC21AE3a21eaA,Caroline,Foley,Winters-Mendoza,West Adriennestad,Western Sahara,936.222.4746x9924,001-469-948-6341x359,holtgwendolyn@watson-davenport.com,2021-03-10,http://www.benson-roth.com/\r\n18,F8Aa9d6DfcBeeF8,Greg,Mata,Valentine LLC,Lake Leslie,Mozambique,(701)087-2415,(195)156-1861x26241,jaredjuarez@carroll.org,2022-03-26,http://pitts-cherry.com/\r\n19,F160f5Db3EfE973,Clifford,Jacobson,Simon LLC,Harmonview,South Georgia and the South Sandwich Islands,001-151-330-3524x0469,(748)477-7174,joseph26@jacobson.com,2020-09-24,https://mcconnell.com/\r\n20,0F60FF3DdCd7aB0,Joanna,Kirk,Mays-Mccormick,Jamesshire,French Polynesia,(266)131-7001x711,(283)312-5579x11543,tuckerangie@salazar.net,2021-09-24,https://www.camacho.net/\r\n21,9F9AdB7B8A6f7F2,Maxwell,Frye,Patterson Inc,East Carly,Malta,423.262.3059,202-880-0688x7491,fgibson@drake-webb.com,2022-01-12,http://www.roberts.com/\r\n22,FBd0Ded4F02a742,Kiara,Houston,\"Manning, Hester and Arroyo\",South Alvin,Netherlands,001-274-040-3582x10611,+1-528-175-0973x4684,blanchardbob@wallace-shannon.com,2020-09-15,https://www.reid-potts.com/\r\n23,2FB0FAA1d429421,Colleen,Howard,Greer and Sons,Brittanyview,Paraguay,1935085151,(947)115-7711x5488,rsingleton@ryan-cherry.com,2020-08-19,http://paul.biz/\r\n24,010468dAA11382c,Janet,Valenzuela,Watts-Donaldson,Veronicamouth,Lao People's Democratic Republic,354.259.5062x7538,500.433.2022,stefanie71@spence.com,2020-09-08,https://moreno.biz/\r\n25,eC1927Ca84E033e,Shane,Wilcox,Tucker LLC,Bryanville,Albania,(429)005-9030x11004,541-116-4501,mariah88@santos.com,2021-04-06,https://www.ramos.com/\r\n26,09D7D7C8Fe09aea,Marcus,Moody,Giles Ltd,Kaitlyntown,Panama,674-677-8623,909-277-5485x566,donnamullins@norris-barrett.org,2022-05-24,https://www.curry.com/\r\n27,aBdfcF2c50b0bfD,Dakota,Poole,Simmons Group,Michealshire,Belarus,(371)987-8576x4720,071-152-1376,stacey67@fields.org,2022-02-20,https://sanford-wilcox.biz/\r\n28,b92EBfdF8a3f0E6,Frederick,Harper,\"Hinton, Chaney and Stokes\",South Marissatown,Switzerland,+1-077-121-1558x0687,264.742.7149,jacobkhan@bright.biz,2022-05-26,https://callahan.org/\r\n29,3B5dAAFA41AFa22,Stefanie,Fitzpatrick,Santana-Duran,Acevedoville,Saint Vincent and the Grenadines,(752)776-3286,+1-472-021-4814x85074,wterrell@clark.com,2020-07-30,https://meyers.com/\r\n30,EDA69ca7a6e96a2,Kent,Bradshaw,Sawyer PLC,North Harold,Tanzania,+1-472-143-5037x884,126.922.6153,qjimenez@boyd.com,2020-04-26,http://maynard-ho.com/\r\n31,64DCcDFaB9DFd4e,Jack,Tate,\"Acosta, Petersen and Morrow\",West Samuel,Zimbabwe,965-108-4406x20714,046.906.1442x6784,gfigueroa@boone-zavala.com,2021-09-15,http://www.hawkins-ramsey.com/\r\n32,679c6c83DD872d6,Tom,Trujillo,Mcgee Group,Cunninghamborough,Denmark,416-338-3758,(775)890-7209,tapiagreg@beard.info,2022-01-13,http://www.daniels-klein.com/\r\n33,7Ce381e4Afa4ba9,Gabriel,Mejia,Adkins-Salinas,Port Annatown,Liechtenstein,4077245425,646.044.0696x66800,coleolson@jennings.net,2021-04-24,https://patel-hanson.info/\r\n34,A09AEc6E3bF70eE,Kaitlyn,Santana,Herrera Group,New Kaitlyn,United States of America,6303643286,447-710-6202x07313,georgeross@miles.org,2021-09-21,http://pham.com/\r\n35,aA9BAFfBc3710fe,Faith,Moon,\"Waters, Chase and Aguilar\",West Marthaburgh,Bahamas,+1-586-217-0359x6317,+1-818-199-1403,willistonya@randolph-baker.com,2021-11-03,https://spencer-charles.info/\r\n36,E11dfb2DB8C9f72,Tammie,Haley,\"Palmer, Barnes and Houston\",East Teresa,Belize,001-276-734-4113x6087,(430)300-8770,harrisisaiah@jenkins.com,2022-01-04,http://evans-simon.com/\r\n37,889eCf90f68c5Da,Nicholas,Sosa,Jordan Ltd,South Hunter,Uruguay,(661)425-6042,975-998-1519,fwolfe@dorsey.com,2021-08-10,https://www.fleming-richards.com/\r\n38,7a1Ee69F4fF4B4D,Jordan,Gay,Glover and Sons,South Walter,Solomon Islands,7208417020,8035336772,tiffanydavies@harris-mcfarland.org,2021-02-24,http://www.lee.org/\r\n39,dca4f1D0A0fc5c9,Bruce,Esparza,Huerta-Mclean,Poolefurt,Montenegro,559-529-4424,001-625-000-7132x0367,preese@frye-vega.com,2021-10-22,http://www.farley.org/\r\n40,17aD8e2dB3df03D,Sherry,Garza,Anderson Ltd,West John,Poland,001-067-713-6440x158,(978)289-8785x5766,ann48@miller.com,2021-11-01,http://spence.com/\r\n41,2f79Cd309624Abb,Natalie,Gentry,Monroe PLC,West Darius,Dominican Republic,830.996.8238,499.122.5415,tcummings@fitzpatrick-ashley.com,2020-10-10,http://www.dorsey.biz/\r\n42,6e5ad5a5e2bB5Ca,Bryan,Dunn,Kaufman and Sons,North Jimstad,Burkina Faso,001-710-802-5565,078.699.8982x13881,woodwardandres@phelps.com,2021-09-08,http://www.butler.com/\r\n43,7E441b6B228DBcA,Wayne,Simpson,Perkins-Trevino,East Rebekahborough,Bolivia,(344)156-8632x1869,463-445-3702x38463,barbarapittman@holder.com,2020-12-13,https://gillespie-holder.com/\r\n44,D3fC11A9C235Dc6,Luis,Greer,Cross PLC,North Drew,Bulgaria,001-336-025-6849x701,684.698.2911x6092,bstuart@williamson-mcclure.com,2022-05-15,https://fletcher-nielsen.com/\r\n45,30Dfa48fe5Ede78,Rhonda,Frost,\"Herrera, Shepherd and Underwood\",Lake Lindaburgh,Monaco,(127)081-9339,+1-431-028-3337x3492,zkrueger@wolf-chavez.net,2021-12-06,http://www.khan.com/\r\n46,fD780ED8dbEae7B,Joanne,Montes,\"Price, Sexton and Mcdaniel\",Gwendolynview,Palau,(897)726-7952,(467)886-9467x5721,juan80@henson.net,2020-07-01,http://ochoa.com/\r\n47,300A40d3ce24bBA,Geoffrey,Guzman,Short-Wiggins,Zimmermanland,Uzbekistan,975.235.8921x269,(983)188-6873,bauercrystal@gay.com,2020-04-23,https://decker-kline.com/\r\n48,283DFCD0Dba40aF,Gloria,Mccall,\"Brennan, Acosta and Ramos\",North Kerriton,Ghana,445-603-6729,001-395-959-4736x4524,bartlettjenna@zuniga-moss.biz,2022-03-11,http://burgess-frank.com/\r\n49,F4Fc91fEAEad286,Brady,Cohen,Osborne-Erickson,North Eileenville,United Arab Emirates,741.849.0139x524,+1-028-691-7497x0894,mccalltyrone@durham-rose.biz,2022-03-10,http://hammond-barron.com/\r\n50,80F33Fd2AcebF05,Latoya,Mccann,\"Hobbs, Garrett and Sanford\",Port Sergiofort,Belarus,(530)287-4548x29481,162-234-0249x32790,bobhammond@barry.biz,2021-12-02,https://www.burton.com/\r\n51,Aa20BDe68eAb0e9,Gerald,Hawkins,\"Phelps, Forbes and Koch\",New Alberttown,Canada,+1-323-239-1456x96168,(092)508-0269,uwarner@steele-arias.com,2021-03-19,https://valenzuela.com/\r\n52,e898eEB1B9FE22b,Samuel,Crawford,\"May, Goodwin and Martin\",South Jasmine,Algeria,802-242-7457,626.116.9535x8578,xpittman@ritter-carney.net,2021-03-27,https://guerrero.org/\r\n53,faCEF517ae7D8eB,Patricia,Goodwin,\"Christian, Winters and Ellis\",Cowanfort,Swaziland,322.549.7139x70040,(111)741-4173,vaughanchristy@lara.biz,2021-03-08,http://clark.info/\r\n54,c09952De6Cda8aA,Stacie,Richard,Byrd Inc,New Deborah,Madagascar,001-622-948-3641x24810,001-731-168-2893x8891,clinton85@colon-arias.org,2020-10-15,https://kim.com/\r\n55,f3BEf3Be028166f,Robin,West,\"Nixon, Blackwell and Sosa\",Wallstown,Ecuador,698.303.4267,001-683-837-7651x525,greenemiranda@zimmerman.com,2022-01-13,https://www.mora.com/\r\n56,C6F2Fc6a7948a4e,Ralph,Haas,Montes PLC,Lake Ellenchester,Palestinian Territory,2239271999,001-962-434-0867x649,goodmancesar@figueroa.biz,2020-05-25,http://may.com/\r\n57,c8FE57cBBdCDcb2,Phyllis,Maldonado,Costa PLC,Lake Whitney,Saint Barthelemy,4500370767,001-508-064-6725x017,yhanson@warner-diaz.org,2021-01-25,http://www.bernard.com/\r\n58,B5acdFC982124F2,Danny,Parrish,Novak LLC,East Jaredbury,United Arab Emirates,(669)384-8597x8794,506.731.5952x571,howelldarren@house-cohen.com,2021-03-17,http://www.parsons-hudson.com/\r\n59,8c7DdF10798bCC3,Kathy,Hill,\"Moore, Mccoy and Glass\",Selenabury,South Georgia and the South Sandwich Islands,001-171-716-2175x310,888.625.0654,ncamacho@boone-simmons.org,2020-11-15,http://hayden.com/\r\n60,C681dDd0cc422f7,Kelli,Hardy,Petty Ltd,Huangfort,Sao Tome and Principe,020.324.2191x2022,424-157-8216,kristopher62@oliver.com,2020-12-20,http://www.kidd.com/\r\n61,a940cE42e035F28,Lynn,Pham,\"Brennan, Camacho and Tapia\",East Pennyshire,Portugal,846.468.6834x611,001-248-691-0006,mpham@rios-guzman.com,2020-08-21,https://www.murphy.com/\r\n62,9Cf5E6AFE0aeBfd,Shelley,Harris,\"Prince, Malone and Pugh\",Port Jasminborough,Togo,423.098.0315x8373,+1-386-458-8944x15194,zachary96@mitchell-bryant.org,2020-12-10,https://www.ryan.com/\r\n63,aEcbe5365BbC67D,Eddie,Jimenez,Caldwell Group,West Kristine,Ethiopia,+1-235-657-1073x6306,(026)401-7353x2417,kristiwhitney@bernard.com,2022-03-24,http://cherry.com/\r\n64,FCBdfCEAe20A8Dc,Chloe,Hutchinson,Simon LLC,South Julia,Netherlands,981-544-9452,+1-288-552-4666x060,leah85@sutton-terrell.com,2022-05-15,https://mitchell.info/\r\n65,636cBF0835E10ff,Eileen,Lynch,\"Knight, Abbott and Hubbard\",Helenborough,Liberia,+1-158-951-4131x53578,001-673-779-6713x680,levigiles@vincent.com,2021-01-02,http://mckay.com/\r\n66,fF1b6c9E8Fbf1ff,Fernando,Lambert,Church-Banks,Lake Nancy,Lithuania,497.829.9038,3863743398,fisherlinda@schaefer.net,2021-04-23,https://www.vang.com/\r\n67,2A13F74EAa7DA6c,Makayla,Cannon,Henderson Inc,Georgeport,New Caledonia,001-215-801-6392x46009,027-609-6460,scottcurtis@hurley.biz,2020-01-20,http://www.velazquez.net/\r\n68,a014Ec1b9FccC1E,Tom,Alvarado,Donaldson-Dougherty,South Sophiaberg,Kiribati,(585)606-2980x2258,730-797-3594x5614,nicholsonnina@montgomery.info,2020-08-18,http://odom-massey.com/\r\n69,421a109cABDf5fa,Virginia,Dudley,Warren Ltd,Hartbury,French Southern Territories,027.846.3705x14184,+1-439-171-1846x4636,zvalencia@phelps.com,2021-01-31,http://hunter-esparza.com/\r\n70,CC68FD1D3Bbbf22,Riley,Good,Wade PLC,Erikaville,Canada,6977745822,855-436-7641,alex06@galloway.com,2020-02-03,http://conway.org/\r\n71,CBCd2Ac8E3eBDF9,Alexandria,Buck,Keller-Coffey,Nicolasfort,Iran,078-900-4760x76668,414-112-8700x68751,lee48@manning.com,2021-02-20,https://ramsey.org/\r\n72,Ef859092FbEcC07,Richard,Roth,Conway-Mcbride,New Jasmineshire,Morocco,581-440-6539,9857827463,aharper@maddox-townsend.org,2020-02-23,https://www.brooks.com/\r\n73,F560f2d3cDFb618,Candice,Keller,Huynh and Sons,East Summerstad,Zimbabwe,001-927-965-8550x92406,001-243-038-4271x53076,buckleycory@odonnell.net,2020-08-22,https://www.lucero.com/\r\n74,A3F76Be153Df4a3,Anita,Benson,Parrish Ltd,Skinnerport,Russian Federation,874.617.5668x69878,(399)820-6418x0071,angie04@oconnell.com,2020-02-09,http://oconnor.com/\r\n75,D01Af0AF7cBbFeA,Regina,Stein,Guzman-Brown,Raystad,Solomon Islands,001-469-848-0724x4407,001-085-360-4426x00357,zrosario@rojas-hardin.net,2022-01-15,http://www.johnston.info/\r\n76,d40e89dCade7b2F,Debra,Riddle,\"Chang, Aguirre and Leblanc\",Colinhaven,United States Virgin Islands,+1-768-182-6014x14336,(303)961-4491,shieldskerry@robles.com,2020-07-11,http://kaiser.info/\r\n77,BF6a1f9bd1bf8DE,Brittany,Zuniga,Mason-Hester,West Reginald,Kyrgyz Republic,(050)136-9025,001-480-851-2496x0157,mchandler@cochran-huerta.org,2021-07-24,http://www.boyle.com/\r\n78,FfaeFFbbbf280db,Cassidy,Mcmahon,\"Mcguire, Huynh and Hopkins\",Lake Sherryborough,Myanmar,5040771311,684-682-0021x1326,katrinalane@fitzgerald.com,2020-10-21,https://hurst.com/\r\n79,CbAE1d1e9a8dCb1,Laurie,Pennington,\"Sanchez, Marsh and Hale\",Port Katherineville,Dominica,007.155.3406x553,+1-809-862-5566x277,cookejill@powell.com,2020-06-08,http://www.hebert.com/\r\n80,A7F85c1DE4dB87f,Alejandro,Blair,\"Combs, Waller and Durham\",Thomasland,Iceland,(690)068-4641x51468,555.509.8691x2329,elizabethbarr@ewing.com,2020-09-19,https://mercado-blevins.com/\r\n81,D6CEAfb3BDbaa1A,Leslie,Jennings,Blankenship-Arias,Coreybury,Micronesia,629.198.6346,075.256.0829,corey75@wiggins.com,2021-11-13,https://www.juarez.com/\r\n82,Ebdb6F6F7c90b69,Kathleen,Mckay,\"Coffey, Lamb and Johnson\",Lake Janiceton,Saint Vincent and the Grenadines,(733)910-9968,(691)247-4128x0665,chloelester@higgins-wilkinson.com,2021-09-12,http://www.owens-mooney.com/\r\n83,E8E7e8Cfe516ef0,Hunter,Moreno,Fitzpatrick-Lawrence,East Clinton,Isle of Man,(733)833-6754,001-761-013-7121,isaac26@benton-finley.com,2020-12-28,http://walls.info/\r\n84,78C06E9b6B3DF20,Chad,Davidson,Garcia-Jimenez,South Joshuashire,Oman,8275702958,(804)842-4715,justinwalters@jimenez.com,2021-11-15,http://www.garner-oliver.com/\r\n85,03A1E62ADdeb31c,Corey,Holt,\"Mcdonald, Bird and Ramirez\",New Glenda,Fiji,001-439-242-4986x7918,3162708934,maurice46@morgan.com,2020-02-18,http://www.watson.com/\r\n86,C6763c99d0bd16D,Emma,Cunningham,Stephens Inc,North Jillianview,New Zealand,128-059-0206x60217,(312)164-4545x2284,walter83@juarez.org,2022-05-13,http://www.reid.info/\r\n87,ebe77E5Bf9476CE,Duane,Woods,Montoya-Miller,Lyonsberg,Maldives,(636)544-7783x7288,(203)287-1003x5932,kmercer@wagner.com,2020-07-21,http://murray.org/\r\n88,E4Bbcd8AD81fC5f,Alison,Vargas,\"Vaughn, Watts and Leach\",East Cristinabury,Benin,365-273-8144,053-308-7653x6287,vcantu@norton.com,2020-11-10,http://mason.info/\r\n89,efeb73245CDf1fF,Vernon,Kane,Carter-Strickland,Thomasfurt,Yemen,114-854-1159x555,499-608-4612,hilljesse@barrett.info,2021-04-15,http://www.duffy-hensley.net/\r\n90,37Ec4B395641c1E,Lori,Flowers,Decker-Mcknight,North Joeburgh,Namibia,679.415.1210,945-842-3659x4581,tyrone77@valenzuela.info,2021-01-09,http://www.deleon-crosby.com/\r\n91,5ef6d3eefdD43bE,Nina,Chavez,Byrd-Campbell,Cassidychester,Bhutan,053-344-3205,+1-330-920-5422x571,elliserica@frank.com,2020-03-26,https://www.pugh.com/\r\n92,98b3aeDcC3B9FF3,Shane,Foley,Rocha-Hart,South Dannymouth,Hungary,+1-822-569-0302,001-626-114-5844x55073,nsteele@sparks.com,2021-07-06,https://www.holt-sparks.com/\r\n93,aAb6AFc7AfD0fF3,Collin,Ayers,Lamb-Peterson,South Lonnie,Anguilla,404-645-5351x012,001-257-582-8850x8516,dudleyemily@gonzales.biz,2021-06-29,http://www.ruiz.com/\r\n94,54B5B5Fe9F1B6C5,Sherry,Young,\"Lee, Lucero and Johnson\",Frankchester,Solomon Islands,158-687-1764,(438)375-6207x003,alan79@gates-mclaughlin.com,2021-04-04,https://travis.net/\r\n95,BE91A0bdcA49Bbc,Darrell,Douglas,\"Newton, Petersen and Mathis\",Daisyborough,Mali,001-084-845-9524x1777,001-769-564-6303,grayjean@lowery-good.com,2022-02-17,https://banks.biz/\r\n96,cb8E23e48d22Eae,Karl,Greer,Carey LLC,East Richard,Guyana,(188)169-1674x58692,001-841-293-3519x614,hhart@jensen.com,2022-01-30,http://hayes-perez.com/\r\n97,CeD220bdAaCfaDf,Lynn,Atkinson,\"Ware, Burns and Oneal\",New Bradview,Sri Lanka,+1-846-706-2218,605.413.3198,vkemp@ferrell.com,2021-07-10,https://novak-allison.com/\r\n98,28CDbC0dFe4b1Db,Fred,Guerra,Schmitt-Jones,Ortegaland,Solomon Islands,+1-753-067-8419x7170,+1-632-666-7507x92121,swagner@kane.org,2021-09-18,https://www.ross.com/\r\n99,c23d1D9EE8DEB0A,Yvonne,Farmer,Fitzgerald-Harrell,Lake Elijahview,Aruba,(530)311-9786,001-869-452-0943x12424,mccarthystephen@horn-green.biz,2021-08-11,http://watkins.info/\r\n100,2354a0E336A91A1,Clarence,Haynes,\"Le, Nash and Cross\",Judymouth,Honduras,(753)813-6941,783.639.1472,colleen91@faulkner.biz,2020-03-11,http://www.hatfield-saunders.net/\r\n"
  },
  {
    "path": "src/boot/.gitkeep",
    "content": ""
  },
  {
    "path": "src/boot/bus.js",
    "content": "import { EventBus } from 'quasar'\nimport { boot } from 'quasar/wrappers'\n\nconst bus = new EventBus()\n\nexport default boot(({ app }) => {\n\n  // for Options API\n  app.config.globalProperties.$bus = bus\n\n  // for Composition API\n  app.provide('bus', bus)\n})\n\nexport {bus};"
  },
  {
    "path": "src/boot/duckdb.js",
    "content": "import {boot} from 'quasar/wrappers'\nimport * as duckdb from '@duckdb/duckdb-wasm';\nimport duckdb_wasm from '@duckdb/duckdb-wasm/dist/duckdb-mvp.wasm?url';\nimport mvp_worker from '@duckdb/duckdb-wasm/dist/duckdb-browser-mvp.worker.js?url';\nimport duckdb_wasm_next from '@duckdb/duckdb-wasm/dist/duckdb-eh.wasm?url';\nimport eh_worker from '@duckdb/duckdb-wasm/dist/duckdb-browser-eh.worker.js?url';\n\nconst MANUAL_BUNDLES = {\n  mvp: {\n    mainModule: duckdb_wasm,\n    mainWorker: mvp_worker,\n  },\n  eh: {\n    mainModule: duckdb_wasm_next,\n    mainWorker: eh_worker\n  },\n};\n\nexport default boot(async ({app}) => {\n\n\n// Select a bundle based on browser checks\n  const bundle = await duckdb.selectBundle(MANUAL_BUNDLES);\n\n  const worker = new Worker(bundle.mainWorker);\n  const logger = new duckdb.ConsoleLogger();\n  const db = new duckdb.AsyncDuckDB(logger, worker);\n  await db.instantiate(bundle.mainModule, bundle.pthreadWorker);\n\n  const conn = await db.connect(); // Connect to db\n  app.config.globalProperties.$conn = conn\n  app.config.globalProperties.$worker = worker\n  app.config.globalProperties.$db = db\n})\n\n// export {conn, db, worker}\n"
  },
  {
    "path": "src/components/EssentialLink.vue",
    "content": "<template>\n  <q-item\n    clickable\n    tag=\"a\"\n    target=\"_blank\"\n    :href=\"link\"\n  >\n    <q-item-section\n      v-if=\"icon\"\n      avatar\n    >\n      <q-icon :name=\"icon\" />\n    </q-item-section>\n\n    <q-item-section>\n      <q-item-label>{{ title }}</q-item-label>\n      <q-item-label caption>{{ caption }}</q-item-label>\n    </q-item-section>\n  </q-item>\n</template>\n\n<script>\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  name: 'EssentialLink',\n  props: {\n    title: {\n      type: String,\n      required: true\n    },\n\n    caption: {\n      type: String,\n      default: ''\n    },\n\n    link: {\n      type: String,\n      default: '#'\n    },\n\n    icon: {\n      type: String,\n      default: ''\n    }\n  }\n})\n</script>\n"
  },
  {
    "path": "src/css/app.css",
    "content": "/* app global css */\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n.dd-scroll::-webkit-scrollbar {\n  width: 4px;\n  height: 8px;\n}\n.dd-scroll::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n.dd-scroll::-webkit-scrollbar-thumb {\n  background-color: #727272;\n  border-radius: 5px;\n}\n.scroll::-webkit-scrollbar {\n  width: 4px;\n  height: 8px;\n}\n.scroll::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n.scroll::-webkit-scrollbar-thumb {\n  background-color: #727272;\n  border-radius: 5px;\n}\n.q-table--dark .q-table__bottom, .q-table--dark thead, .q-table--dark tr, .q-table--dark th, .q-table--dark td {\n  border-color: #202020;\n}\n.q-dark{\n  background-color: #101010;\n}"
  },
  {
    "path": "src/layouts/MainLayout.vue",
    "content": "<template>\n  <q-layout view=\"HHh Lpr lFf\">\n    <q-header class=\"tw-bg-primarybg tw-h-14\" style=\"\">\n      <div class=\"tw-flex tw-justify-between tw-h-full tw-items-center tw-px-5\">\n        <div class=\"tw-flex tw-items-center\">\n          <img src=\"/logo.svg\" class=\"tw-h-6 tw-my-auto\"/> <span class=\"tw-mt-3 tw-ml-1.5\">by <a href=\"https://incentius.com/\" target=\"_blank\" class=\"tw-text-hara\">incentius.com</a></span>\n        </div>\n        <div class=\"tw-flex tw-items-center tw-gap-9\">\n          <div @click=\"openPopUp()\" class=\"tw-flex tw-items-center tw-justify-between tw-gap-12\">\n            <div class=\"tw-text-hara hover:tw-text-morehara tw-flex tw-items-center\">\n              <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n                  stroke=\"currentColor\" class=\"tw-w-6 tw-h-6 cursor-pointer\">\n                <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                      d=\"M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18\"/>\n              </svg>\n              <span v-if=\"$q.platform.is.desktop\" class=\"cursor-pointer tw-font-medium tw-text-sm tw-ml-3\">\n                What's This?\n              </span>\n            </div>\n          </div>\n          <a href=\"https://github.com/incentius-foss/WhatTheDuck\" target=\"_blank\"><q-icon class=\"tw-text-hara hover:tw-text-morehara\" size=\"sm\" name=\"fa-brands fa-github\"/></a>\n        </div>\n      </div>\n    </q-header>\n\n    <q-page-container>\n      <router-view/>\n    </q-page-container>\n  </q-layout>\n</template>\n\n<script>\nimport {defineComponent} from 'vue'\n\nexport default defineComponent({\n  name: 'MainLayout',\n\n  methods: {\n    openPopUp() {\n      this.$bus.emit('openPopUp');\n    },\n  }\n})\n</script>\n"
  },
  {
    "path": "src/pages/ErrorNotFound.vue",
    "content": "<template>\n  <div class=\"fullscreen bg-blue text-white text-center q-pa-md flex flex-center\">\n    <div>\n      <div style=\"font-size: 30vh\">\n        404\n      </div>\n\n      <div class=\"text-h2\" style=\"opacity:.4\">\n        Oops. Nothing here...\n      </div>\n\n      <q-btn\n        class=\"q-mt-xl\"\n        color=\"white\"\n        text-color=\"blue\"\n        unelevated\n        to=\"/\"\n        label=\"Go Home\"\n        no-caps\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  name: 'ErrorNotFound'\n})\n</script>\n"
  },
  {
    "path": "src/pages/IndexPage.vue",
    "content": "<template>\n  <q-page class=\"q-pa-sm\">\n    <q-card class=\"no-border no-shadow\">\n      <q-card-section class=\"q-pa-sm row\">\n        <div class=\"text-h6 col-12\">\n          CSV File\n          <q-uploader\n            label=\"Individual upload\"\n            style=\"max-width: 300px\"\n            @added=\"files\"\n            class=\"float-right\"\n          />\n        </div>\n      </q-card-section>\n      <q-card-section class=\"row\">\n        <div class=\"col-12\">\n          <q-btn label=\"Filter records\" class=\"float-right q-mt-sm q-ml-sm\" @click=\"search\" no-caps></q-btn>\n          <q-input v-model=\"filter\" outlined label=\"Search Duration\" class=\"float-right\"></q-input>\n        </div>\n      </q-card-section>\n      <q-card-section>\n        <q-table\n          :rows=\"rows\"\n          :columns=\"columns\"\n          row-key=\"name\"\n        ></q-table>\n      </q-card-section>\n    </q-card>\n  </q-page>\n</template>\n\n<script>\nimport {defineComponent, ref} from 'vue'\n\n\nexport default defineComponent({\n  name: 'IndexPage',\n  data() {\n    return {\n      file: ref([]),\n      columns: [],\n      rows: [],\n      filter: ''\n    }\n  },\n  async created() {\n    let self = this;\n    const stmt3 = await self.$conn.prepare(`SELECT *\n                                            FROM new_tbl;`);\n    const res3 = await stmt3.query();\n    self.rows = JSON.parse(JSON.stringify(res3.toArray()))\n\n    if (self.rows.length > 0) {\n      Object.keys(self.rows[0]).filter(function (item) {\n        self.columns.push({name: item, align: 'left', label: item, field: item, sortable: true})\n        return item\n      })\n    }\n  },\n  methods: {\n    async files(files) {\n      // console.log(files[0])\n      this.file = files[0]\n      this.columns = []\n      let fileReader = new FileReader();\n      let text = \"\";\n      fileReader.readAsText(this.file)\n      let self = this;\n      fileReader.onload = async function () {\n        text = fileReader.result\n        // console.log(text)\n        await self.$db.registerFileText(\"sample_table.csv\", text);\n        await self.$conn.query(`CREATE TABLE new_tbl AS\n        SELECT *\n        FROM read_csv_auto('sample_table.csv');`);\n        const stmt3 = await self.$conn.prepare(`SELECT *\n                                                FROM new_tbl;`);\n        const res3 = await stmt3.query();\n        self.rows = JSON.parse(JSON.stringify(res3.toArray()))\n\n        if (self.rows.length > 0) {\n          Object.keys(self.rows[0]).filter(function (item) {\n            self.columns.push({name: item, align: 'left', label: item, field: item, sortable: true})\n            return item\n          })\n        }\n        // console.log(\"Statement result (Table):\", JSON.parse(JSON.stringify(res3.toArray())));\n      }\n    },\n    async search() {\n      const q = await this.$conn.prepare(\"SELECT * FROM new_tbl where duration=\" + this.filter);\n      const r = await q.query();\n      this.rows = JSON.parse(JSON.stringify(r.toArray()))\n    }\n  },\n  // async beforeUnmount() {\n  //   await this.$conn.close();\n  //   await this.$db.terminate();\n  //   await this.$worker.terminate();\n  // }\n})\n</script>\n"
  },
  {
    "path": "src/pages/NewIndexPage.vue",
    "content": "<template>\n  <q-drawer v-model=\"openDrawer\" class=\"q-pt-sm tw-bg-secondarybg dd-scroll\" show-if-above>\n    <div class=\"tw-m-5\">\n      <div @dragover.prevent @drop=\"handleDrop\"\n           class=\"tw-flex tw-flex-col tw-gap-2 tw-items-center tw-p-5 tw-bg-tertiarybg tw-rounded-3xl\">\n        <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n             class=\"tw-w-9 tw-h-9 tw-text-primarytext\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                d=\"M12 16.5V9.75m0 0l3 3m-3-3l-3 3M6.75 19.5a4.5 4.5 0 01-1.41-8.775 5.25 5.25 0 0110.233-2.33 3 3 0 013.758 3.848A3.752 3.752 0 0118 19.5H6.75z\"/>\n        </svg>\n        <span class=\"tw-text-primarytext tw-font-medium tw-text-lg\">Drag & Drop Files Here</span>\n        <span class=\"tw-text-primarytext tw-text-xs text-center tw-text-[8px]\">Your data will be processed locally in your browser and won't be sent anywhere.</span>\n        <span class=\"tw-text-primarytext\">or</span>\n        <button @click=\"$refs.uploaderref.pickFiles();\" type=\"button\"\n                class=\"tw-rounded-lg tw-border-2 tw-border-hara tw-bg-transparent tw-px-9 tw-py-2 tw-text-sm tw-font-semibold tw-text-hara hover:tw-bg-secondarybg focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600\">\n          Browse\n        </button>\n      </div>\n      <q-item-label class=\"tw-text-white tw-mt-9 tw-mb-7 tw-text-base tw-font-normal\">My Files</q-item-label>\n      <template v-for=\"(table, index) in tables\" :key=\"index\">\n        <div class=\"tw-mb-0.5 tw-w-full tw-flex tw-items-center hover:tw-bg-tertiarybg tw-rounded-xl tw-py-1 tw-px-3\"\n             :class=\"selection===table.name ? 'tw-bg-tertiarybg' : 'tw-bg-transparent'\">\n          <div @click=\"table['toggle'] = !table['toggle']\" class=\"tw-mr-3 tw-h-full\"\n               :class=\"table['toggle'] ? 'rotate' : ''\">\n            <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n                 stroke=\"currentColor\" class=\"tw-w-5 tw-h-5\"\n                 :class=\"selection===table.name ? 'tw-text-hara' : 'tw-text-white'\">\n              <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M8.25 4.5l7.5 7.5-7.5 7.5\"/>\n            </svg>\n          </div>\n          <div class=\"tw-w-full tw-flex tw-items-center tw-justify-between\">\n            <div class=\"tw-w-10/12 tw-flex tw-items-center tw-cursor-pointer\" @click=\"selectTable(table.name)\">\n              <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n                   stroke=\"currentColor\" class=\"tw-w-5 tw-h-5 tw-mr-3\"\n                   :class=\"selection===table.name ? 'tw-text-hara' : 'tw-text-white'\">\n                <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                      d=\"M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 01-1.125-1.125M3.375 19.5h7.5c.621 0 1.125-.504 1.125-1.125m-9.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-7.5A1.125 1.125 0 0112 18.375m9.75-12.75c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125m19.5 0v1.5c0 .621-.504 1.125-1.125 1.125M2.25 5.625v1.5c0 .621.504 1.125 1.125 1.125m0 0h17.25m-17.25 0h7.5c.621 0 1.125.504 1.125 1.125M3.375 8.25c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m17.25-3.75h-7.5c-.621 0-1.125.504-1.125 1.125m8.625-1.125c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125M12 10.875v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 10.875c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125M13.125 12h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125M20.625 12c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5M12 14.625v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 14.625c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125m0 1.5v-1.5m0 0c0-.621.504-1.125 1.125-1.125m0 0h7.5\"/>\n              </svg>\n              <span style=\"width:138px;\"\n                    class=\"tw-flex-1 tw-text-white tw-text-base tw-overflow-hidden tw-text-ellipsis\">{{\n                  table.name\n                }}</span>\n            </div>\n            <div class=\"tw-w-2/12\" @click=\"deleteTable(table.name, index)\">\n              <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n                   stroke=\"currentColor\" class=\"tw-w-5 tw-h-5 tw-ml-3 tw-text-red-500 hover:tw-text-red-400\">\n                <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                      d=\"M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0\"/>\n              </svg>\n            </div>\n          </div>\n        </div>\n        <q-slide-transition>\n          <div v-show=\"table['toggle']\" class=\"tw-w-full tw-py-1\">\n            <div v-for=\"(col, col_index) in table['children']\" :key=\"col_index\">\n              <div class=\"tw-flex tw-items-center tw-pl-12 tw-my-2\">\n                <q-icon :name=\"col.icon\" size=\"xs\" color=\"white\"/>\n                <span class=\"tw-ml-2 tw-text-white tw-text-sm\">\n                  {{ col.label }}\n                </span>\n              </div>\n            </div>\n          </div>\n        </q-slide-transition>\n      </template>\n      <div v-if=\"tables.length===0\" class=\"tw-flex tw-items-center\">\n        <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n             class=\"tw-w-6 tw-h-6 tw-text-primarytext tw-mr-2\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                d=\"M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z\"/>\n        </svg>\n        <span class=\"tw-text-primarytext\">No files available</span>\n      </div>\n    </div>\n  </q-drawer>\n  <q-uploader\n    label=\"Individual upload\"\n    style=\"max-width: 300px\"\n    @added=\"files\"\n    class=\"float-right tw-hidden\"\n    ref=\"uploaderref\"\n  >\n    <template v-slot:header=\"scope\">\n      <div class=\"row no-wrap items-center q-pa-sm q-gutter-xs\">\n        <q-btn v-if=\"scope.queuedFiles.length > 0\" icon=\"clear_all\" @click=\"scope.removeQueuedFiles\" round dense flat>\n          <q-tooltip>Clear All</q-tooltip>\n        </q-btn>\n        <q-btn v-if=\"scope.uploadedFiles.length > 0\" icon=\"done_all\" @click=\"scope.removeUploadedFiles\" round dense\n               flat>\n          <q-tooltip>Remove Uploaded Files</q-tooltip>\n        </q-btn>\n        <q-spinner v-if=\"scope.isUploading\" class=\"q-uploader__spinner\"/>\n        <div class=\"col\">\n          <div class=\"q-uploader__title\">Upload your files</div>\n          <div class=\"q-uploader__subtitle\">{{ scope.uploadSizeLabel }} / {{ scope.uploadProgressLabel }}</div>\n        </div>\n        <q-btn v-if=\"scope.canAddFiles\" type=\"a\" icon=\"add_box\" @click=\"scope.pickFiles\" round dense flat>\n          <q-uploader-add-trigger/>\n          <q-tooltip>Pick Files</q-tooltip>\n        </q-btn>\n        <q-btn v-if=\"scope.canUpload\" icon=\"cloud_upload\" @click=\"upload\" round dense flat>\n          <q-tooltip>Upload File</q-tooltip>\n        </q-btn>\n\n        <q-btn v-if=\"scope.isUploading\" icon=\"clear\" @click=\"scope.abort\" round dense flat>\n          <q-tooltip>Abort Upload</q-tooltip>\n        </q-btn>\n      </div>\n    </template>\n  </q-uploader>\n  <q-page class=\"q-pa-sm tw-bg-dark tw-flex tw-flex-col\">\n    <q-card-section class=\"tw-flex-1 tw-flex tw-flex-col\">\n      <div v-if=\"$q.platform.is.mobile\">\n        <button type=\"button\"\n                class=\"tw-py-2 tw-px-6 tw-border-hara tw-bg-transparent q-mb-md tw-text-hara tw-rounded-lg tw-border-2\"\n                @click=\"openDrawer=true\" no-caps>Upload\n        </button>\n      </div>\n      <div class=\"tw-h-10 tw-bg-editorborder tw-rounded-t-xl tw-flex tw-items-center tw-justify-between\">\n        <span class=\"tw-text-base tw-text-white tw-ml-3 tw-font-normal\">SQL Editor</span>\n        <span v-if=\"selection!==''\" class=\"tw-text-base tw-text-hara tw-mr-3 tw-font-normal tw-overflow-hidden\">{{\n            selection\n          }}</span>\n      </div>\n      <VAceEditor\n        class=\"dd-scroll\"\n        v-model:value=\"query\"\n        ref=\"editor\"\n        lang=\"sql\"\n        :options=\"{\n        useWorker: true,\n        enableBasicAutocompletion: true,\n        enableSnippets: true,\n        enableLiveAutocompletion: true,\n        customScrollbar: true,\n        fontSize:'1rem'\n      }\"\n        :key=\"counter\"\n        @init=\"initializeEditor\"\n        theme=\"twilight\"\n        style=\"flex: 1 1 0%; min-height:9rem;\"\n      />\n      <div class=\"tw-flex tw-border-t tw-border-editorborder\">\n        <div class=\"tw-h-10 tw-bg-twilightbg tw-rounded-bl-xl tw-flex tw-items-center\"\n             :class=\"$q.platform.is.desktop ? 'tw-w-10/12' : 'tw-w-9/12'\">\n        </div>\n        <div @click=\"search\"\n             class=\"tw-h-10 tw-bg-twilightbg hover:tw-bg-tertiarybg tw-rounded-br-xl tw-flex tw-items-center tw-justify-center tw-border-l tw-border-editorborder\"\n             :class=\"$q.platform.is.desktop ? 'tw-w-2/12': 'tw-w-3/12'\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n               stroke=\"currentColor\" class=\"tw-w-6 tw-h-6 tw-text-hara\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n                  d=\"M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z\"/>\n          </svg>\n          <span class=\"tw-text-sm tw-text-white tw-font-normal\" :class=\"$q.platform.is.desktop ? 'tw-ml-3' : 'tw-ml-2'\">Run</span>\n\n        </div>\n      </div>\n      <!-- <div><q-btn flat color=\"primary\" label=\"Filter records\" class=\"q-ml-lg q-mt-sm\" @click=\"search\" no-caps></q-btn></div> -->\n\n    </q-card-section>\n    <q-card-section class=\"tw-flex-1\">\n      <div class=\"tw-flex tw-justify-end tw-mb-3 tw-gap-3\" v-if=\"view==='table'\">\n        <button @click=\"uploadSampleFile\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          Upload Sample File\n        </button>\n        <button @click=\"importParquetFromUrl\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          Import Parquet URL\n        </button>\n        <button @click=\"download_csv\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          Download Results\n        </button>\n        <button @click=\"view='chart'\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\">\n            <path fill=\"black\" fill-rule=\"evenodd\"\n                  d=\"M2.879 3.879C2 4.757 2 6.172 2 9v6c0 2.828 0 4.243.879 5.121C3.757 21 5.172 21 8 21h8c2.828 0 4.243 0 5.121-.879C22 19.243 22 17.828 22 15V9c0-2.828 0-4.243-.879-5.121C20.243 3 18.828 3 16 3H8c-2.828 0-4.243 0-5.121.879M16 8a1 1 0 0 1 1 1v8a1 1 0 1 1-2 0V9a1 1 0 0 1 1-1m-7 3a1 1 0 1 0-2 0v6a1 1 0 1 0 2 0zm4 2a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0z\"\n                  clip-rule=\"evenodd\"/>\n          </svg>\n        </button>\n      </div>\n      <div class=\"tw-flex tw-justify-end tw-mb-3 tw-gap-3\" v-if=\"view==='chart'\">\n        <!--         Chart Type Bar, Scatter -->\n        <q-select v-model=\"selected_chart_type\" :options=\"chartTypes\" label=\"Chart Type\" outlined dense map-options\n                  @update:model-value=\"chartChange\"\n                  emit-value\n                  class=\"tw-w-1/6\"\n                  color=\"yellow\" dark/>\n\n        <q-select v-model=\"selected_x_column\" :options=\"getXAxisOptions\" label=\"X Axis\" outlined dense\n                  class=\"tw-w-1/6\"\n                  color=\"yellow\" dark/>\n        <q-select v-model=\"selected_y_column\" :options=\"getYAxisOptions\" label=\"Y Axis\" outlined dense\n                  class=\"tw-w-1/6\"\n                  color=\"yellow\" dark/>\n\n        <button @click=\"shareOnTwitter\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\">\n            <path fill=\"black\"\n                  d=\"M22.71 6.29a1 1 0 0 0-1.42 0L20 7.59V2a1 1 0 0 0-2 0v5.59l-1.29-1.3a1 1 0 0 0-1.42 1.42l3 3a1 1 0 0 0 .33.21a.94.94 0 0 0 .76 0a1 1 0 0 0 .33-.21l3-3a1 1 0 0 0 0-1.42M19 13a1 1 0 0 0-1 1v.38l-1.48-1.48a2.79 2.79 0 0 0-3.93 0l-.7.7l-2.48-2.48a2.85 2.85 0 0 0-3.93 0L4 12.6V7a1 1 0 0 1 1-1h8a1 1 0 0 0 0-2H5a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3h12a3 3 0 0 0 3-3v-5a1 1 0 0 0-1-1M5 20a1 1 0 0 1-1-1v-3.57l2.9-2.9a.79.79 0 0 1 1.09 0l3.17 3.17l4.3 4.3Zm13-1a.9.9 0 0 1-.18.53L13.31 15l.7-.7a.77.77 0 0 1 1.1 0L18 17.21Z\"/>\n          </svg>\n        </button>\n\n        <button @click=\"view='table'\" type=\"button\"\n                class=\"tw-rounded-lg tw-bg-hara hover:tw-bg-morehara tw-px-3.5 tw-py-1.5 tw-text-sm tw-font-semibold tw-text-black\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\">\n            <path fill=\"none\" stroke=\"black\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"\n                  d=\"M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm0 5h18M10 3v18\"/>\n          </svg>\n        </button>\n      </div>\n      <q-table v-if=\"view==='table'\"\n               dark\n               flat\n               color=\"#101010\"\n               :rows=\"rows\"\n               row-key=\"name\"\n               style=\"\"\n               class=\"dd-scroll tw-rounded-xl tw-border tw-border-editorborder\"\n      >\n        <template v-slot:header=\"props\">\n          <q-tr :props=\"props\" class=\"tw-bg-primarybg tw-border-b\">\n            <q-th\n              v-for=\"col in props.cols\"\n              :key=\"col.name\"\n              :props=\"props\"\n              class=\"tw-text-sm tw-font-normal tw-text-primarytext\"\n            >\n              {{ col.label }}\n            </q-th>\n          </q-tr>\n        </template>\n        <template v-slot:body=\"props\">\n          <q-tr :props=\"props\" :class=\"props.pageIndex % 2===0 ? 'tw-bg-tablebg' : 'tw-bg-primarybg'\">\n            <q-td\n              v-for=\"col in props.cols\"\n              :key=\"col.name\"\n              :props=\"props\"\n              class=\"tw-text-sm tw-font-normal tw-text-primarytext\"\n            >\n              {{ props.row[col.name] }}\n\n            </q-td>\n          </q-tr>\n        </template>\n      </q-table>\n\n      <VueEcharts v-if=\"view==='chart' && selected_chart_type==='bar'\" class=\"card_style22\" ref=\"barchart\"\n                  :option=\"getBarOptions\" :autoresize=\"true\"\n                  style=\"height: 400px\"></VueEcharts>\n\n      <VueEcharts v-if=\"view==='chart' && selected_chart_type==='scatter'\" class=\"card_style2\" ref=\"scatterchart\"\n                  :option=\"getScatterOptions\" :autoresize=\"true\"\n                  style=\"height: 400px\"></VueEcharts>\n\n    </q-card-section>\n    <div class=\"tw-flex\">\n      <div class=\"tw-flex-grow text-white\">\n        Made with\n        <q-icon name=\"favorite\" size=\"xs\" color=\"red\"/>\n        in India\n      </div>\n      <div class=\"tw-flex text-white\">\n        <span>Powered by DuckDB </span>\n        <div class=\"bg-white q-pa-sm tw-flex-auto q-ml-sm\">\n          <img style=\"width:50px\" class=\"tw-rounded-lg\" src=\"DuckDB_Logo.png\"/>\n        </div>\n      </div>\n    </div>\n\n    <!-- Import Remote File URL Dialog -->\n    <q-dialog v-model=\"importParquetUrlDialog\">\n      <q-card class=\"tw-bg-editorborder q-px-md\" style=\"min-width: 400px;border-radius: 12px;\">\n        <q-card-section>\n          <div class=\"text-h6 tw-text-primarytext\">Import File from URL</div>\n        </q-card-section>\n\n        <q-card-section class=\"q-pt-none\">\n          <q-input\n            v-model=\"parquetUrl\"\n            outlined\n            label=\"Enter URL of Parquet or JSON file\"\n            class=\"tw-bg-[#141414]\"\n            dense\n            dark\n            color=\"hara\"\n          />\n        </q-card-section>\n\n        <q-card-actions align=\"right\" class=\"tw-mb-4\">\n          <q-btn flat label=\"Cancel\" no-caps class=\"q-mr-sm\"  color=\"white\" v-close-popup />\n          <q-btn\n            label=\"Import\"\n            class=\"tw-bg-hara tw-px-20 tw-py-3 tw-font-semibold tw-rounded-lg\"\n            @click=\"processRemoteFileUrl\"\n            no-caps\n            :disable=\"!parquetUrl\"\n          />\n        </q-card-actions>\n      </q-card>\n    </q-dialog>\n\n    <q-dialog v-model=\"getStartedDialog\">\n      <q-card class=\"get-started-card tw-bg-editorborder tw-px-10\">\n        <img src=\"/welcome-duck.png\" alt=\"duck\">\n        <div class=\"row full-width text-center tw-text-primarytext tw-text-2xl tw-font-bold\">\n          Run SQL queries on your CSV|Parquet files in browser\n        </div>\n        <q-card-section class=\"tw-text-primarytext\" style=\"padding:0 20px 0 20px\">\n          <div>\n            <q-carousel\n              v-model=\"slide\"\n              transition-prev=\"scale\"\n              transition-next=\"scale\"\n              swipeable\n              animated\n              control-color=\"white\"\n              prev-icon=\"arrow_left\"\n              next-icon=\"arrow_right\"\n              navigation-icon=\"radio_button_unchecked\"\n              navigation\n              padding\n              arrows\n              height=\"200px\"\n              class=\"tw-bg-editorborder text-white rounded-borders\"\n            >\n              <template v-slot:navigation-icon=\"{ active, btnProps, onClick }\">\n                <q-btn v-if=\"active\" size=\"sm\" icon=\"radio_button_checked\" class=\"tw-text-hara\" flat round dense\n                       @click=\"onClick\"/>\n                <q-btn v-else size=\"xs\" :icon=\"btnProps.icon\" color=\"white\" flat round dense @click=\"onClick\"/>\n              </template>\n              <q-carousel-slide name=\"step_1\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"style\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_1 }}\n                </div>\n              </q-carousel-slide>\n              <q-carousel-slide name=\"step_2\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"live_tv\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_2 }}\n                </div>\n              </q-carousel-slide>\n              <q-carousel-slide name=\"step_3\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"layers\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_3 }}\n                </div>\n              </q-carousel-slide>\n              <q-carousel-slide name=\"step_4\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"terrain\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_4 }}\n                </div>\n              </q-carousel-slide>\n              <q-carousel-slide name=\"step_5\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"terrain\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_5 }}\n                </div>\n              </q-carousel-slide>\n              <q-carousel-slide name=\"step_6\" class=\"column no-wrap flex-center\">\n                <!-- <q-icon name=\"terrain\" size=\"56px\" /> -->\n                <div class=\"q-mt-md text-center tw-text-hara tw-text-base\">\n                  {{ step_6 }}\n                </div>\n              </q-carousel-slide>\n            </q-carousel>\n          </div>\n          <!-- <div class=\"row full-width justify-center tw-text-3xl tw-font-bold\">\n            Welcome!  🎉\n          </div> -->\n          <!-- <div class=\"row full-width justify-center tw-text-lg tw-mt-6\">\n            Unlock the power of lightning-fast analytics and data\n          </div>\n          <div class=\"row full-width justify-center tw-text-lg\">\n            processing with QuackDB, your ultimate data tool.\n          </div> -->\n        </q-card-section>\n        <q-card-actions class=\"justify-center tw-pb-lg\">\n          <button\n            @click=\"getStarted()\"\n            class=\"tw-bg-hara  tw-px-20 tw-py-3 tw-font-semibold tw-rounded-lg\">\n            Get Started\n          </button>\n        </q-card-actions>\n      </q-card>\n    </q-dialog>\n  </q-page>\n</template>\n\n<script>\nimport {defineComponent, ref} from 'vue'\nimport * as XLSX from 'xlsx/xlsx.mjs';\nimport {saveAs} from 'file-saver';\nimport {VAceEditor} from 'vue3-ace-editor';\nimport './ace-config';\nimport sample_csv from '../assets/customers-100.csv?raw';\nimport * as echarts from 'echarts';\nimport VueEcharts from 'vue-echarts'\nimport numeral from \"numeral\";\nimport { DuckDBDataProtocol } from '@duckdb/duckdb-wasm';\n\nexport default defineComponent({\n  name: 'NewIndexPage',\n  data() {\n    return {\n      file: [],\n      columns: [],\n      view: 'table',\n      rows: [],\n      query: '',\n      tables: [], /*contains objects with keys {name, length, columns} */\n      selection: '',\n      getStartedDialog: false,\n      importParquetUrlDialog: false,\n      parquetUrl: '',\n      slide: 'step_1',\n      step_1: 'Upload multiple csv or parquet files to run sql queries',\n      step_2: \"Smart editor to write SQL queries\",\n      step_3: \"Run SQL queries to analyze data\",\n      step_4: \"Download the query result in csv format\",\n      step_5: \"For Bar Chart on X axis select a column with string values and on Y axis select a column with numeric values\",\n      step_6: \"For Scatter Chart on X axis select a column with numeric values and on Y axis select a column with numeric values\",\n      openDrawer: false,\n      tableNameSuggestions: [\"table1\", \"table2\", \"table3\"],\n      counter: 0,\n      sample_csv: sample_csv,\n      string_columns: [],\n      num_columns: [],\n      selected_x_column: '',\n      selected_y_column: '',\n      chartTypes: [\n        {label: 'Bar', value: 'bar'},\n        {label: 'Scatter', value: 'scatter'}\n      ],\n      selected_chart_type: 'bar'\n    }\n  },\n  components: {\n    VAceEditor,\n    VueEcharts\n  },\n  async created() {\n    this.openPopUp();\n    this.$bus.on('openPopUp', this.openPopUp)\n    this.openDrawer = this.$q.platform.is.desktop ? true : false;\n  },\n  methods: {\n    chartChange() {\n      this.selected_x_column = this.getXAxisOptions[0]\n    },\n    shareOnTwitter() {\n      try {\n        if (this.selected_chart_type === 'bar') {\n          const imageDataUrl = this.$refs.barchart.getDataURL({\n            type: 'png',\n            backgroundColor: '#fff',\n            pixelRatio: 2\n          });\n\n          // Download the image file for uploading on Twitter\n          const link = document.createElement(\"a\");\n          link.href = imageDataUrl;\n          link.download = \"result.png\";\n          link.click();\n        } else {\n          const imageDataUrl = this.$refs.scatterchart.getDataURL({\n            type: 'png',\n            backgroundColor: '#fff',\n            pixelRatio: 2\n          });\n\n          // Download the image file for uploading on Twitter\n          const link = document.createElement(\"a\");\n          link.href = imageDataUrl;\n          link.download = \"result.png\";\n          link.click();\n        }\n        // const imageDataUrl = this.$refs.barchart.getDataURL({\n        //   type: 'png',\n        //   backgroundColor: '#fff',\n        //   pixelRatio: 2\n        // });\n        //\n        // // Download the image file for uploading on Twitter\n        // const link = document.createElement(\"a\");\n        // link.href = imageDataUrl;\n        // link.download = \"result.png\";\n        // link.click();\n\n        // Open Twitter share chart\n      } catch (error) {\n        console.error(\"Error capturing chart image: \", error);\n      }\n    },\n    initializeEditor(editor) {\n      let self = this;\n      // Define a custom autocomplete function\n      editor.completers.push({\n        getCompletions: function (editor, session, pos, prefix, callback) {\n          callback(null, self.tables.map(function (table) {\n            return {\n              caption: table.name,\n              value: table.name,\n              meta: \"table\"\n            };\n          }));\n        }\n      });\n      self.tables.filter(function (item) {\n        editor.completers.push({\n          getCompletions: function (editor, session, pos, prefix, callback) {\n            callback(null, item.children.map(function (col) {\n              return {\n                caption: col.label,\n                value: col.label,\n                meta: \"column\"\n              };\n            }));\n          }\n        });\n        return item\n      })\n    },\n    selectTable(name) {\n      this.selection = name\n      this.query = `SELECT *\n                    FROM ${name} LIMIT 10;`\n      this.search();\n    },\n    files(files) {\n      this.file = files[0];\n      this.upload();\n    },\n    async upload() {\n      this.columns = []\n      let name = this.file.name.split(\".\")[0];\n      let fileType = this.file.name.split(\".\")[1].toLowerCase();\n\n      if (!['csv', 'parquet', 'json'].includes(fileType)) {\n        this.$refs.uploaderref.reset();\n        this.$q.notify({\n          type: 'negative',\n          message: `Apologies! At this moment we only support CSV, Parquet, and JSON files.`,\n          position: 'top'\n        });\n        return\n      }\n\n      name = name.replace(/[^a-zA-Z0-9]/g, \"_\");\n      let self = this;\n      let cont = true;\n\n      for (const table of this.tables) {\n        if (table.name === name) {\n          this.$refs.uploaderref.reset();\n          this.$q.notify({type: 'negative', message: `Table with name \"${name}\" Already Exists`, position: 'top'});\n          return;\n        }\n      }\n\n      self.$q.loading.show();\n\n      try {\n        if (fileType === 'csv') {\n          let fileReader = new FileReader();\n          fileReader.readAsText(this.file);\n\n          fileReader.onload = async function () {\n            try {\n              const text = fileReader.result;\n              await self.$db.registerFileText(\"sample_table.csv\", text);\n\n              await self.$conn.query(`CREATE TABLE ${name} AS\n              SELECT *\n              FROM read_csv_auto('sample_table.csv');`);\n\n              await self.processNewTable(name);\n            } catch (error) {\n              console.error('Error processing CSV:', error);\n              self.$q.notify({type: 'negative', message: `Error processing CSV file: ${error.message}`, position: 'top'});\n              self.$q.loading.hide();\n            }\n          };\n\n          fileReader.onerror = function() {\n            self.$q.notify({type: 'negative', message: 'Error reading the file', position: 'top'});\n            self.$q.loading.hide();\n          };\n        } else if (fileType === 'parquet') {\n          try {\n            await this.$db.registerFileHandle(`${name}.parquet`, this.file, DuckDBDataProtocol.BROWSER_FILEREADER, true);\n\n            await this.$conn.query(`CREATE TABLE ${name} AS\n            SELECT *\n            FROM '${name}.parquet';`);\n\n            await this.processNewTable(name);\n          } catch (error) {\n            console.error('Error processing Parquet:', error);\n            this.$q.notify({type: 'negative', message: `Error processing Parquet file: ${error.message}`, position: 'top'});\n            this.$q.loading.hide();\n          }\n        }\n      } catch (error) {\n        console.error('Error in upload:', error);\n        this.$q.notify({type: 'negative', message: `Error uploading file: ${error.message}`, position: 'top'});\n        this.$q.loading.hide();\n      }\n\n      this.$refs.uploaderref.reset();\n    },\n\n    // Helper method to process a newly created table\n    // Open the custom dialog for importing Parquet from URL\n    importParquetFromUrl() {\n      this.parquetUrl = '';\n      this.importParquetUrlDialog = true;\n    },\n\n    // Process the remote file URL (Parquet or JSON) entered by the user\n    async processRemoteFileUrl() {\n      try {\n        if (!this.parquetUrl) return;\n\n        // Close the dialog\n        this.importParquetUrlDialog = false;\n\n        // Generate a table name from the URL\n        const urlParts = this.parquetUrl.split('/');\n        const filename = urlParts.pop();\n        const filenameParts = filename.split('.');\n        let name = filenameParts[0];\n        const fileExtension = filenameParts.length > 1 ? filenameParts.pop().toLowerCase() : '';\n        name = name.replace(/[^a-zA-Z0-9]/g, '_');\n\n        // Check if the file type is supported\n        if (!['parquet', 'csv'].includes(fileExtension)) {\n          this.$q.notify({\n            type: 'negative',\n            message: `Unsupported file type. Only Parquet and CSV files are supported for URL imports.`,\n            position: 'top'\n          });\n          return;\n        }\n\n        // Check if table with this name already exists\n        for (const table of this.tables) {\n          if (table.name === name) {\n            this.$q.notify({type: 'negative', message: `Table with name \"${name}\" already exists`, position: 'top'});\n            return;\n          }\n        }\n\n        this.$q.loading.show({\n          message: `Fetching ${fileExtension.toUpperCase()} file...`\n        });\n\n        try {\n          if (fileExtension === 'parquet') {\n            try {\n              // First attempt: Use direct URL registration method for Parquet files\n              await this.$db.registerFileURL(\n                `${name}.parquet`,\n                this.parquetUrl,\n                DuckDBDataProtocol.HTTP,\n                false // allowFullHttpReads\n              );\n\n              // Create a table from the registered URL Parquet file\n              await this.$conn.query(`CREATE TABLE ${name} AS\n              SELECT *\n              FROM '${name}.parquet';`);\n\n              // Process the newly created table\n              await this.processNewTable(name);\n\n              this.$q.notify({\n                type: 'positive',\n                message: `Successfully imported Parquet file from URL`,\n                position: 'top'\n              });\n\n              this.$q.loading.hide();\n              return;\n            } catch (directUrlError) {\n              console.log('Direct URL registration failed, falling back to fetch method:', directUrlError);\n              // If direct URL registration fails, fall back to fetch method\n            }\n          }\n\n          // Fallback: Try to fetch the file with the browser's fetch API\n          const response = await fetch(this.parquetUrl);\n\n          if (!response.ok) {\n            throw new Error(`HTTP error! Status: ${response.status}`);\n          }\n\n          // Get array buffer from the response\n          const arrayBuffer = await response.arrayBuffer();\n          const uint8Array = new Uint8Array(arrayBuffer);\n\n          if (fileExtension === 'parquet') {\n            // Register the buffer with DuckDB for Parquet\n            await this.$db.registerFileBuffer(`${name}.parquet`, uint8Array);\n\n            // Create a table from the Parquet file\n            await this.$conn.query(`CREATE TABLE ${name} AS\n            SELECT *\n            FROM '${name}.parquet';`);\n          } else if (fileExtension === 'csv') {\n            // For CSV files, convert buffer to text\n            const decoder = new TextDecoder('utf-8');\n            const csvText = decoder.decode(uint8Array);\n\n            // Register the CSV file with DuckDB\n            await this.$db.registerFileText(`${name}.csv`, csvText);\n\n            // Create table from CSV file\n            await this.$conn.query(`CREATE TABLE ${name} AS\n            SELECT *\n            FROM read_csv_auto('${name}.csv');`);\n          }\n\n          // Process the newly created table\n          await this.processNewTable(name);\n\n          this.$q.notify({\n            type: 'positive',\n            message: `Successfully imported ${fileExtension.toUpperCase()} file from URL`,\n            position: 'top'\n          });\n        } catch (fetchError) {\n          console.error('Fetch error:', fetchError);\n\n          // Show a more user-friendly error message about CORS issues\n          if (fetchError.message.includes('NetworkError') ||\n              fetchError.message.includes('CORS') ||\n              fetchError.message.includes('Failed to fetch')) {\n            this.$q.notify({\n              type: 'negative',\n              message: 'The server does not allow direct access to this file due to browser security restrictions (CORS). ' +\n                   'Try downloading the file locally first and then uploading it.',\n              position: 'top',\n              timeout: 7000\n            });\n          } else {\n            this.$q.notify({\n              type: 'negative',\n              message: `Error fetching ${fileExtension.toUpperCase()} file: ${fetchError.message}`,\n              position: 'top'\n            });\n          }\n          this.$q.loading.hide();\n        }\n      } catch (error) {\n        console.error(`Error importing file from URL:`, error);\n        this.$q.notify({\n          type: 'negative',\n          message: `Error importing file: ${error.message}`,\n          position: 'top'\n        });\n        this.$q.loading.hide();\n      }\n    },\n    async processNewTable(name) {\n      try {\n        this.selectTable(name);\n\n        const stmt1 = await this.$conn.prepare(`SELECT CAST(COUNT(*) AS INT) FROM ${name}`);\n        const res1 = await stmt1.query();\n\n        const stmt2 = await this.$conn.prepare(`SELECT COLUMN_NAME, DATA_TYPE\n                                              FROM INFORMATION_SCHEMA.COLUMNS\n                                               WHERE TABLE_NAME = '${name}'`);\n        const res2 = await stmt2.query();\n\n        let len = Object.values(JSON.parse(JSON.stringify(res1.toArray()))[0])[0];\n        let columns = JSON.parse(JSON.stringify(res2.toArray()));\n        console.log(columns);\n\n        this.tables.push({\n          name: name,\n          header: 'root',\n          toggle: false,\n          length: len,\n          children: columns.map((obj) => {\n            let icon = 'tag';\n            if ([\"BIGINT\", \"INTEGER\"].includes(obj['data_type'])) {\n              icon = 'tag';\n            } else if (obj['data_type'] === \"VARCHAR\") {\n              icon = 'abc';\n            } else if (['DATE', \"TIMESTAMP\"].includes(obj['data_type'])) {\n              icon = 'calendar_month';\n            }\n            return {label: obj['column_name'], icon: icon, header: 'generic'};\n          })\n        });\n\n        this.$q.loading.hide();\n        this.counter++;\n      } catch (error) {\n        console.error('Error processing table:', error);\n        this.$q.notify({type: 'negative', message: `Error processing table: ${error.message}`, position: 'top'});\n        this.$q.loading.hide();\n      }\n    },\n    async search() {\n      this.$q.loading.show();\n      try {\n        const q = await this.$conn.prepare(this.query);\n        const r = await q.query();\n        const replacer = (key, value) => {\n          if (typeof value === 'bigint') {\n            return value.toString(); // Convert BigInt to string representation\n          }\n          return value;\n        };\n        this.rows = JSON.parse(JSON.stringify(r.toArray(), replacer))\n        let columns = await this.$conn.query(`PRAGMA table_info(${this.selection});`);\n        let col = JSON.parse(JSON.stringify(columns.toArray(), replacer))\n        this.num_columns = col.filter((col) => {\n          return col['type'] === 'INTEGER' || col['type'] === 'BIGINT' || col['type'] === 'FLOAT' || col['type'] === 'DOUBLE' || col['type'] === 'DECIMAL'\n        })\n        this.string_columns = col.filter((col) => {\n          return col['type'] === 'VARCHAR' || col['type'] === 'TEXT' || col['type'] === 'DATE' || col['type'] === 'TIMESTAMP'\n        })\n        this.selected_x_column = this.string_columns[0]['name']\n        this.selected_y_column = this.num_columns[0]['name']\n        this.$q.loading.hide();\n      } catch (err) {\n        this.$q.loading.hide();\n        this.$q.notify({\n          message: err.message,\n          color: 'negative',\n          textColor: 'white',\n          icon: 'warning',\n          position: 'top',\n        });\n\n      }\n    },\n    async deleteTable(name, index) {\n      const q = await this.$conn.prepare(`DROP TABLE ${name};`);\n      const r = await q.query();\n      this.tables.splice(index, 1);\n      if (this.tables.length === 0) {\n        this.selection = '';\n        this.query = '';\n        this.rows = [];\n      } else {\n        this.selectTable(this.tables[0].name);\n      }\n      this.$q.notify({type: 'positive', message: `Table with name \"${name}\" Deleted!!`, position: 'top'})\n    },\n    handleDrop(e) {\n      e.preventDefault();\n      this.$refs.uploaderref.addFiles(e.dataTransfer.files);\n    },\n    download_csv() {\n      let self = this;\n\n      function s2ab(s) {\n        let buf = new ArrayBuffer(s.length);\n        let view = new Uint8Array(buf);\n        for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;\n        return buf;\n      }\n\n      let data = self.rows\n      const sheet = XLSX.utils.json_to_sheet(data);\n      let wbout = XLSX.write({\n        SheetNames: [\"Sheet1\"],\n        Sheets: {\"Sheet1\": sheet}\n      }, {\n        bookType: 'csv',\n        bookSST: true,\n        type: 'binary'\n      });\n      saveAs(new Blob([s2ab(wbout)], {\n        type: \"application/octet-stream\"\n      }), `${self.selection}.csv`);\n    },\n    openPopUp() {\n      this.getStartedDialog = true;\n    },\n    getStarted() {\n      this.getStartedDialog = false,\n        this.slide = 'step_1';\n    },\n    uploadSampleFile() {\n      const blob = new Blob([this.sample_csv], {type: 'text/csv'});\n      const file = new File([blob], 'sample.csv', {type: 'text/csv'});\n      this.$refs.uploaderref.addFiles([file]);\n    }\n  },\n  computed: {\n    getBarOptions() {\n      return {\n        backgroundColor: '#0b0b0b',\n        grid: {\n          left: '5%',\n          right: '5%',\n          bottom: '20%'\n        },\n        tooltip: {},\n        dataZoom: [{\n          type: 'slider',\n          showDataShadow: false,\n          fillerColor: 'rgba(196, 249, 99)',\n          showDetail: false,\n          height: '8px',\n          handleIcon: 'M20 11C20 15.4183 16.4183 19 12 19C7.58172 19 4 15.4183 4 11C4 6.58172 7.58172 3 12 3C16.4183 3 20 6.58172 20 11Z',\n          handleSize: '200%',\n          handleStyle: {\n            borderColor: 'transparent',\n            color: 'rgba(196, 249, 99)',\n            backgroundColor: 'rgba(196, 249, 99)',\n            borderWidth: 0,\n          },\n          moveHandleStyle: {\n            opacity: 0,\n            color: 'rgba(196, 249, 99)',\n          },\n          dataBackground: {\n            lineStyle: {\n              type: 'dashed',\n              width: '0',\n              opacity: 0\n            },\n            areaStyle: {\n              color: 'rgba(196, 249, 99)'\n            }\n          },\n          selectedDataBackground: {\n            areaStyle: {\n              color: 'rgba(196, 249, 99)'\n            }\n          },\n          bottom: 50,\n          textStyle: {\n            fontSize: 0\n          },\n          show: this.rows.length > 10\n        }],\n        xAxis: {\n          data: this.rows.map((row) => {\n            return row[this.selected_x_column]\n          }),\n          axisLine: {\n            show: false,\n          },\n          axisTick: {\n            show: false\n          },\n        },\n        yAxis: {\n          axisLine: {\n            show: false,\n          },\n          axisTick: {\n            show: false\n          },\n          splitLine: {\n            show: false\n          },\n          axisLabel: {\n            formatter: function (params) {\n              return numeral(params).format('0,0 a').toUpperCase()\n            },\n            fontWeight: 700,\n            fontSize: '11.22px'\n          }\n        },\n        series: [{\n          type: 'bar',\n          itemStyle: {\n            borderRadius: [8, 8],\n            color: 'rgba(196, 249, 99)',\n          },\n          barGap: 0,\n          data: this.rows.map((row) => {\n            return row[this.selected_y_column]\n          })\n        }]\n      }\n    },\n    getXAxisOptions() {\n      if (this.selected_chart_type === 'scatter') {\n        return this.num_columns.map((col) => {\n          return col['name']\n        })\n      }\n      return this.string_columns.map((col) => {\n        return col['name']\n      })\n    },\n    getYAxisOptions() {\n      return this.num_columns.map((col) => {\n        return col['name']\n      })\n    },\n    getScatterOptions() {\n      let self = this;\n      let data = self.rows.map((row) => {\n        return [row[self.selected_x_column], row[self.selected_y_column]]\n      })\n      console.log(data)\n      return {\n        backgroundColor: '#0b0b0b',\n        grid: {\n          left: '5%',\n          right: '5%',\n          bottom: '20%'\n        },\n        tooltip: {},\n        dataZoom: [{\n          type: 'slider',\n          showDataShadow: false,\n          fillerColor: 'rgba(196, 249, 99)',\n          showDetail: false,\n          height: '8px',\n          handleIcon: 'M20 11C20 15.4183 16.4183 19 12 19C7.58172 19 4 15.4183 4 11C4 6.58172 7.58172 3 12 3C16.4183 3 20 6.58172 20 11Z',\n          handleSize: '200%',\n          handleStyle: {\n            borderColor: 'transparent',\n            color: 'rgba(196, 249, 99)',\n            backgroundColor: 'rgba(196, 249, 99)',\n            borderWidth: 0,\n          },\n          moveHandleStyle: {\n            opacity: 0,\n            color: 'rgba(196, 249, 99)',\n          },\n          dataBackground: {\n            lineStyle: {\n              type: 'dashed',\n              width: '0',\n              opacity: 0\n            },\n            areaStyle: {\n              color: 'rgba(196, 249, 99)'\n            }\n          },\n          selectedDataBackground: {\n            areaStyle: {\n              color: 'rgba(196, 249, 99)'\n            }\n          },\n          bottom: 50,\n          textStyle: {\n            fontSize: 0\n          },\n          show: this.rows.length > 10\n        }],\n        xAxis: {\n          axisLine: {\n            show: false,\n          },\n          axisTick: {\n            show: false\n          },\n          splitLine: {\n            show: false\n          },\n        },\n        yAxis: {\n          axisLine: {\n            show: false,\n          },\n          axisTick: {\n            show: false\n          },\n          splitLine: {\n            show: false\n          },\n          axisLabel: {\n            formatter: function (params) {\n              return numeral(params).format('0,0 a').toUpperCase()\n            },\n            fontWeight: 700,\n            fontSize: '11.22',\n          }\n        },\n        series: [{\n          type: 'scatter',\n          itemStyle: {\n            color: 'rgba(196, 249, 99)',\n          },\n          symbolSize: 10,\n          data: self.rows.map((row) => {\n            return [row[self.selected_x_column], row[self.selected_y_column]]\n          })\n        }]\n      }\n    }\n  }\n  // async beforeUnmount() {\n  //   await this.$conn.close();\n  //   await this.$db.terminate();\n  //   await this.$worker.terminate();\n  // }\n})\n</script>\n<style scoped>\n.rotate {\n  transform: rotate(90deg);\n  transition-duration: 0.1s;\n}\n\n.get-started-card {\n  width: 30rem;\n  height: 39rem;\n  border-radius: 50px;\n}\n</style>\n<style>\n.q-field__control {\n  border-radius: 12px !important;\n  background-color: rgba(30, 30, 30) !important;\n}\n\n/*.q-field--dark .q-field__control:before{*/\n/*  border:  0.5px solid rgba(196, 249, 99) !important;*/\n/*}*/\n</style>\n"
  },
  {
    "path": "src/pages/ace-config.ts",
    "content": "import ace from 'ace-builds';\n\nimport modeJsonUrl from 'ace-builds/src-noconflict/mode-json?url';\nace.config.setModuleUrl('ace/mode/json', modeJsonUrl);\n\nimport modeJavascriptUrl from 'ace-builds/src-noconflict/mode-javascript?url';\nace.config.setModuleUrl('ace/mode/javascript', modeJavascriptUrl);\n\nimport modeHtmlUrl from 'ace-builds/src-noconflict/mode-html?url';\nace.config.setModuleUrl('ace/mode/html', modeHtmlUrl);\n\nimport modeYamlUrl from 'ace-builds/src-noconflict/mode-yaml?url';\nace.config.setModuleUrl('ace/mode/yaml', modeYamlUrl);\n\nimport themeGithubUrl from 'ace-builds/src-noconflict/theme-github?url';\nace.config.setModuleUrl('ace/theme/github', themeGithubUrl);\n\nimport themeChromeUrl from 'ace-builds/src-noconflict/theme-chrome?url';\nace.config.setModuleUrl('ace/theme/chrome', themeChromeUrl);\n\nimport themeMonokaiUrl from 'ace-builds/src-noconflict/theme-monokai?url';\nace.config.setModuleUrl('ace/theme/monokai', themeMonokaiUrl);\n\nimport workerBaseUrl from 'ace-builds/src-noconflict/worker-base?url';\nace.config.setModuleUrl('ace/mode/base', workerBaseUrl);\n\nimport workerJsonUrl from 'ace-builds/src-noconflict/worker-json?url';\nace.config.setModuleUrl('ace/mode/json_worker', workerJsonUrl);\n\nimport workerJavascriptUrl from 'ace-builds/src-noconflict/worker-javascript?url';\nace.config.setModuleUrl('ace/mode/javascript_worker', workerJavascriptUrl);\n\nimport workerHtmlUrl from 'ace-builds/src-noconflict/worker-html?url';\nace.config.setModuleUrl('ace/mode/html_worker', workerHtmlUrl);\n\nimport workerYamlUrl from 'ace-builds/src-noconflict/worker-yaml?url';\nace.config.setModuleUrl('ace/mode/yaml_worker', workerYamlUrl);\n\nimport snippetsHtmlUrl from 'ace-builds/src-noconflict/snippets/html?url';\nace.config.setModuleUrl('ace/snippets/html', snippetsHtmlUrl);\n\nimport snippetsJsUrl from 'ace-builds/src-noconflict/snippets/javascript?url';\nace.config.setModuleUrl('ace/snippets/javascript', snippetsJsUrl);\n\nimport snippetsYamlUrl from 'ace-builds/src-noconflict/snippets/yaml?url';\nace.config.setModuleUrl('ace/snippets/javascript', snippetsYamlUrl);\n\nimport snippetsJsonUrl from 'ace-builds/src-noconflict/snippets/json?url';\nace.config.setModuleUrl('ace/snippets/json', snippetsJsonUrl);\n\nimport 'ace-builds/src-noconflict/ext-language_tools';\nace.require(\"ace/ext/language_tools\");"
  },
  {
    "path": "src/router/index.js",
    "content": "import { route } from 'quasar/wrappers'\nimport { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router'\nimport routes from './routes'\n\n/*\n * If not building with SSR mode, you can\n * directly export the Router instantiation;\n *\n * The function below can be async too; either use\n * async/await or return a Promise which resolves\n * with the Router instance.\n */\n\nexport default route(function (/* { store, ssrContext } */) {\n  const createHistory = process.env.SERVER\n    ? createMemoryHistory\n    : (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory)\n\n  const Router = createRouter({\n    scrollBehavior: () => ({ left: 0, top: 0 }),\n    routes,\n\n    // Leave this as is and make changes in quasar.conf.js instead!\n    // quasar.conf.js -> build -> vueRouterMode\n    // quasar.conf.js -> build -> publicPath\n    history: createHistory(process.env.VUE_ROUTER_BASE)\n  })\n\n  return Router\n})\n"
  },
  {
    "path": "src/router/routes.js",
    "content": "\nconst routes = [\n  {\n    path: '/',\n    component: () => import('layouts/MainLayout.vue'),\n    children: [\n      { path: '', component: () => import('pages/NewIndexPage.vue') }\n    ]\n  },\n\n  // Always leave this as last one,\n  // but you can also remove it\n  {\n    path: '/:catchAll(.*)*',\n    component: () => import('pages/ErrorNotFound.vue')\n  }\n]\n\nexport default routes\n"
  },
  {
    "path": "tailwind.config.js",
    "content": "module.exports = {\n  content: [\"./src/**/*.{html,js,vue}\"],\n  prefix:'tw-',\n  theme: {\n    extend: {\n      colors: {\n        'primarybg' : '#101010',\n        'secondarybg': '#0D0F10',\n        'tertiarybg': '#1E1E1E',\n        'dark': \"#0B0B0B\",\n        'editorborder':'#202020',\n        'tablebg':'#181818',\n        'twilightbg':'#141414',\n        'primarytext': \"#DFDEDF\",\n        'secondarytext': '#666666',\n        'help': '#386ED2',\n        'setting': '#9542A1',\n        'hara': '#C4F963',\n        'morehara':'#b5f83a'\n      }\n    },\n  },\n  plugins: [],\n}\n"
  }
]