Add cached id query for color scale default and reset button

Author: rossta

app/controllers/color_themes_controller.rb

@@ -5,7 +5,8 @@ def show
 
     render ColorThemes::ShowView.new(
       color_scale: @color_scale,
-      curated_color_scales: curated_color_scales
+      curated_color_scales: curated_color_scales,
+      selected: params[:id].present?
     )
   end
 end

app/models/color_scale.rb

@@ -28,12 +28,13 @@ def self.curated
   end
 
   def self.cached_curated
-    cached_ids = Rails.cache.read("curated_color_scale_ids")
+    cache_key = "curated_color_scale_ids"
+    cached_ids = Rails.cache.read(cache_key)
 
     return where(id: cached_ids) if cached_ids
 
     curated.tap do |collection|
-      Rails.cache.write("curated_color_scale_ids", collection.map(&:id))
+      Rails.cache.write(cache_key, collection.map(&:id))
     end
   end
 
@@ -45,6 +46,17 @@ def self.find_or_create_default
     end
   end
 
+  def self.cached_default
+    cache_key = "default_color_scale_id"
+    cached_id = Rails.cache.read(cache_key)
+
+    return where(id: cached_id).first if cached_id
+
+    where(name: APP_DEFAULT[:name]).first.tap do |cs|
+      Rails.cache.write("default_color_scale_id", cs.id)
+    end
+  end
+
   def set_weight(weight, value)
     raise ArgumentError, "Invalid weight: #{weight}" unless VALID_WEIGHTS.include?(weight.to_s)
 

app/views/color_themes/show_view.rb

@@ -4,44 +4,62 @@ class ColorThemes::ShowView < ApplicationView
   include Phlex::Rails::Helpers::FormWith
   include Phlex::Rails::Helpers::LinkTo
 
-  def initialize(color_scale:, curated_color_scales: [])
+  def initialize(color_scale:, curated_color_scales: [], selected: false)
     @color_scale = color_scale
     @curated_color_scales = curated_color_scales
+    @selected = selected
   end
 
   def view_template
     render Pages::Header.new(title: "Settings: Color Theme")
     div(class: "section-content container py-gap") do
-      h3 { @color_scale.display_name }
-      div(class: "color-theme color-theme:#{@color_scale.name.parameterize}") do
-        @color_scale.weights.each do |weight, color|
-          div(class: "color-swatch color-swatch__weight:#{weight}", style: "background-color: #{color.hex}") do
-            div(class: "color-swatch__weight") { weight }
-            div(class: "color-swatch__color") { color.hex.delete("#").upcase }
-          end
-        end
-      end
-
       h3 { "Want to try a different color theme?" }
+
       p { "You can preview and save your desired color theme for this site. We have curated some options for you below." }
 
-      form_with(url: color_theme_path, method: :get) do |f|
+      form_with(url: url_for, method: :get) do |f|
         fieldset(class: "flex items-center") do
           f.select :id,
             @curated_color_scales.map { |cs| [cs.display_name, cs.id] },
             {
-              prompt: "Pick one!"
+              prompt: "Pick one!",
+              selected: (@selected ? @color_scale.id : nil)
             },
+            # requestSubmit and Turbo
             # https://stackoverflow.com/questions/68624668/how-can-i-submit-a-form-on-input-change-with-turbo-streams
             onchange: "this.form.requestSubmit()",
             class: "mr-2 bg-gray-50 border border-gray-300 text-small rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
 
-          whitespace
-          span(class: "mr-2 font-small") { "OR" }
-          whitespace
-          link_to "I feel lucky!", color_theme_path(id: @curated_color_scales.sample.id), class: "button primary"
+          span(class: "mr-2 text-small") { "OR" }
+          link_to "I feel lucky!", url_for(id: @curated_color_scales.sample.id), class: "button primary mr-2"
+          if @selected
+            span(class: "mr-2 text-small") { unsafe_raw "&bull;" }
+            link_to "Reset to default", url_for, class: "button secondary"
+          end
         end
       end
+
+      h3 { display_name }
+      div(class: "color-theme color-theme:#{@color_scale.name.parameterize}") do
+        @color_scale.weights.each do |weight, color|
+          div(class: "color-swatch color-swatch__weight:#{weight}", style: "background-color: #{color.hex}") do
+            div(class: "color-swatch__weight") { weight }
+            div(class: "color-swatch__color") { color.hex.delete("#").upcase }
+          end
+        end
+      end
+    end
+  end
+
+  private
+
+  def default_color_scale? = @color_scale.id == ColorScale.cached_default.id
+
+  def display_name
+    if default_color_scale?
+      "#{@color_scale.display_name} (default)"
+    else
+      @color_scale.display_name
     end
   end
 end