From 0705f66f6db85916aa4bea45f1000cca1dbff473 Mon Sep 17 00:00:00 2001
From: Emi Matchu <emi@matchu.dev>
Date: Tue, 20 Feb 2024 14:32:45 -0800
Subject: [PATCH] Add "first seen" timestamps to item pages

Impress 2020 has had this for a while, I've wanted it for reference on
occasion, let's bring it in!

Very similar logic, and Ruby & Rails's date affordances are super
helpful for simplifying how to express it!
---
 app/assets/stylesheets/partials/_item_header.sass | 14 ++++++++------
 app/helpers/items_helper.rb                       | 13 +++++++++++++
 app/views/items/_item_header.haml                 |  6 ++++++
 3 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/partials/_item_header.sass b/app/assets/stylesheets/partials/_item_header.sass
index 1554d1c2..6e897872 100644
--- a/app/assets/stylesheets/partials/_item_header.sass
+++ b/app/assets/stylesheets/partials/_item_header.sass
@@ -36,28 +36,30 @@
       display: flex
       align-items: center
       gap: 1em
-      
-      .item-kind
+
+      .item-kind, .first-seen-at
         padding: .25em .5em
         border-radius: .25em
         cursor: help
-        text-decoration: none
 
+        text-decoration: none
         font-weight: bold
         line-height: 1
 
+        background: #E2E8F0
+        color: #1A202C
+      
+      .item-kind
         // These colors are copied from DTI 2020, for initial consistency!
         // They're based on the Chakra UI colors, which I think are in turn the
         // Bootstrap colors? Or something?
+        // NOTE: For the data-type=np case, we use the default gray colors.
         &[data-type=nc]
           background: #E9D8FD
           color: #44337A
         &[data-type=pb]
           background: #FEEBC8
           color: #7B341E
-        &[data-type=np]
-          background: #E2E8F0
-          color: #1A202C
 
     .user-lists-info
       grid-area: lists
diff --git a/app/helpers/items_helper.rb b/app/helpers/items_helper.rb
index ec998736..ce6fc719 100644
--- a/app/helpers/items_helper.rb
+++ b/app/helpers/items_helper.rb
@@ -59,6 +59,19 @@ module ItemsHelper
     nc_icon if item.nc?
   end
 
+  def time_with_only_month_if_old(first_seen_at)
+    # For this month and the previous month, show the full date, so people can
+    # understand *exactly* how recent it was.
+    beginning_of_prev_month = Date.today.beginning_of_month - 1.month
+    if first_seen_at >= beginning_of_prev_month
+      return first_seen_at.strftime("%b %e, %Y")
+    end
+
+    # Otherwise, show just the month and the year, to be concise. (We'll offer
+    # the full date as a tooltip, too.)
+    first_seen_at.strftime("%b %Y")
+  end
+
   def jn_items_url_for(item)
     sprintf(JNItemsURLFormat, CGI::escape(item.name))
   end
diff --git a/app/views/items/_item_header.haml b/app/views/items/_item_header.haml
index 8854d256..eddc2e0c 100644
--- a/app/views/items/_item_header.haml
+++ b/app/views/items/_item_header.haml
@@ -19,6 +19,12 @@
         %abbr.item-kind{'data-type' => 'np', title: t('items.show.item_kinds.np.description')}
           = t('items.show.item_kinds.np.label')
 
+      - if item.created_at?
+        %time.first-seen-at{
+          datetime: item.created_at.iso8601,
+          title: "First seen on #{item.created_at.to_date.to_fs(:long)}",
+        }= time_with_only_month_if_old item.created_at
+
       = link_to t('items.show.resources.jn_items'), jn_items_url_for(item)
       - if item.nc_trade_value
         = link_to t('items.show.resources.owls', value: item.nc_trade_value.value_text),