Add Customize More button back to item pages

Oh right, forgot about this lol!

The specific effect on Impress 2020 where the button label expands is,
kinda hard to implement in normal CSS/JS, and so I'm not in the mood
and I'm settling for the `title` attribute lol

app/assets/stylesheets/items/_show.sass

@@ -40,6 +40,23 @@ body.items-show
 
   .preview-area
     margin: 0 auto
+    position: relative
+
+    .customize-more
+      position: absolute
+      top: 1em
+      right: 1em
+
+      display: flex
+      align-items: center
+      text-decoration: none
+
+      background: #EDF2F7
+      padding: .75em
+      border-radius: .375em
+      min-height: 2rem
+      min-width: 2rem
+      box-sizing: border-box
 
   outfit-viewer
     display: block

app/helpers/application_helper.rb

@@ -101,6 +101,12 @@ module ApplicationHelper
     "matchu@openneo.net"
   end
 
+  EDIT_ICON_SVG_SOURCE = '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></g>'.html_safe
+  def edit_icon(alt: "Edit")
+    content_tag :svg, EDIT_ICON_SVG_SOURCE, alt:, class: "icon",
+      viewBox: "0 0 24 24", style: "width: 1em; height: 1em"
+  end
+
   # SVG icon source from Chakra UI!
   EXTERNAL_LINK_SVG_SOURCE = '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><path d="M15 3h6v6"></path><path d="M10 14L21 3"></path></g>'.html_safe
   def external_link_icon

app/models/outfit.rb

@@ -1,9 +1,15 @@
 class Outfit < ApplicationRecord
   has_many :item_outfit_relationships, :dependent => :destroy
+
   has_many :worn_item_outfit_relationships, -> { where(is_worn: true) },
     class_name: 'ItemOutfitRelationship'
   has_many :worn_items, through: :worn_item_outfit_relationships, source: :item
 
+  has_many :closeted_item_outfit_relationships, -> { where(is_worn: false) },
+    class_name: 'ItemOutfitRelationship'
+  has_many :closeted_items, through: :closeted_item_outfit_relationships,
+                            source: :item
+
   belongs_to :alt_style, optional: true
   belongs_to :pet_state, optional: true # We validate presence below!
   belongs_to :user, optional: true
@@ -231,6 +237,18 @@ class Outfit < ApplicationRecord
     (pet_layers + item_layers).sort_by(&:depth)
   end
 
+  def wardrobe_params
+    {
+      name: name,
+      color: color_id,
+      species: species_id,
+      pose: pose,
+      state: pet_state_id,
+      objects: worn_item_ids,
+      closet: closeted_item_ids,
+    }
+  end
+
   def ensure_unique_name
     # If no name was provided, start with "Untitled outfit".
     self.name = "Untitled outfit" if name.blank?

app/views/items/show.html.haml

@@ -19,6 +19,10 @@
     = render partial: "outfit_viewer", locals: {outfit: @preview_outfit}
     .error-indicator
       💥 We couldn't load all of this outfit. Try again?
+    = link_to wardrobe_path(params: @preview_outfit.wardrobe_params),
+              class: "customize-more", target: "_blank",
+              title: "Customize more", "aria-label": "Customize more" do
+      = edit_icon
 
   %species-color-picker
     = form_for item_path(@item), method: :get, data: {"is-valid": @preview_error.nil?} do |f|