Vite and tsc

apps/sqltools/src/assets/styles/app/_base.scss

@@ -1,10 +1,10 @@
 // Fonts
-$material-icons-font-path: '~material-icons/iconfont/';
+$material-icons-font-path: 'material-icons/iconfont/';
 $font-family:        'Roboto';
 $font-family-mono:   'Source Code Pro';
 $base-font-size:      1rem; // ~14px
 
-@import '~material-icons/iconfont/material-icons.scss';
+@import 'material-icons/iconfont/material-icons.scss';
 
 *, *:after, *:before {
   box-sizing: border-box;
@@ -19,4 +19,4 @@ $base-font-size:      1rem; // ~14px
 body {
   font-size: 1rem;
   background: $theme-bg;
-}
+}

apps/sqltools/src/assets/styles/themes/dark/variables.scss

@@ -1,4 +1,4 @@
-$material-icons-font-path: '~material-icons/iconfont/';
+$material-icons-font-path: 'material-icons/iconfont/';
 
 // Theme
 // ---------------------------

apps/sqltools/src/assets/styles/themes/light/theme.scss

@@ -1,4 +1,4 @@
-@import "~codemirror/theme/xq-light";
+@import "codemirror/theme/xq-light";
 @import "./app/vendor/codemirror";
 
 
@@ -177,7 +177,7 @@ select {
 
 
 .tabulator-row {
-  &.inserted, 
+  &.inserted,
   &.inserted:hover {
     background: $row-add;
   }
@@ -266,4 +266,4 @@ select {
 // Switch
 x-switch {
   color: darken($theme-primary, 10%);
-}
+}

apps/studio/electron-builder.js

@@ -0,0 +1,148 @@
+
+const fpmOptions = [
+  "--after-install=build/deb-postinstall"
+]
+
+module.exports = {
+  appId: "io.beekeeperstudio.desktop",
+  productName: "Beekeeper Studio",
+  releaseInfo: {
+    releaseNotesFile: "build/release-notes.md"
+  },
+  files: [
+    'dist/**/*',
+    'package.json',
+    'public/icons/**/*',
+    '!**/node_gyp_bins/*'
+
+  ],
+  afterSign: "electron-builder-notarize",
+  afterPack: "./build/afterPack.js",
+  extraResources: [
+    {
+      from: './extra_resources/demo.db',
+      to: 'demo.db'
+    },
+    {
+      from: 'build/launcher-script.sh',
+      to: 'launcher-script.sh'
+    },
+    {
+      from: './vendor',
+      to: 'vendor'
+    },
+    {
+      from: './public',
+      to: 'public'
+    }
+  ],
+  fileAssociations: [
+    {
+      ext: 'db',
+      name: 'SQLite db file',
+      mimeType: 'application/vnd.sqlite3',
+    },
+    {
+      ext: 'sqlite3',
+      name: 'SQLite sqlite3 file',
+      mimeType: 'application/vnd.sqlite3'
+    },
+    {
+      ext: 'sqlite',
+      name: 'SQLite sqlite file',
+      mimeType: 'application/vnd.sqlite3'
+    }
+  ],
+  protocols: [
+    {
+      name: "Amazon Redshift URL scheme",
+      schemes: ["redshift"],
+      role: "Editor"
+    },
+    {
+      name: "CockroachDB URL scheme",
+      schemes: ["cockroachdb", "cockroach"],
+      role: "Editor"
+    },
+    {
+      name: "MariaDB URL scheme",
+      schemes: ["mariadb"],
+      role: "Editor"
+    },
+    {
+      name: "TiDB URL scheme",
+      schemes: ["tidb"],
+      role: "Editor"
+    },
+    {
+      name: "MySQL URL scheme",
+      schemes: ["mysql"],
+      role: "Editor"
+    },
+    {
+      name: "PostgreSQL URL scheme",
+      schemes: ["postgresql", "postgres", "psql"],
+      role: "Editor"
+    },
+    {
+      name: "SQLite URL scheme",
+      schemes: ["sqlite"],
+      role: "Editor"
+    },
+    {
+      name: "SQL Server URL scheme",
+      schemes: ["sqlserver", "microsoftsqlserver", "mssql"],
+      role: "Editor"
+    }
+  ],
+  mac: {
+    entitlements: "./build/entitlements.mac.plist",
+    entitlementsInherit: "./build/entitlements.mac.plist",
+    icon: './public/icons/mac/bk-icon.icns',
+    category: "public.app-category.developer-tools",
+    "hardenedRuntime": true,
+    publish: ['github']
+  },
+  linux: {
+    icon: './public/icons/png/',
+    category: "Development",
+    target: [
+      'snap',
+      'deb',
+      'appImage'
+    ],
+    desktop: {
+      'StartupWMClass': 'beekeeper-studio'
+    },
+  },
+  deb: {
+    publish: [
+      'github'
+    ],
+    fpm: fpmOptions,
+    // when we upgrade Electron we need to check these
+    depends: ["libgtk-3-0", "libnotify4", "libnss3", "libxss1", "libxtst6", "xdg-utils", "libatspi2.0-0", "libuuid1", "libsecret-1-0", "gnupg"]
+  },
+  appImage: {
+    publish: ['github'],
+  },
+  snap: {
+    publish: [
+      'github',
+      'snapStore'
+    ],
+    environment: {
+      "ELECTRON_SNAP": "true"
+    },
+    plugs: ["default", "ssh-keys", "removable-media", "mount-observe"]
+  },
+  win: {
+    icon: './public/icons/png/512x512.png',
+    target: ['nsis', 'portable'],
+    publish: ['github'],
+    sign: "./build/win/sign.js",
+  },
+  portable: {
+    "artifactName": "${productName}-${version}-portable.exe",
+  }
+}

apps/studio/esbuild.mjs

@@ -0,0 +1,168 @@
+#!/usr/bin/env node
+import esbuild from 'esbuild';
+import vuePlugin from 'esbuild-vue'
+import {sassPlugin} from 'esbuild-sass-plugin'
+import { copy } from 'esbuild-plugin-copy';
+import postcss from 'postcss'
+import copyAssets from 'postcss-copy-assets';
+import { spawn } from 'child_process'
+import path from 'path';
+const isWatching = process.argv[2] === 'watch';
+
+
+
+
+
+const externals = ['better-sqlite3', 'sqlite3',
+        'sequelize', 'reflect-metadata',
+        'cassandra-driver', 'mysql2', 'ssh2', 'bks-oracledb', 'mysql',
+        'oracledb', '@electron/remote', "@google-cloud/bigquery",
+        'pg-query-stream', 'electron'
+
+      ]
+
+let electron = null
+
+const tabulatorPlugin = {
+  name: 'tabulator-tables resolver',
+  setup(build) {
+    build.onResolve({ filter: /^tabulator-tables$/ }, async (args) => {
+      const result = await build.resolve('../../node_modules/tabulator-tables/dist/js/tabulator_esm.js', {
+        kind: 'import-statement',
+        resolveDir: path.dirname(args.path),
+      })
+
+      if (result.errors.length > 0) {
+        return { errors: result.errors }
+      }
+
+      return {
+        path: result.path
+      }
+    });
+  },
+}
+
+
+const electronMainPlugin = {
+  name: "electron-main-process-restarter",
+  setup(build) {
+    if (!isWatching) return
+    build.onStart(() => console.log("ESBUILD: Building Main 🏗"))
+    build.onEnd(() => {
+      console.log("ESBUILD: Built Main ✅")
+      if (electron) {
+        process.kill(electron.pid, 'SIGINT')
+      }
+      // start electron again
+      electron = spawn(path.join('../../node_modules/electron/dist/electron'), ['.'], { stdio: 'inherit' })
+
+    })
+  }
+}
+
+const electronRendererPlugin = {
+  name: 'example',
+  setup(build) {
+    if (!isWatching) return
+    build.onStart(() => {
+      console.log("ESBUILD: Building Renderer 🏗")
+    })
+    build.onEnd(async (result) => {
+      console.log("ESBUILD: Built Renderer ✅")
+      if (electron) {
+        process.kill(electron.pid, 'SIGUSR2')
+      }
+    })
+  },
+}
+
+
+  const commonArgs = {
+    platform: 'node',
+    publicPath: '.',
+    outdir: 'dist',
+    bundle: true,
+    external: [...externals, '*.woff', '*.woff2', '*.ttf', '*.svg', '*.png'],
+    sourcemap: isWatching,
+    minify: !isWatching
+  }
+
+  const mainArgs = {
+    ...commonArgs,
+    entryPoints: ['src/background.ts'],
+    plugins: [electronMainPlugin,
+    copy({
+      resolveFrom: 'cwd',
+      assets: [
+        {
+          from: ['./src/index.html'],
+          to: './dist/'
+        },
+      ]
+    })]
+  }
+
+  const rendererArgs = {
+    ...commonArgs,
+    entryPoints: ['src/main.ts'],
+    plugins: [
+      tabulatorPlugin,
+      electronRendererPlugin,
+      vuePlugin(),
+      copy({
+        resolveFrom: "cwd",
+        assets: [{
+          from: ['../../node_modules/material-icons/**/*.woff*'],
+          to: ['./dist/material-icons']
+        },
+          {
+            from: './src/assets/logo.svg',
+            to: 'dist/assets/'
+          },
+        {
+          from: './src/assets/fonts/**/*',
+          to: 'dist/fonts'
+        },
+          {
+            from: './src/assets/icons/**/*',
+            to: 'dist/icons'
+          },
+          {
+            from: './src/assets/images/**/*',
+            to: 'dist/images'
+          },
+        {
+          from: '../../node_modules/typeface-roboto/**/*.woff*',
+          to: './dist/'
+        },
+      {
+            from: '../../node_modules/xel/**/*.svg',
+            to: './dist/node_modules/xel'
+          },
+        ]
+
+      }),
+      sassPlugin({
+        async transform(source, resolveDir, filePath) {
+          const { css } = await postcss().use(copyAssets({ base: `dist` })).process(source, { from: filePath, to: `dist/main.css` });
+          return css;
+        }
+      }),
+
+    ]
+  }
+
+
+
+  if(isWatching) {
+    const main = await esbuild.context(mainArgs)
+    const renderer = await esbuild.context(rendererArgs)
+    Promise.all([main.watch(), renderer.watch()])
+  } else {
+    Promise.all([
+      esbuild.build(mainArgs),
+      esbuild.build(rendererArgs)
+    ])
+  }
+// launch electron