Add domain icons and enhance post views for E621 and FurAffinity

app/helpers/domain/e621/posts_helper.rb

@@ -0,0 +1,79 @@
+module Domain::E621::PostsHelper
+  def icon_asset_for_url(url)
+    domain = extract_domain(url)
+    return nil unless domain
+
+    domain_patterns = {
+      %w[*.e621.net e621.net] => "e621.png",
+      %w[*.furaffinity.net furaffinity.net] => "fa.png",
+      %w[*.bsky.app bsky.app] => "bsky.png",
+      %w[*.itaku.ee itaku.ee] => "itaku.png",
+      %w[*.deviantart.com deviantart.com *.wixmp.com] => "deviantart.png",
+    }
+
+    domain_patterns.each do |patterns, icon|
+      patterns.each do |pattern|
+        if File.fnmatch?(pattern, domain, File::FNM_PATHNAME)
+          return asset_path("domain-icons/#{icon}")
+        end
+      end
+    end
+    nil
+  end
+
+  def tag_category_tw_class(category)
+    case category.to_sym
+    when :general
+      "bg-blue-300" # Light blue
+    when :artist
+      "bg-indigo-300" # Light indigo
+    when :copyright
+      "bg-purple-300" # Light purple
+    when :character
+      "bg-green-300" # Light green
+    when :species
+      "bg-teal-300" # Light teal
+    when :invalid
+      "bg-slate-300" # Medium gray
+    when :meta
+      "bg-amber-300" # Light amber
+    when :lore
+      "bg-cyan-300" # Light cyan
+    else
+      "bg-white" # White (default)
+    end
+  end
+
+  def tag_category_order
+    %i[artist copyright character species general meta lore invalid]
+  end
+
+  def font_awesome_category_icon(category)
+    case category.to_sym
+    when :artist
+      "fa-brush"
+    when :species
+      "fa-paw"
+    when :character
+      "fa-user"
+    when :copyright
+      "fa-copyright"
+    when :general
+      "fa-tag"
+    when :lore
+      "fa-book"
+    when :meta
+      "fa-info"
+    when :invalid
+      "fa-ban"
+    end
+  end
+
+  private
+
+  def extract_domain(url)
+    URI.parse(url).host
+  rescue URI::InvalidURIError
+    nil
+  end
+end

app/models/domain/e621/post.rb

@@ -36,6 +36,12 @@ class Domain::E621::Post < ReduxApplicationRecord
              foreign_key: :e621_id,
              optional: true
 
+  def index_page_http_log_entry
+    if state_detail["last_index_page_id"].present?
+      HttpLogEntry.find_by(id: state_detail["last_index_page_id"])
+    end
+  end
+
   def file_uri
     Addressable::URI.parse(self.file_url_str) if self.file_url_str.present?
   end

app/views/domain/e621/posts/_post.html.erb

@@ -3,14 +3,36 @@
   class="mx-auto mt-4 flex w-full max-w-2xl flex-col gap-4 pb-4"
 >
   <section class="rounded-md border border-slate-300 bg-slate-50 p-4">
-    <span class="text-md italic">E621 Post #<%= @post.e621_id %></span>
-    <div>
-      Rating: <%= @post.rating.upcase %> | Score: <%= @post.score %> | Created:
-      <%= @post.created_at.strftime("%Y-%m-%d") %>
+    <div class="flex items-center justify-between">
+      <div>
+        <span class="text-md italic">
+          <%= link_to "E621 Post ##{@post.e621_id}",
+                      "https://e621.net/posts/#{@post.e621_id}",
+                      class: "text-blue-600 hover:underline",
+                      target: "_blank" %>
+        </span>
+        <% if @post.artists_array.any? %>
+          <span class="ml-2 italic"
+            >by <%= @post.artists_array.join(", ") %></span
+          >
+        <% end %>
+      </div>
+      <i class="fa-solid fa-arrow-up-right-from-square text-slate-400"></i>
+    </div>
+    <div class="mt-2 flex flex-wrap gap-x-4 text-sm text-slate-600">
+      <span
+        ><i class="fa-solid fa-star mr-1"></i>Score: <%= @post.score %></span
+      >
+      <span
+        ><i class="fa-solid fa-tag mr-1"></i>Rating:
+        <%= @post.rating.upcase %></span
+      >
+      <span>
+        <i class="fa-regular fa-calendar mr-1"></i>
+        Created: <%= @post.created_at.strftime("%Y-%m-%d") %>
+        (<%= time_ago_in_words(@post.created_at) %> ago)
+      </span>
     </div>
-    <% if @post.artists_array.any? %>
-      <div>Artists: <%= @post.artists_array.join(", ") %></div>
-    <% end %>
   </section>
 
   <section>
@@ -42,10 +64,18 @@
     <div class="bg-slate-100 p-4">
       <% if @post.tags_array.any? %>
         <div class="flex flex-wrap gap-2">
-          <% @post.tags_array.each do |tag| %>
-            <span class="rounded bg-slate-200 px-2 py-1 text-sm"
-              ><%= tag %></span
-            >
+          <% tag_category_order.each do |category| %>
+            <% (@post.tags_array[category.to_s] || []).each do |tag| %>
+              <span
+                class="<%= tag_category_tw_class(category) %> rounded px-2 py-1 text-sm text-slate-600"
+              >
+                <% icon = font_awesome_category_icon(category) %>
+                <% if icon %>
+                  <i class="fa-solid <%= icon %> mr-1"></i>
+                <% end %>
+                <%= tag %>
+              </span>
+            <% end %>
           <% end %>
         </div>
       <% else %>
@@ -58,11 +88,21 @@
     <section class="sky-section">
       <div class="section-header">Sources</div>
       <div class="bg-slate-100 p-4">
-        <% @post.sources_array.each do |source| %>
-          <div>
-            <%= link_to source, source, class: "text-blue-600 hover:underline", target: "_blank" %>
-          </div>
-        <% end %>
+        <div class="divide-y divide-slate-200">
+          <% @post.sources_array.each do |source| %>
+            <div class="flex items-start gap-2 py-1 first:pt-0 last:pb-0">
+              <% if icon_path = icon_asset_for_url(source) %>
+                <%= image_tag icon_path, class: "h-4 w-4 mt-1 flex-shrink-0" %>
+              <% else %>
+                <i class="fa-solid fa-link mt-1 h-4 w-4 flex-shrink-0"></i>
+              <% end %>
+              <%= link_to source,
+                          source,
+                          class: "text-blue-600 hover:underline truncate",
+                          target: "_blank" %>
+            </div>
+          <% end %>
+        </div>
       </div>
     </section>
   <% end %>

app/views/domain/fa/posts/_post.html.erb

@@ -3,10 +3,44 @@
   class="mx-auto mt-4 flex w-full max-w-2xl flex-col gap-4 pb-4"
 >
   <section class="rounded-md border border-slate-300 bg-slate-50 p-4">
-    <span class="text-md italic"><%= @post.title %></span> -
-    <%= render "domain/fa/users/inline_link", user: @post.creator %>
-    <div><%= scanned_and_file_description(@post) %></div>
+    <div class="flex items-center justify-between">
+      <div>
+        <span class="text-md italic">
+          <%= link_to @post.title,
+                      "https://www.furaffinity.net/view/#{@post.fa_id}",
+                      class: "text-blue-600 hover:underline",
+                      target: "_blank" %>
+        </span>
+        <span class="ml-2 italic">
+          by <%= render "domain/fa/users/inline_link", user: @post.creator %>
+        </span>
+      </div>
+      <i class="fa-solid fa-arrow-up-right-from-square text-slate-400"></i>
+    </div>
+    <div class="mt-2 flex flex-wrap gap-x-4 text-sm text-slate-600">
+      <span>
+        <i class="fa-regular fa-calendar mr-1"></i>
+        Posted: <%= @post.posted_at&.strftime("%Y-%m-%d") %>
+        (<%= time_ago_in_words(@post.posted_at) if @post.posted_at %> ago)
+      </span>
+      <span>
+        <i class="fa-solid fa-eye mr-1"></i>
+        Views: <%= @post.num_views %>
+      </span>
+      <span>
+        <i class="fa-solid fa-comment mr-1"></i>
+        Comments: <%= @post.num_comments %>
+      </span>
+      <span>
+        <i class="fa-solid fa-heart mr-1"></i>
+        Favorites: <%= @post.num_favorites %>
+      </span>
+    </div>
+    <% if (scan_desc = scanned_and_file_description(@post)) %>
+      <div class="mt-2 text-sm text-slate-500"><%= scan_desc %></div>
+    <% end %>
   </section>
+
   <section>
     <% if @post.file %>
       <%= render partial: "log_entries/content_container",
@@ -23,6 +57,25 @@
       <% end %>
     <% end %>
   </section>
+
+  <% if @post.file %>
+    <section class="sky-section">
+      <div class="section-header">File Details</div>
+      <div class="bg-slate-100 p-4">
+        <div class="flex flex-wrap gap-x-4 text-sm text-slate-600">
+          <span>
+            <i class="fa-regular fa-file mr-1"></i>
+            Type: <%= @post.file.content_type %>
+          </span>
+          <span>
+            <i class="fa-solid fa-weight-hanging mr-1"></i>
+            Size: <%= number_to_human_size(@post.file.response.size) %>
+          </span>
+        </div>
+      </div>
+    </section>
+  <% end %>
+
   <section class="sky-section">
     <% if (post_description_html = @post.description) %>
       <div class="section-header">Post Description</div>

app/views/domain/fa/users/show_sections/_name_icon_and_status.html.erb

@@ -16,6 +16,6 @@
     class="sky-link flex items-center gap-2"
   >
     <span class="font-medium">FurAffinity</span>
-    <img src="<%= image_path("fa-logo.png") %>" class="h-5 w-5" />
+    <img src="<%= image_path("domain-icons/fa.png") %>" class="h-5 w-5" />
   </a>
 </section>

app/views/domain/fa/users/show_sections/_recent_posts.html.erb

@@ -14,10 +14,10 @@
          .limit(5)
          .each do |post| %>
       <div class="flex items-center px-4 py-2">
-        <span class="grow">
-          <%= link_to post.title, domain_fa_post_path(post), class: "sky-link" %>
+        <span class="grow truncate">
+          <%= link_to post.title, domain_fa_post_path(post), class: "sky-link block truncate" %>
         </span>
-        <span class="text-slate-500">
+        <span class="whitespace-nowrap text-slate-500">
           <%= time_ago_in_words(post.created_at) %> ago
         </span>
       </div>

app/views/indexed_posts/_inline_postable_domain_link.html.erb

@@ -1,11 +1,11 @@
 <% case post.postable_type %>
 <% when "Domain::Fa::Post" %>
-  <% domain_icon = asset_path("fa-logo.png") %>
+  <% domain_icon = asset_path("domain-icons/fa.png") %>
   <% icon_title = "Furaffinity" %>
   <% external_url = "https://www.furaffinity.net/view/#{post.postable.fa_id}" %>
   <% link_text = "FA ##{post.postable.fa_id}" %>
 <% when "Domain::E621::Post" %>
-  <% domain_icon = asset_path("e621-logo.png") %>
+  <% domain_icon = asset_path("domain-icons/e621.png") %>
   <% icon_title = "E621" %>
   <% external_url = "https://e621.net/posts/#{post.postable.e621_id}" %>
   <% link_text = "E621 ##{post.postable.e621_id}" %>

app/views/layouts/application.html.erb

@@ -16,6 +16,7 @@
     <%= csp_meta_tag %>
     <%= javascript_pack_tag "application-bundle" %>
     <%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
     <%= yield :head %>
   </head>
   <body class="mx-0 flex flex-col h-full">