feat(shop): add 'Made by a teen' banner to shop items

app/assets/stylesheets/components/_shop-item-card.scss

@@ -66,6 +66,24 @@
           var(--color-brand-highlight) transparent;
       }
     }
+
+    &--teen-creator {
+      background: var(--color-brand-orange);
+      color: var(--color-space-bg);
+      cursor: pointer;
+      transition: filter 0.2s ease;
+
+      &::after {
+        border-color: var(--color-brand-orange) transparent
+          var(--color-brand-orange) transparent;
+      }
+
+      &:hover,
+      &:focus-visible {
+        filter: brightness(1.05);
+        outline: none;
+      }
+    }
   }
 
   &__star {
@@ -279,4 +297,14 @@
       display: none;
     }
   }
+
+  &--stacked-ribbons {
+    .shop-item-card__ribbon--teen-creator {
+      top: 48px;
+    }
+
+    .shop-item-card__sale-badge {
+      top: 84px;
+    }
+  }
 }

app/components/shop_item_card_component.html.erb

@@ -1,4 +1,4 @@
-<div class="shop-item-card<%= ' shop-item-card--achievement-locked' if locked_by_achievement %><%= ' shop-item-card--mission-locked' if mission_locked %><%= ' shop-item-card--out-of-stock' if out_of_stock? %><%= ' shop-item-card--on-sale' if on_sale %><%= ' shop-item-card--with-bow' if show_bow %><%= ' shop-item-card--spotlight' if tutorial_spotlight %><%= ' shop-item-card--wishlisted' if wishlisted %>"
+<div class="shop-item-card<%= ' shop-item-card--achievement-locked' if locked_by_achievement %><%= ' shop-item-card--mission-locked' if mission_locked %> <%= ' shop-item-card--out-of-stock' if out_of_stock? %> <%= ' shop-item-card--on-sale' if on_sale %> <%= ' shop-item-card--with-bow' if show_bow %> <%= ' shop-item-card--spotlight' if tutorial_spotlight %> <%= ' shop-item-card--wishlisted' if wishlisted %> <%= ' shop-item-card--stacked-ribbons' if (purchase_count || is_new) && teen_creator? %>"
      data-categories="<%= categories.join(',') %>"
      data-regions="<%= enabled_regions.join(',') %>"
      data-achievement-locked="<%= locked_by_achievement %>"
@@ -34,6 +34,12 @@
       <span class="shop-item-card__ribbon shop-item-card__ribbon--new">New</span>
     <% end %>
 
+    <% if teen_creator? %>
+      <%= link_to teen_creator_url, target: "_blank", rel: "noopener", class: "shop-item-card__ribbon shop-item-card__ribbon--teen-creator" do %>
+        Made by a teen!
+      <% end %>
+    <% end %>
+
     <% if on_sale %>
       <span class="shop-item-card__sale-badge"><%= sale_percentage %>% OFF</span>
     <% end %>

app/components/shop_item_card_component.rb

@@ -8,9 +8,9 @@ class ShopItemCardComponent < ViewComponent::Base
   # surface the popup in place instead of routing to a separate screen.
   OPEN_VERIFY_MODAL = "document.getElementById('idv-verify-modal')?.showModal()".freeze
 
-  attr_reader :item_id, :name, :description, :hours, :price, :image_url, :item_type, :balance, :enabled_regions, :regional_price, :logged_in, :tutorial_spotlight, :cta_mode, :remaining_stock, :limited, :on_sale, :sale_percentage, :original_price, :created_at, :show_bow, :show_time_ago, :purchase_count, :is_new, :enabled_until, :locked_by_achievement, :required_achievement_names, :required_achievement_hints, :mission_locked, :unlocking_mission_names, :wishlisted
+  attr_reader :item_id, :name, :description, :hours, :price, :image_url, :item_type, :balance, :enabled_regions, :regional_price, :logged_in, :tutorial_spotlight, :cta_mode, :remaining_stock, :limited, :on_sale, :sale_percentage, :original_price, :created_at, :show_bow, :show_time_ago, :purchase_count, :is_new, :enabled_until, :locked_by_achievement, :required_achievement_names, :required_achievement_hints, :mission_locked, :unlocking_mission_names, :wishlisted, :teen_creator_url
 
-  def initialize(item_id:, name:, description:, hours:, price:, image_url:, item_type: nil, balance: nil, enabled_regions: [], regional_price: nil, logged_in: true, interactive: true, tutorial_spotlight: false, cta_mode: :order, remaining_stock: nil, limited: false, on_sale: false, sale_percentage: nil, original_price: nil, created_at: nil, show_bow: false, show_time_ago: false, purchase_count: nil, is_new: false, enabled_until: nil, locked_by_achievement: false, required_achievement_names: [], required_achievement_hints: [], mission_locked: false, unlocking_mission_names: [], wishlisted: false)
+  def initialize(item_id:, name:, description:, hours:, price:, image_url:, item_type: nil, balance: nil, enabled_regions: [], regional_price: nil, logged_in: true, interactive: true, tutorial_spotlight: false, cta_mode: :order, remaining_stock: nil, limited: false, on_sale: false, sale_percentage: nil, original_price: nil, created_at: nil, show_bow: false, show_time_ago: false, purchase_count: nil, is_new: false, enabled_until: nil, locked_by_achievement: false, required_achievement_names: [], required_achievement_hints: [], mission_locked: false, unlocking_mission_names: [], wishlisted: false, teen_creator_url: nil)
     @item_id = item_id
     @name = name
     @description = description
@@ -41,6 +41,7 @@ def initialize(item_id:, name:, description:, hours:, price:, image_url:, item_t
     @mission_locked = mission_locked
     @unlocking_mission_names = unlocking_mission_names
     @wishlisted = wishlisted
+    @teen_creator_url = teen_creator_url
   end
 
   def lock_overlay_html
@@ -122,4 +123,8 @@ def cta_price_icon
     return nil if display_price.to_i.zero?
     "icons/stardust.png"
   end
+
+  def teen_creator?
+    teen_creator_url.present?
+  end
 end

app/models/shop_item.rb

@@ -53,6 +53,7 @@
 #  source_region                     :string
 #  special                           :boolean
 #  stock                             :integer
+#  teen_creator_url                  :string
 #  ticket_cost                       :integer
 #  type                              :string
 #  unlisted                          :boolean          default(FALSE)

app/views/shop/items/_item_card.html.erb

@@ -52,5 +52,6 @@
   required_achievement_hints: item_achievement_infos.map(&:description),
   mission_locked: item_mission_locked,
   unlocking_mission_names: item_unlocking_missions,
-  wishlisted: wishlisted_item_ids.include?(item.id)
+  wishlisted: wishlisted_item_ids.include?(item.id),
+  teen_creator_url: item.teen_creator_url
 ) %>

app/views/shop/items/_recently_added.html.erb

@@ -35,7 +35,8 @@
           required_achievement_names: item_achievement_infos.map(&:name),
           required_achievement_hints: item_achievement_infos.map(&:description),
           mission_locked: item_mission_locked,
-          unlocking_mission_names: item_unlocking_missions
+          unlocking_mission_names: item_unlocking_missions,
+          teen_creator_url: item.teen_creator_url
         ) %>
       <% end %>
       </div>

db/migrate/20260701212214_add_teen_creator_url_to_shop_items.rb

@@ -0,0 +1,5 @@
+class AddTeenCreatorUrlToShopItems < ActiveRecord::Migration[8.1]
+  def change
+    add_column :shop_items, :teen_creator_url, :string
+  end
+end

test/fixtures/shop_items.yml

@@ -59,6 +59,7 @@
 #  source_region                     :string
 #  special                           :boolean
 #  stock                             :integer
+#  teen_creator_url                  :string
 #  ticket_cost                       :integer
 #  type                              :string
 #  unlisted                          :boolean          default(FALSE)

test/models/shop_item_test.rb

@@ -53,6 +53,7 @@
 #  source_region                     :string
 #  special                           :boolean
 #  stock                             :integer
+#  teen_creator_url                  :string
 #  ticket_cost                       :integer
 #  type                              :string
 #  unlisted                          :boolean          default(FALSE)