Refactor placeholder logo into common controller (#673)

This can be updated to redirect/pull from third party sources in future,
with the option of always falling back to the placeholder if there are
any failures.

app/views/accounts/logos/show.svg.erb

@@ -0,0 +1,21 @@
+<svg
+  version="1.1"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  viewBox="0 0 32 32"
+  aria-hidden="true">
+  <g>
+    <rect width="100%" height="100%" rx="50%" fill="<%= accountable_color(@account.accountable_type) %>" opacity="0.1" />
+    <text
+      x="50%"
+      y="50%"
+      fill="<%= accountable_color(@account.accountable_type) %>"
+      text-anchor="middle"
+      dy="0.35em"
+      font-family="ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji"
+      font-size="16"
+      font-weight="400">
+      <%= @account.name[0].upcase %>
+    </text>
+  </g>
+</svg>

app/views/accounts/show.html.erb

@@ -2,9 +2,7 @@
 <div class="space-y-4">
   <div class="flex justify-between items-center">
     <div class="flex items-center gap-3">
-      <div class="bg-green-600/10 rounded-full h-8 w-8 flex items-center justify-center">
-        <span class="text-green-600"><%= @account.name[0].upcase %></span>
-      </div>
+      <%= image_tag account_logo_url(@account), class: "w-8 h-8" %>
       <h2 class="font-medium text-xl"><%= @account.name %></h2>
     </div>
     <div class="flex items-center gap-3">

app/views/pages/_account_group_disclosure.erb

@@ -25,9 +25,7 @@
     <% accountable_group.children.map do |account_value_node| %>
       <div class="flex items-center justify-between text-sm font-medium text-gray-900">
         <div class="flex items-center gap-4">
-          <div class="flex items-center justify-center w-8 h-8 rounded-full <%= text_class %> <%= accountable_bg_transparent_class(account_value_node.name) %>">
-            <%= account_value_node.name[0].upcase %>
-          </div>
+          <%= image_tag account_logo_url(account_value_node.original), class: "w-8 h-8" %>
           <div>
             <p><%= account_value_node.name %></p>
           </div>

app/views/pages/dashboard.html.erb

@@ -54,9 +54,7 @@
         <div class="flex gap-1.5">
           <% @top_earners.first(3).each do |account| %>
             <%= link_to account, class: "border border-alpha-black-25 rounded-full p-1 pr-2 flex items-center gap-1 text-xs text-gray-900 font-medium hover:bg-gray-25" do %>
-              <div class="flex items-center justify-center text-xs w-5 h-5 rounded-full <%= accountable_text_class(account.accountable_type) %> <%= accountable_bg_transparent_class(account.accountable_type) %>">
-                <%= account.name[0].upcase %>
-              </div>
+              <%= image_tag account_logo_url(account), class: "w-5 h-5" %>
               <span>+<%= Money.new(account.income, account.currency) %></span>
             <% end %>
           <% end %>
@@ -88,9 +86,7 @@
         <div class="flex gap-1.5">
           <% @top_spenders.first(3).each do |account| %>
             <%= link_to account, class: "border border-alpha-black-25 rounded-full p-1 pr-2 flex items-center gap-1 text-xs text-gray-900 font-medium hover:bg-gray-25" do %>
-              <div class="flex items-center justify-center text-xs w-5 h-5 rounded-full <%= accountable_text_class(account.accountable_type) %> <%= accountable_bg_transparent_class(account.accountable_type) %>">
-                <%= account.name[0].upcase %>
-              </div>
+              <%= image_tag account_logo_url(account), class: "w-5 h-5" %>
               -<%= Money.new(account.spending, account.currency) %>
             <% end %>
           <% end %>
@@ -123,9 +119,7 @@
         <div class="flex gap-1.5">
           <% @top_savers.first(3).each do |account| %>
             <%= link_to account, class: "border border-alpha-black-25 rounded-full p-1 pr-2 flex items-center gap-1 text-xs text-gray-900 font-medium hover:bg-gray-25" do %>
-              <div class="flex items-center justify-center text-xs w-5 h-5 rounded-full <%= accountable_text_class(account.accountable_type) %> <%= accountable_bg_transparent_class(account.accountable_type) %>">
-                <%= account.name[0].upcase %>
-              </div>
+              <%= image_tag account_logo_url(account), class: "w-5 h-5" %>
               <span><%= account.savings_rate > 0 ? "+" : "-" %><%= number_to_percentage(account.savings_rate.abs * 100, precision: 2) %></span>
             <% end %>
           <% end %>