sail 2.0.0 → 2.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5cb3d0b65f8654c0f82c7dcff00375753965fb57e55e947cafe23a0c004deac1
-  data.tar.gz: b5199b7c4e649dad94d1406a0a8e224e18f3a7bb2ca3ec89c952b1221ca06887
+  metadata.gz: 84449cebafe90a7aa0dae586434269c0ec7fa5c6a51d31f6e43c75b268d85270
+  data.tar.gz: 0ae5335fbd7fd3508d05664d26e14d6039aa050b48d2114ce12bac1db28344cb
 SHA512:
-  metadata.gz: 3bc7d9ec0e753f6eb847b50b1f813f238fe95690ce39435010efa52580a0499d9013d835c6cbcdde4a7d6542febbc553888b22836b3fe5cc1143a9e9b4ec0c53
-  data.tar.gz: d66d0ea6d5e16333fd0342cc90acaa94080385f01e48e0e2ba33b4a57e7d044c4c008448739520383c0628d04e8c9290b3d1ba19b12ca2dcf1f2e646db1a48fa
+  metadata.gz: 797c7a62670ff99331b5f83fa99eff2061ed37960c5be69299ce1e80b9840bf622e9c5ba9757054a734be8a9e70d361afc2cdf0c4f4cbc942e74f1697fb6b886
+  data.tar.gz: 42f1994cde100baf48d8c5e979e21bb80ceef6759e277498e564b8f7a0227352e692c699099320d700e9c40411d8e45f8fb19662379e3821fa1dac11ca25e6ab

data/README.md

@@ -14,8 +14,6 @@ Enable/Disable a new feature, turn ON/OFF ab testing for new functionality, chan
 
 It comes with a lightweight responsive admin dashboard for searching and changing configurations on the fly.
 
-Searching can be done by group, cast type or name.
-
 ## Installation
 Add this line to your application's Gemfile:
 
@@ -56,6 +54,8 @@ Sail.configure do |config|
   config.dashboard_auth_lambda = nil      # Defines an authorization lambda to access the dashboard as a before action. Rendering or redirecting is included here if desired.
   config.back_link_path = 'root_path'     # Path method as string for the "Main app" button in the dashboard. Any non-existent path will make the button disappear
   config.enable_search_auto_submit = true # Enables search auto submit after 2 seconds without typing
+  config.days_until_stale = 60            # Days with no updates until a setting is considered stale and is a candidate to be removed from code (leave nil to disable checks)
+  config.enable_logging = true            # Enable logging for update and reset actions. Logs include timestamp, setting name, new value and author_user_id (if current_user is defined)
 end
 ```
 
@@ -93,6 +93,22 @@ second_setting:
   group: feature_flags
 ``` 
 
+To clear the database and reload the contents of your sail.yml file, invoke this rake task.
+
+```bash
+$ rake sail:load_defaults
+```
+
+## Searching
+
+Searching for settings in the dashboard can be done in the following ways:
+
+* By name: matches a substring of the setting's name
+* By group: matches all settings with the same group (exact match)
+* By cast type: matches all settings with the same cast type (exact match)
+* By stale: type 'stale' and get all settings that haven't been updated in X days (X is defined in the configuration)
+* By recent: type 'recent X' where X is the number of hours and get all settings that have been updated since X hours ago
+
 ## Manipulating settings in the code
 
 Settings can be read or set via their interface. Notice that when reading a setting's value, it will be cast to the appropriate type using the "cast_type" field.

data/Rakefile

@@ -20,4 +20,8 @@ require "rspec/core/rake_task"
 RSpec::Core::RakeTask.new(spec: "app:db:test:prepare")
 task default: :spec
 
+task :all do
+  system("brakeman && rake && rubocop && rails_best_practices")
+end
+
 system("cd ./spec/dummy; RAILS_ENV=test rails db:environment:set; cd ../..") if Rails::VERSION::MAJOR >= 5

data/app/assets/images/sail/angle-left.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="angle-left" class="svg-inline--fa fa-angle-left fa-w-8" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path fill="currentColor" d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"></path></svg>

data/app/assets/images/sail/angle-right.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="angle-right" class="svg-inline--fa fa-angle-right fa-w-8" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path fill="currentColor" d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"></path></svg>

data/app/assets/images/sail/link.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="external-link-alt" class="svg-inline--fa fa-external-link-alt fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M576 24v127.984c0 21.461-25.96 31.98-40.971 16.971l-35.707-35.709-243.523 243.523c-9.373 9.373-24.568 9.373-33.941 0l-22.627-22.627c-9.373-9.373-9.373-24.569 0-33.941L442.756 76.676l-35.703-35.705C391.982 25.9 402.656 0 424.024 0H552c13.255 0 24 10.745 24 24zM407.029 270.794l-16 16A23.999 23.999 0 0 0 384 303.765V448H64V128h264a24.003 24.003 0 0 0 16.97-7.029l16-16C376.089 89.851 365.381 64 344 64H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V287.764c0-21.382-25.852-32.09-40.971-16.97z"></path></svg>

data/app/assets/images/sail/refresh.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="sync" class="svg-inline--fa fa-sync fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M440.935 12.574l3.966 82.766C399.416 41.904 331.674 8 256 8 134.813 8 33.933 94.924 12.296 209.824 10.908 217.193 16.604 224 24.103 224h49.084c5.57 0 10.377-3.842 11.676-9.259C103.407 137.408 172.931 80 256 80c60.893 0 114.512 30.856 146.104 77.801l-101.53-4.865c-6.845-.328-12.574 5.133-12.574 11.986v47.411c0 6.627 5.373 12 12 12h200.333c6.627 0 12-5.373 12-12V12c0-6.627-5.373-12-12-12h-47.411c-6.853 0-12.315 5.729-11.987 12.574zM256 432c-60.895 0-114.517-30.858-146.109-77.805l101.868 4.871c6.845.327 12.573-5.134 12.573-11.986v-47.412c0-6.627-5.373-12-12-12H12c-6.627 0-12 5.373-12 12V500c0 6.627 5.373 12 12 12h47.385c6.863 0 12.328-5.745 11.985-12.599l-4.129-82.575C112.725 470.166 180.405 504 256 504c121.187 0 222.067-86.924 243.704-201.824 1.388-7.369-4.308-14.176-11.807-14.176h-49.084c-5.57 0-10.377 3.842-11.676 9.259C408.593 374.592 339.069 432 256 432z"></path></svg>

data/app/assets/images/sail/sort.svg

@@ -0,0 +1 @@
+<svg aria-hidden="true" data-prefix="fas" data-icon="sort-amount-down" class="svg-inline--fa fa-sort-amount-down fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M187.298 395.314l-79.984 80.002c-6.248 6.247-16.383 6.245-22.627 0L4.705 395.314C-5.365 385.244 1.807 368 16.019 368H64V48c0-8.837 7.163-16 16-16h32c8.837 0 16 7.163 16 16v320h47.984c14.241 0 21.363 17.264 11.314 27.314zM240 96h256c8.837 0 16-7.163 16-16V48c0-8.837-7.163-16-16-16H240c-8.837 0-16 7.163-16 16v32c0 8.837 7.163 16 16 16zm-16 112v-32c0-8.837 7.163-16 16-16h192c8.837 0 16 7.163 16 16v32c0 8.837-7.163 16-16 16H240c-8.837 0-16-7.163-16-16zm0 256v-32c0-8.837 7.163-16 16-16h64c8.837 0 16 7.163 16 16v32c0 8.837-7.163 16-16 16h-64c-8.837 0-16-7.163-16-16zm0-128v-32c0-8.837 7.163-16 16-16h128c8.837 0 16 7.163 16 16v32c0 8.837-7.163 16-16 16H240c-8.837 0-16-7.163-16-16z"></path></svg>

data/app/assets/javascripts/settings.js.erb

@@ -8,6 +8,8 @@ let submitTimer, submitInterval, intervals = 1;
 let queryElement = document.getElementById("query");
 let autoSearchEnabled = "<%= Sail.configuration.enable_search_auto_submit %>";
 let progress = document.getElementById("search-submit-progress");
+let menu = document.getElementById("sort-menu");
+let orderButton = document.getElementById("btn-order");
 
 function submitSearch() {
     document.getElementById("search-form").submit();
@@ -31,11 +33,32 @@ function afterTypingQuery() {
     submitInterval = setInterval(advanceProgress, 20);
 }
 
+function toggleSortMenu() {
+    if (menu.style.display === "none") {
+        menu.style.display = "block";
+    } else {
+        menu.style.display = "none";
+    }
+}
+
+function handleGenericClick(event) {
+    let target = event.target;
+
+    if (target === menu || menu.contains(target) || target === orderButton || orderButton.contains(target)) {
+        return;
+    }
+
+    menu.style.display = "none";
+}
+
 if (autoSearchEnabled === "true") {
     queryElement.addEventListener("keyup", afterTypingQuery);
     queryElement.addEventListener("keydown", clearTimer);
 }
 
+orderButton.addEventListener("click", toggleSortMenu);
+document.body.addEventListener("click", handleGenericClick);
+
 /*
 Refresh related functions
  */

data/app/assets/stylesheets/sail/application.scss

@@ -64,10 +64,10 @@ html, body {
     color: $main_black;
     text-decoration: none;
     background-color: white;
-    padding: 15px;
-    -webkit-border-radius: 30px;
-    -moz-border-radius: 30px;
-    border-radius: 30px;
+    padding: 20px;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
     font-weight: bold;
 
@@ -77,14 +77,21 @@ html, body {
     }
   }
 
-  .link-holder {
-    margin-bottom: 45px;
-
+  .page-links {
     a {
-      padding: 15px 100px 15px 100px;
-      -webkit-border-radius: 5px;
-      -moz-border-radius: 5px;
-      border-radius: 5px;
+      font-size: 1.2rem;
+      margin: 0 2px 0 2px;
+    }
+
+    #angle-left-link {
+      background: white url(angle-left.svg) center no-repeat;
+      margin-right: 6px;
+      padding: 20px 24px 20px 24px;
+    }
+  
+    #angle-right-link {
+      background: white url(angle-right.svg) center no-repeat;
+      padding: 20px 24px 20px 24px;
     }
   }
 }

data/app/assets/stylesheets/sail/settings.scss

@@ -74,6 +74,10 @@
       &.group-label {
         background-color: $cerulean;
       }
+
+      &.stale-label {
+        background-color: $bright_red;
+      }
     }
 
     .label-container {
@@ -97,7 +101,7 @@
       font-size: 18px;
       outline: none;
       border: none;
-      border-bottom: 2px solid darken($aluminium, 30%);
+      border-bottom: 2px solid $aluminium;
       -webkit-transition : border .25s ease-in;
       -moz-transition : border .25s ease-in;
       -o-transition : border .25s ease-in;
@@ -113,7 +117,7 @@
       position: relative;
       bottom: 10px;
       border: none;
-      border-bottom: 2px solid darken($aluminium, 30%);
+      border-bottom: 2px solid $aluminium;
       width: 100%;
       text-align: center;
       font-size: 18px;
@@ -134,7 +138,7 @@
       opacity: 0.7;
       -webkit-transition: .2s;
       transition: opacity .2s;
-      margin-bottom: 10px;
+      margin: 0 0 10px 0;
 
       &::-webkit-slider-thumb {
         -webkit-appearance: none;
@@ -241,6 +245,7 @@
       border: none;
       outline: none;
       float: left;
+      background: transparent;
 
       img {
         height: 30px;
@@ -264,26 +269,123 @@
     }
   }
 
-  #search-form {
-    text-align: center;
-    padding-top: 25px;
+  #search-container {
+    #search-form {
+      text-align: center;
+      padding-top: 25px;
+
+      #query {
+        height: 50px;
+        width: 100%;
+        -webkit-border-radius: 5px;
+        -moz-border-radius: 5px;
+        border-radius: 5px;
+        border: 3px solid transparent;
+        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
+        font-size: 18px;
+        text-align: center;
+        -webkit-transition : border .25s ease-in;
+        -moz-transition : border .25s ease-in;
+        -o-transition : border .25s ease-in;
+        transition : border .25s ease-in;
+
+        &:focus {
+          border: 3px solid $tangerine;
+        }
+      }
+    }
 
-    #query {
+    .offset-container {
+      float: left;
+      width: 25%;
       height: 50px;
+    }
+
+    .inner-container {
       width: 50%;
+      float: left;
+    }
+
+    #btn-order {
+      float: left;
+      margin: 25px 0 0 15px;
+      outline: none;
+      border: 3px solid transparent;
+      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
       -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
       border-radius: 5px;
+      -webkit-transition : border .25s ease-in;
+      -moz-transition : border .25s ease-in;
+      -o-transition : border .25s ease-in;
+      transition : border .25s ease-in;
+      height: 58px;
+      background: white;
+
+      img {
+        height: 100%;
+      }
+
+      &:hover {
+        border: 3px solid $tangerine;
+      }
+    }
+
+    #sort-menu {
+      background: white;
+      position: absolute;
+      left: 50%;
+      top: 25%;
+      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
+      -webkit-border-radius: 5px;
+      -moz-border-radius: 5px;
+      border-radius: 5px;
+      -webkit-animation: fadeIn 0.5s;
+      animation: fadeIn 0.5s;
+      padding: 10px;
+
+      @media (min-width: 767px) { top: 16%; left: 60%; }
+      @media (min-width: 992px) { top: 12%; left: 65%; }
+      @media (min-width: 1200px) { top: 18%; left: 70%; }
+
+      button {
+        outline: none;
+        border: none;
+        width: 100%;
+        font-size: 20px;
+        font-family: 'Raleway', sans-serif;
+        background: transparent;
+        padding: 5px;
+        -webkit-border-radius: 5px;
+        -moz-border-radius: 5px;
+        border-radius: 5px;
+
+        &:hover {
+          background-color: $tangerine;
+        }
+      }
+    }
+
+    #main-app-link {
+      float: left;
+      margin: 25px 0 0 8px;
+      height: 53px;
       border: 3px solid transparent;
       box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
-      font-size: 18px;
-      text-align: center;
+      -webkit-border-radius: 5px;
+      -moz-border-radius: 5px;
+      border-radius: 5px;
       -webkit-transition : border .25s ease-in;
       -moz-transition : border .25s ease-in;
       -o-transition : border .25s ease-in;
       transition : border .25s ease-in;
+      background: white;
 
-      &:focus {
+      img {
+        height: 100%;
+      }
+
+      &:hover {
         border: 3px solid $tangerine;
       }
     }
@@ -320,11 +422,12 @@
 
     #search-submit-progress {
       display: none;
-      width: 50%;
+      width: 100%;
       -webkit-appearance: none;
       height: 3px;
       position: relative;
       bottom: 22px;
+      left: 3px;
 
       &::-webkit-progress-bar {
         box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;

data/app/controllers/sail/settings_controller.rb

@@ -1,13 +1,17 @@
 # frozen_string_literal: true
 
+require_dependency "sail/application_controller"
+
 module Sail
   # SettingsController
   # This is the main controller for settings
   # Implements all actions for the dashboard
   # and for the JSON API
   class SettingsController < ApplicationController
+    after_action :log_update, only: %i[update reset], if: -> { Sail.configuration.enable_logging && @successful_update }
+
     def index
-      @settings = Setting.by_query(s_params[:query])
+      @settings = Setting.by_query(s_params[:query]).ordered_by(s_params[:order_field])
       @number_of_pages = (@settings.count.to_f / Sail::Setting::SETTINGS_PER_PAGE).ceil
       @settings = @settings.paginated(s_params[:page])
       fresh_when(@settings)
@@ -60,7 +64,16 @@ module Sail
 
     def s_params
       params.permit(:page, :query, :name,
-                    :value, :positive, :negative, :throttled_by)
+                    :value, :positive, :negative,
+                    :throttled_by, :order_field)
+    end
+
+    def log_update
+      message = +"#{DateTime.now.strftime("%Y/%m/%d %H:%M")} [Sail] #{action_name.capitalize} setting='#{@setting.name}' " \
+                 "value='#{@setting.value}'"
+
+      message << " author_user_id=#{current_user.id}" if defined?(current_user)
+      Rails.logger.info(message)
     end
   end
 end

data/app/models/sail/setting.rb

@@ -35,10 +35,12 @@ module Sail
     }
 
     scope :by_query, lambda { |query|
-      if cast_types.key?(query)
+      if cast_types.key?(query) || query == Sail::ConstantCollection::STALE
         send(query)
       elsif select(:id).by_group(query).exists?
         by_group(query)
+      elsif query.to_s.include?(Sail::ConstantCollection::RECENT)
+        recently_updated(query.delete("recent ").strip)
       else
         by_name(query)
       end
@@ -46,6 +48,9 @@ module Sail
 
     scope :by_group, ->(group) { where(group: group) }
     scope :by_name, ->(name) { name.present? ? where("name LIKE ?", "%#{name}%") : all }
+    scope :stale, -> { where("updated_at < ?", Sail.configuration.days_until_stale.days.ago) }
+    scope :recently_updated, ->(amount) { where("updated_at >= ?", amount.to_i.hours.ago) }
+    scope :ordered_by, ->(field) { column_names.include?(field) ? order("#{field}": :desc) : all }
 
     def self.get(name)
       Rails.cache.fetch("setting_get_#{name}", expires_in: Sail.configuration.cache_life_span) do
@@ -124,6 +129,12 @@ module Sail
       name.gsub(/[^a-zA-Z\d]/, " ").titleize
     end
 
+    def stale?
+      return unless Sail.configuration.days_until_stale.present?
+
+      updated_at < Sail.configuration.days_until_stale.days.ago
+    end
+
     private
 
     def model_exists

data/app/views/sail/settings/_search.html.erb

@@ -1,7 +1,26 @@
-<%= form_tag(settings_path, method: :get, id: "search-form") do %>
-  <input type="text" name="query" id="query" placeholder="<%= I18n.t("sail.search_placeholder") %>">
-<% end %>
+<div id="search-container">
+  <div class="offset-container"></div>
 
-<div id="progress-container">
-  <progress id="search-submit-progress" value="0" max="100"></progress>
+  <div class="inner-container">
+    <%= form_tag(settings_path, method: :get, id: "search-form") do %>
+      <input type="text" name="query" id="query"
+             placeholder="<%= I18n.t("sail.search_placeholder") %>"
+             title="<%= I18n.t("sail.search_tooltip") %>">
+    <% end %>
+
+    <div id="progress-container">
+      <progress id="search-submit-progress" value="0" max="100"></progress>
+    </div>
+  </div>
+
+  <button id="btn-order" title="<%= I18n.t("sail.order_button_tooltip") %>"><%= image_tag("sail/sort.svg") %></button>
+  <%= render(partial: "sort_menu") %>
+
+  <% if main_app.respond_to?(Sail.configuration.back_link_path.to_s) %>
+    <%= link_to(main_app.method(Sail.configuration.back_link_path).call, method: :get, id: "main-app-link", title: I18n.t("sail.main_app")) do %>
+      <%= image_tag("sail/link.svg") %>
+    <% end %>
+  <% end %>
+
+  <div class="clearfix"></div>
 </div>