Make entry show an icon and add icon link to original page (#595)

Gemfile

@@ -13,6 +13,7 @@ gem 'bootsnap', require: false # Reduces boot times through caching; required in
 gem 'feedjira' # Parse RSS feeds
 gem 'good_job' # Multithreaded, Postgres-based, ActiveJob backend for Ruby on Rails
 gem 'image_processing' # Use Active Storage variants
+gem 'inline_svg' # Render inline SVGs
 gem 'pagy' # Use pagy for pagination
 gem 'pg' # Use postgresql as the database for Active Record
 gem 'puma' # Use the Puma web server [https://github.com/puma/puma]

Gemfile.lock

@@ -154,6 +154,9 @@ GEM
     image_processing (1.13.0)
       mini_magick (>= 4.9.5, < 5)
       ruby-vips (>= 2.0.17, < 3)
+    inline_svg (1.10.0)
+      activesupport (>= 3.0)
+      nokogiri (>= 1.6)
     io-console (0.8.0)
     irb (1.15.1)
       pp (>= 0.6.0)
@@ -385,6 +388,7 @@ DEPENDENCIES
   feedjira
   good_job
   image_processing
+  inline_svg
   pagy
   pg
   pgreset

app/assets/styles/base/index.css

@@ -6,3 +6,12 @@ html {
   font-size: var(--text-base);
   font-family: var(--font-body);
 }
+
+.table__cell--actions {
+  white-space: nowrap;
+}
+
+.icon {
+  width: 2rem;
+  height: 2rem;
+}

app/views/entries/index.html.erb

@@ -28,8 +28,13 @@
             <%= content_tag :td, entry.author, class: 'table__cell' %>
             <%= content_tag :td, entry.published_at.present? ? l(entry.published_at) : t('.published_at_unknown'), class: 'table__cell' %>
             <%= content_tag :td, entry.read?, class: 'table__cell' %>
-            <%= content_tag :td, class: 'table__cell' do %>
-              <%= link_to t('.show'), entry, class: 'table__link' %>
+            <%= content_tag :td, class: 'table__cell table__cell--actions' do %>
+              <%= link_to entry, class: 'table__link', aria: { label: t('.show') } do %>
+                <%= inline_svg_tag 'images/icons/eye.svg', class: 'icon' %>
+              <% end %>
+              <%= link_to entry.url, class: 'table__link', aria: { label: t('.go_to_original') } do %>
+                <%= inline_svg_tag 'images/icons/arrow-top-right-on-square.svg', class: 'icon' %>
+              <% end %>
             <% end %>
           </tr>
         <%- end %>

app/views/subscriptions/show.html.erb

@@ -25,8 +25,13 @@
         <%= content_tag :td, entry.title, class: 'table__cell' %>
         <%= content_tag :td, entry.author, class: 'table__cell' %>
         <%= content_tag :td, entry.published_at.present? ? l(entry.published_at) : t('.published_at_unknown'), class: 'table__cell' %>
-        <%= content_tag :td, class: 'table__cell' do %>
-          <%= link_to t('.show'), entry, class: 'table__link' %>
+        <%= content_tag :td, class: 'table__cell table__cell--actions' do %>
+          <%= link_to entry, class: 'table__link', aria: { label: t('.show') } do %>
+            <%= inline_svg_tag 'images/icons/eye.svg', class: 'icon' %>
+          <% end %>
+          <%= link_to entry.url, class: 'table__link', aria: { label: t('.go_to_original') } do %>
+            <%= inline_svg_tag 'images/icons/arrow-top-right-on-square.svg', class: 'icon' %>
+          <% end %>
         <% end %>
       </tr>
     <%- end %>

config/initializers/inline_svg.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+require 'inline_svg/vite_file_loader'
+
+InlineSvg.configure do |config|
+  config.asset_file = InlineSvg::ViteFileLoader
+  config.raise_on_file_not_found = Rails.env.test?
+end

lib/inline_svg/vite_file_loader.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+require 'open-uri'
+
+module InlineSvg
+  class ViteFileLoader
+    def self.named(filename)
+      path = ViteRuby.instance.manifest.path_for(filename)
+
+      return fetch_from_dev_server(path) if ViteRuby.instance.dev_server_running?
+
+      Rails.public_path.join(path[1..]).read
+    end
+
+    def self.fetch_from_dev_server(path)
+      config = ViteRuby.config
+
+      path = "#{config.protocol}://#{config.host_with_port}#{path}"
+
+      # rubocop:disable Security/Open
+      # This is only used in dev to load an inline SVG, so security implications are very limited.
+      URI.open(path)
+      # rubocop:enable Security/Open
+    end
+  end
+end