sqlui 0.1.28 → 0.1.29

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 580bda7206a3282d1dd0dae3754daa8bdf53b3522c5210a0e2542147d3a13aee
-  data.tar.gz: 6fcfca4ed80216ef293f72e8be9e59896dbd82eb3da76f5761ad3671fa16c32b
+  metadata.gz: 9257bcf43bc98bcd5ed8a52d3b2643db1189d0d3b8c2c1444c5d949ff37ed03c
+  data.tar.gz: 6a96de39b01459a5b222a2781158523707fbd3e585400dd18a1b4469c55b4c9c
 SHA512:
-  metadata.gz: 6ffaff0a56fd85efbf3c3fe69fad3c5f4750b23defc7716004420fb4fa9243983d6a105dbbe81892c3cf859332530920ab88f4312a9ffb7009e6d46103e3dd9d
-  data.tar.gz: 94cea75b430cfe9289f28fc9eaaa9a5cdd026945d0fb2e66616cfcc0e6bcd3845fcfcc205ad9b047274e81f50c71313f004fe35ba0fc167216c06a9211c04317
+  metadata.gz: 32eb854b16a9b345456902379ec7cc8ba5e091562a62de90451f63d28146815a880315b0921303770233d036187d8b26f6164bf04e8dd935232bf3a6ef82e646
+  data.tar.gz: 0da14c2be2b04171df6ccef8dc4e4fb1c512440371d2394ae788ecc88994e032bf69633e683bab61e0cc4bc54ae367cb0ce6565cfc4b3f67559b90061ddbdaf9

data/.version

@@ -1 +1 @@
-0.1.28
+0.1.29

data/app/args.rb

@@ -9,6 +9,10 @@ class Args
     value
   end
 
+  def self.fetch_non_empty_int(hash, key)
+    fetch_non_nil(hash, key, Integer)
+  end
+
   def self.fetch_non_empty_hash(hash, key)
     value = fetch_non_nil(hash, key, Hash)
     raise ArgumentError, "required parameter #{key} empty" if value.empty?
@@ -23,9 +27,13 @@ class Args
     raise ArgumentError, "required parameter #{key} null" if value.nil?
 
     if classes.size.positive? && !classes.find { |clazz| value.is_a?(clazz) }
-      raise ArgumentError, "required parameter #{key} not a #{classes[0].to_s.downcase}" if classes.size == 1
+      if classes.size != 1
+        raise ArgumentError, "required parameter #{key} not #{classes.map(&:to_s).map(&:downcase).join(' or ')}"
+      end
 
-      raise ArgumentError, "required parameter #{key} not #{classes.map(&:to_s).map(&:downcase).join(' or ')}"
+      class_name = classes[0].to_s.downcase
+      class_name = %w[a e i o u].include?(class_name[0]) ? "an #{class_name}" : "a #{class_name}"
+      raise ArgumentError, "required parameter #{key} not #{class_name}"
     end
 
     value

data/app/deep.rb

@@ -7,6 +7,10 @@ module Enumerable
     self
   end
 
+  def deep_symbolize_keys!
+    deep_transform_keys!(&:to_sym)
+  end
+
   def deep_dup(result = {})
     map do |value|
       value.respond_to?(:deep_dup) ? value.deep_dup : value.clone
@@ -18,11 +22,15 @@ end
 # Deep extensions for Hash.
 class Hash
   def deep_transform_keys!(&block)
-    transform_keys!(&:to_s)
+    transform_keys!(&block)
     each_value { |value| value.deep_transform_keys!(&block) if value.respond_to?(:deep_transform_keys!) }
     self
   end
 
+  def deep_symbolize_keys!
+    deep_transform_keys!(&:to_sym)
+  end
+
   def deep_dup(result = {})
     each do |key, value|
       result[key] = value.respond_to?(:deep_dup) ? value.deep_dup : value.clone
@@ -55,4 +63,15 @@ class Hash
       self.[](path[0]).deep_delete(*path[1..])
     end
   end
+
+  def deep_merge!(hash)
+    hash.each do |key, value|
+      if self[key].is_a?(Hash) && value.is_a?(Hash)
+        self[key].deep_merge!(value)
+      else
+        self[key] = value
+      end
+    end
+    self
+  end
 end

data/app/server.rb

@@ -5,7 +5,6 @@ require 'json'
 require 'sinatra/base'
 require 'uri'
 require_relative 'database_metadata'
-require_relative 'environment'
 require_relative 'mysql_types'
 require_relative 'sql_parser'
 require_relative 'sqlui'
@@ -15,8 +14,8 @@ class Server < Sinatra::Base
   def self.init_and_run(config, resources_dir)
     set :logging,         true
     set :bind,            '0.0.0.0'
-    set :port,            Environment.server_port
-    set :env,             Environment.server_env
+    set :port,            config.port
+    set :environment,     config.environment
     set :raise_errors,    false
     set :show_exceptions, false
 
@@ -41,18 +40,18 @@ class Server < Sinatra::Base
       get "#{database.url_path}/sqlui.css" do
         @css ||= File.read(File.join(resources_dir, 'sqlui.css'))
         status 200
-        headers 'Content-Type': 'text/css'
+        headers 'Content-Type' => 'text/css'
         body @css
       end
 
       get "#{database.url_path}/sqlui.js" do
         @js ||= File.read(File.join(resources_dir, 'sqlui.js'))
         status 200
-        headers 'Content-Type': 'text/javascript'
+        headers 'Content-Type' => 'text/javascript'
         body @js
       end
 
-      get "#{database.url_path}/metadata" do
+      post "#{database.url_path}/metadata" do
         metadata = database.with_client do |client|
           {
             server: "#{config.name} - #{database.display_name}",
@@ -77,7 +76,7 @@ class Server < Sinatra::Base
           }
         end
         status 200
-        headers 'Content-Type': 'application/json'
+        headers 'Content-Type' => 'application/json'
         body metadata.to_json
       end
 
@@ -114,21 +113,21 @@ class Server < Sinatra::Base
         result[:query] = full_sql
 
         status 200
-        headers 'Content-Type': 'application/json'
+        headers 'Content-Type' => 'application/json'
         body result.to_json
       end
 
       get(%r{#{Regexp.escape(database.url_path)}/(query|graph|structure|saved)}) do
         @html ||= File.read(File.join(resources_dir, 'sqlui.html'))
         status 200
-        headers 'Content-Type': 'text/html'
+        headers 'Content-Type' => 'text/html'
         body @html
       end
     end
 
     error do |e|
       status 500
-      headers 'Content-Type': 'application/json'
+      headers 'Content-Type' => 'application/json'
       message = e.message.lines.first&.strip || 'unexpected error'
       message = "#{message[0..80]}…" if message.length > 80
       result = {
@@ -145,7 +144,7 @@ class Server < Sinatra::Base
 
   def client_error(message, stacktrace: nil)
     status(400)
-    headers('Content-Type': 'application/json')
+    headers 'Content-Type' => 'application/json'
     body({ error: message, stacktrace: stacktrace }.compact.to_json)
   end
 

data/app/sqlui_config.rb

@@ -1,17 +1,20 @@
 # frozen_string_literal: true
 
 require 'yaml'
-require_relative 'database_config'
 require_relative 'args'
+require_relative 'database_config'
+require_relative 'deep'
 
 # App config including database configs.
 class SqluiConfig
-  attr_reader :name, :list_url_path, :database_configs
+  attr_reader :name, :port, :environment, :list_url_path, :database_configs
 
-  def initialize(filename)
-    config = YAML.safe_load(ERB.new(File.read(filename)).result)
-    deep_symbolize!(config)
+  def initialize(filename, overrides = {})
+    config = YAML.safe_load(ERB.new(File.read(filename)).result).deep_merge!(overrides)
+    config.deep_symbolize_keys!
     @name = Args.fetch_non_empty_string(config, :name).strip
+    @port = Args.fetch_non_empty_int(config, :port)
+    @environment = Args.fetch_non_empty_string(config, :environment).strip
     @list_url_path = Args.fetch_non_empty_string(config, :list_url_path).strip
     raise ArgumentError, 'list_url_path should start with a /' unless @list_url_path.start_with?('/')
     if @list_url_path.length > 1 && @list_url_path.end_with?('/')
@@ -30,15 +33,4 @@ class SqluiConfig
 
     config
   end
-
-  private
-
-  def deep_symbolize!(object)
-    return object unless object.is_a? Hash
-
-    object.transform_keys!(&:to_sym)
-    object.each_value { |child| deep_symbolize!(child) }
-
-    object
-  end
 end

data/client/resources/sqlui.css

@@ -322,3 +322,9 @@ select {
     0% { transform: rotate(0deg); }
     100% { transform: rotate(360deg); }
 }
+
+.result-time {
+    font-family: monospace;
+    color: #333;
+    font-size: 14px;
+}

data/client/resources/sqlui.html

@@ -40,6 +40,7 @@
 
     <div id="fetch-sql-box" class="fetch-sql-box tab-content-element graph-element query-element" style="display: none;">
       <div id="result-loader" class="loader"></div>
+      <p id="result-time" class="result-time"></p>
     </div>
 
     <div id="saved-box" class="saved-box tab-content-element saved-element" style="display: none;">

data/client/resources/sqlui.js

@@ -23963,10 +23963,10 @@
    function selectTab (event, tab) {
      const url = new URL(window.location);
      setTabInUrl(url, tab);
-     route(event.target, event, url);
+     route(event.target, event, url, true);
    }
 
-   function route (target = null, event = null, url = null) {
+   function route (target = null, event = null, url = null, internal = false) {
      if (url) {
        if (event) {
          event.preventDefault();
@@ -24004,10 +24004,10 @@
 
      switch (window.tab) {
        case 'query':
-         selectResultTab();
+         selectResultTab(internal);
          break
        case 'graph':
-         selectGraphTab();
+         selectGraphTab(internal);
          break
        case 'saved':
          selectSavedTab();
@@ -24158,21 +24158,21 @@
      });
    }
 
-   function selectGraphTab () {
+   function selectGraphTab (internal) {
      document.getElementById('query-box').style.display = 'flex';
      document.getElementById('submit-box').style.display = 'flex';
      document.getElementById('graph-box').style.display = 'flex';
      document.getElementById('graph-status').style.display = 'flex';
      document.getElementById('fetch-sql-box').style.display = 'none';
      document.getElementById('cancel-button').style.display = 'none';
-     maybeFetchResult();
+     maybeFetchResult(internal);
 
      const selection = getSelection();
      focus();
      setSelection(selection);
    }
 
-   function selectResultTab () {
+   function selectResultTab (internal) {
      document.getElementById('query-box').style.display = 'flex';
      document.getElementById('submit-box').style.display = 'flex';
      document.getElementById('result-box').style.display = 'flex';
@@ -24182,7 +24182,7 @@
      const selection = getSelection();
      focus();
      setSelection(selection);
-     maybeFetchResult();
+     maybeFetchResult(internal);
    }
 
    function selectSavedTab () {
@@ -24212,7 +24212,7 @@
        viewLinkElement.href = viewUrl.pathname + viewUrl.search;
        viewLinkElement.addEventListener('click', function (event) {
          clearResult();
-         route(event.target, event, viewUrl);
+         route(event.target, event, viewUrl, true);
        });
 
        const runUrl = new URL(window.location.origin + window.location.pathname);
@@ -24226,7 +24226,7 @@
        runLinkElement.href = runUrl.pathname + runUrl.search;
        runLinkElement.addEventListener('click', function (event) {
          clearResult();
-         route(event.target, event, runUrl);
+         route(event.target, event, runUrl, true);
        });
 
        const nameElement = document.createElement('h2');
@@ -24296,20 +24296,21 @@
        url.searchParams.delete('run');
      }
 
-     route(target, event, url);
+     route(target, event, url, true);
    }
 
    function clearResult () {
-     const existingFetch = window.sqlFetch;
-     if (existingFetch?.state === 'pending') {
-       existingFetch.state = 'aborted';
-       existingFetch.fetchController.abort();
+     if (window.sqlFetch?.state === 'pending' || window.sqlFetch?.spinner === 'always') {
+       window.sqlFetch.state = 'aborted';
+       window.sqlFetch.spinner = 'never';
+       window.sqlFetch.fetchController.abort();
+       displaySqlFetch(window.sqlFetch);
+       return
      }
      window.sqlFetch = null;
-
+     clearSpinner();
      clearGraphBox();
      clearGraphStatus();
-
      clearResultBox();
      clearResultStatus();
    }
@@ -24336,7 +24337,30 @@
      }
    }
 
-   function fetchSql (sqlFetch, selection, callback) {
+   function updateResultTime (sqlFetch) {
+     if (window.sqlFetch === sqlFetch) {
+       if (sqlFetch.state === 'pending' || sqlFetch.spinner === 'always') {
+         displaySqlFetch(sqlFetch);
+         setTimeout(() => { updateResultTime(sqlFetch); }, 500);
+       }
+     }
+   }
+
+   function fetchSql (sqlFetch) {
+     window.sqlFetch = sqlFetch;
+     updateResultTime(sqlFetch);
+     setTimeout(function () {
+       if (window.sqlFetch === sqlFetch && sqlFetch.state === 'pending') {
+         window.sqlFetch.spinner = 'always';
+         displaySqlFetch(sqlFetch);
+         setTimeout(function () {
+           if (window.sqlFetch === sqlFetch) {
+             window.sqlFetch.spinner = 'if_pending';
+             displaySqlFetch(sqlFetch);
+           }
+         }, 400); // If we display a spinner, ensure it is displayed for at least 400 ms
+       }
+     }, 300); // Don't display the spinner unless the response takes more than 300 ms
      fetch('query', {
        headers: {
          Accept: 'application/json',
@@ -24345,7 +24369,7 @@
        method: 'POST',
        body: JSON.stringify({
          sql: sqlFetch.sql,
-         selection
+         selection: sqlFetch.selection
        }),
        signal: sqlFetch.fetchController.signal
      })
@@ -24368,14 +24392,14 @@
                  sqlFetch.error_message = 'failed to execute query';
                }
              }
-             callback(sqlFetch);
+             displaySqlFetch(sqlFetch);
            });
          } else {
            response.text().then((result) => {
              sqlFetch.state = 'error';
              sqlFetch.error_message = 'failed to execute query';
              sqlFetch.error_details = result;
-             callback(sqlFetch);
+             displaySqlFetch(sqlFetch);
            });
          }
        })
@@ -24385,42 +24409,32 @@
            sqlFetch.error_message = 'failed to execute query';
            sqlFetch.error_details = error;
          }
-         callback(sqlFetch);
+         displaySqlFetch(sqlFetch);
        });
    }
 
-   function maybeFetchResult () {
+   function maybeFetchResult (internal) {
      const url = new URL(window.location);
      const params = url.searchParams;
      const sql = params.get('sql');
      const file = params.get('file');
      const selection = params.get('selection');
-     const run = ['1', 'true'].includes(params.get('run')?.toLowerCase());
+     const hasSqluiReferrer = document.referrer && new URL(document.referrer).origin === url.origin;
+
+     // Only allow auto-run if coming from another SQLUI page. The idea here is to let the app link to URLs with run=true
+     // but not other apps. This allows meta/shift-clicking to run a query.
+     let run = false;
+     if (params.has('run')) {
+       run = (internal || hasSqluiReferrer) && ['1', 'true'].includes(params.get('run')?.toLowerCase());
+       url.searchParams.delete('run');
+       window.history.replaceState({}, '', url);
+     }
 
      if (params.has('file') && params.has('sql')) {
        // TODO: show an error.
        throw new Error('You can only specify a file or sql, not both.')
      }
 
-     const sqlFetch = {
-       fetchController: new AbortController(),
-       state: 'pending',
-       sql,
-       file,
-       selection
-     };
-
-     if (params.has('file')) {
-       const fileDetails = window.metadata.saved[params.get('file')];
-       if (!fileDetails) {
-         throw new Error(`no such file: ${params.get('file')}`)
-       }
-       sqlFetch.file = file;
-       sqlFetch.sql = fileDetails.contents;
-     } else if (params.has('sql')) {
-       sqlFetch.sql = sql;
-     }
-
      const existingRequest = window.sqlFetch;
      if (existingRequest) {
        const selectionMatches = selection === existingRequest.selection;
@@ -24439,14 +24453,11 @@
 
      clearResult();
 
+     const sqlFetch = buildSqlFetch(sql, file, selection);
      if (params.has('sql') || params.has('file')) {
        setValue(sqlFetch.sql);
        if (run) {
-         url.searchParams.delete('run');
-         window.history.replaceState({}, '', url);
-         window.sqlFetch = sqlFetch;
-         displaySqlFetch(sqlFetch);
-         fetchSql(sqlFetch, selection, displaySqlFetch);
+         fetchSql(sqlFetch);
        }
      }
      if (params.has('selection')) {
@@ -24455,12 +24466,42 @@
      }
    }
 
+   function buildSqlFetch (sql, file, selection) {
+     const sqlFetch = {
+       fetchController: new AbortController(),
+       state: 'pending',
+       startedAt: window.performance.now(),
+       spinner: 'never',
+       finished: null,
+       sql,
+       file,
+       selection
+     };
+
+     if (file) {
+       const fileDetails = window.metadata.saved[file];
+       if (!fileDetails) {
+         throw new Error(`no such file: ${file}`)
+       }
+       sqlFetch.file = file;
+       sqlFetch.sql = fileDetails.contents;
+     } else if (sql) {
+       sqlFetch.sql = sql;
+     }
+
+     return sqlFetch
+   }
+
    function displaySqlFetchInResultTab (fetch) {
-     if (fetch.state === 'pending') {
+     if (fetch.state === 'pending' || fetch.spinner === 'always') {
        clearResultBox();
-       document.getElementById('cancel-button').style.display = 'flex';
-       document.getElementById('result-box').style.display = 'none';
-       document.getElementById('fetch-sql-box').style.display = 'flex';
+       if (fetch.spinner === 'never') {
+         document.getElementById('result-box').style.display = 'flex';
+         clearSpinner();
+       } else {
+         document.getElementById('result-box').style.display = 'none';
+         displaySpinner(fetch);
+       }
        return
      }
 
@@ -24470,6 +24511,7 @@
 
      if (fetch.state === 'aborted') {
        clearResultBox();
+       document.getElementById('result-status').innerText = 'query cancelled';
        return
      }
 
@@ -24544,12 +24586,44 @@
      }
    }
 
+   function clearSpinner () {
+     document.getElementById('cancel-button').style.display = 'none';
+     document.getElementById('fetch-sql-box').style.display = 'none';
+   }
+
+   function displaySpinner (fetch) {
+     document.getElementById('cancel-button').style.display = 'flex';
+     document.getElementById('fetch-sql-box').style.display = 'flex';
+
+     const elapsed = window.performance.now() - fetch.startedAt;
+     const seconds = Math.floor((elapsed / 1000) % 60);
+     const minutes = Math.floor((elapsed / 1000 / 60) % 60);
+     let display = `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
+     if (elapsed >= 1000 * 60 * 60) {
+       const hours = Math.floor((elapsed / 1000 / 60 / 60) % 24);
+       display = `${hours.toString().padStart(2, '0')}:${display}`;
+       if (elapsed >= 1000 * 60 * 60 * 24) {
+         const days = Math.floor(elapsed / 1000 / 60 / 60 / 24);
+         if (days === 1) {
+           display = `${days} day ${display}`;
+         } else {
+           display = `${days.toLocaleString()} days ${display}`;
+         }
+       }
+     }
+     document.getElementById('result-time').innerText = display;
+   }
+
    function displaySqlFetchInGraphTab (fetch) {
-     if (fetch.state === 'pending') {
+     if (fetch.state === 'pending' || fetch.spinner === 'always') {
        clearGraphBox();
-       document.getElementById('cancel-button').style.display = 'flex';
-       document.getElementById('graph-box').style.display = 'none';
-       document.getElementById('fetch-sql-box').style.display = 'flex';
+       if (fetch.spinner === 'never') {
+         document.getElementById('graph-box').style.display = 'flex';
+         clearSpinner();
+       } else {
+         document.getElementById('graph-box').style.display = 'none';
+         displaySpinner(fetch);
+       }
        return
      }
 
@@ -24559,6 +24633,7 @@
 
      if (fetch.state === 'aborted') {
        clearGraphBox();
+       document.getElementById('graph-status').innerText = 'query cancelled';
        return
      }
 
@@ -24647,7 +24722,7 @@
          headers: {
            Accept: 'application/json'
          },
-         method: 'GET'
+         method: 'POST'
        })
      ])
        .then((results) => {

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: sqlui
 version: !ruby/object:Gem::Version
-  version: 0.1.28
+  version: 0.1.29
 platform: ruby
 authors:
 - Nick Dower
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-11-01 00:00:00.000000000 Z
+date: 2022-11-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: mysql2
@@ -24,20 +24,6 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '0.0'
-- !ruby/object:Gem::Dependency
-  name: puma
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '6.0'
-  type: :runtime
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '6.0'
 - !ruby/object:Gem::Dependency
   name: sinatra
   requirement: !ruby/object:Gem::Requirement
@@ -53,19 +39,19 @@ dependencies:
       - !ruby/object:Gem::Version
         version: '3.0'
 - !ruby/object:Gem::Dependency
-  name: puma
+  name: webrick
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '6.0'
-  type: :development
+        version: '1.0'
+  type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '6.0'
+        version: '1.0'
 - !ruby/object:Gem::Dependency
   name: rspec-core
   requirement: !ruby/object:Gem::Requirement
@@ -136,20 +122,6 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '4.0'
-- !ruby/object:Gem::Dependency
-  name: watir
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '7.0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '7.0'
 description: A SQL UI.
 email: nicholasdower@gmail.com
 executables:
@@ -162,7 +134,6 @@ files:
 - app/database_config.rb
 - app/database_metadata.rb
 - app/deep.rb
-- app/environment.rb
 - app/mysql_types.rb
 - app/server.rb
 - app/sql_parser.rb

data/app/environment.rb

@@ -1,23 +0,0 @@
-# frozen_string_literal: true
-
-# Parses and provides access to environment variables.
-class Environment
-  APP_ENV = ENV.fetch('APP_ENV', 'development').to_sym
-  APP_PORT = ENV.fetch('APP_PORT', 8080)
-
-  def self.server_env
-    APP_ENV
-  end
-
-  def self.development?
-    APP_ENV == :development
-  end
-
-  def self.production?
-    APP_ENV == :production
-  end
-
-  def self.server_port
-    APP_PORT
-  end
-end