diff --git a/src/views/components/card.ecr b/src/views/components/card.ecr
index 91cde5b..0eb07a5 100644
--- a/src/views/components/card.ecr
+++ b/src/views/components/card.ecr
@@ -1,3 +1,13 @@
+<% if item.is_a? NamedTuple(entry: Entry, percentage: Float64, grouped_count: Int32) %>
+<% grouped_count = item[:grouped_count] %>
+<% if grouped_count == 1 %>
+<% item = item[:entry] %>
+<% else %>
+<% item = item[:entry].book %>
+<% end %>
+<% else %>
+<% grouped_count = 1 %>
+<% end %>
 <div class="item" data-mtime="<%= item.mtime.to_unix %>" data-progress="<%= progress || 0.0 %>"
   <% if item.is_a? Entry %>
   id="<%= item.id %>"
@@ -27,7 +37,11 @@
         <p><%= item.pages %> pages</p>
         <% end %>
         <% if item.is_a? Title %>
+        <% if grouped_count == 1 %>
         <p><%= item.size %> entries</p>
+        <% else %>
+        <p><%= grouped_count %> new entries</p>
+        <% end %>
         <% end %>
       </div>
     </div>
diff --git a/src/views/home.ecr b/src/views/home.ecr
index 08abe44..0b361e1 100644
--- a/src/views/home.ecr
+++ b/src/views/home.ecr
@@ -39,20 +39,9 @@
 <h2 class="uk-title home-headings">Continue Reading</h2>
 <div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
   <%- continue_reading.each do |cr| -%>
-  <div class="item" data-mtime="<%= cr[:entry].mtime.to_unix %>" data-progress="<%= cr[:percentage] %>" id="<%= cr[:entry].id %>">
-    <a class="acard">
-      <div class="uk-card uk-card-default" onclick="showModal(&quot;<%= cr[:entry].encoded_path %>&quot;, '<%= cr[:entry].pages %>', <%= (cr[:percentage] * 100).round(1) %>, &quot;<%= cr[:entry].book.encoded_display_name %>&quot;, &quot;<%= cr[:entry].encoded_display_name %>&quot;, '<%= cr[:entry].title_id %>', '<%= cr[:entry].id %>')">
-        <div class="uk-card-media-top">
-          <img data-src="<%= cr[:entry].cover_url %>" alt="" data-width data-height uk-img>
-        </div>
-        <div class="uk-card-body">
-          <div class="uk-card-badge uk-label"><%= (cr[:percentage] * 100).round(1) %>%</div>
-          <h3 class="uk-card-title break-word" data-title="<%= cr[:entry].display_name.gsub("\"", "&quot;") %>"><%= cr[:entry].display_name %></h3>
-          <p><%= cr[:entry].pages %> pages</p>
-        </div>
-      </div>
-    </a>
-  </div>
+  <% item = cr[:entry] %>
+  <% progress = cr[:percentage] %>
+  <%= render_component "card" %>
   <%- end -%>
 </div>
 <%- end -%>
@@ -61,36 +50,9 @@
 <h2 class="uk-title home-headings">Recently Added</h2>
 <div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
   <%- recently_added.each do |ra| -%>
-  <%- if ra[:grouped_count] == 1 -%>
-  <div class="item" data-progress="<%= ra[:percentage] %>" id="<%= ra[:entry].id %>">
-    <a class="acard">
-      <div class="uk-card uk-card-default" onclick="showModal(&quot;<%= ra[:entry].encoded_path %>&quot;, '<%= ra[:entry].pages %>', <%= (ra[:percentage] * 100).round(1) %>, &quot;<%= ra[:entry].book.encoded_display_name %>&quot;, &quot;<%= ra[:entry].encoded_display_name %>&quot;, '<%= ra[:entry].title_id %>', '<%= ra[:entry].id %>')">
-        <div class="uk-card-media-top">
-          <img data-src="<%= ra[:entry].cover_url %>" alt="" data-width data-height uk-img>
-        </div>
-        <div class="uk-card-body">
-          <div class="uk-card-badge uk-label"><%= (ra[:percentage] * 100).round(1) %>%</div>
-          <h3 class="uk-card-title break-word" data-title="<%= ra[:entry].display_name.gsub("\"", "&quot;") %>"><%= ra[:entry].display_name %></h3>
-          <p><%= ra[:entry].pages %> pages</p>
-        </div>
-      </div>
-    </a>
-  </div>
-  <%- else -%>
-  <div class="item">
-    <a class="acard" href="<%= base_url %>book/<%= ra[:entry].book.id %>">
-      <div class="uk-card uk-card-default">
-        <div class="uk-card-media-top">
-          <img data-src="<%= ra[:entry].cover_url %>" data-width data-height alt="" uk-img>
-        </div>
-        <div class="uk-card-body">
-          <h3 class="uk-card-title break-word" data-title="<%= ra[:entry].book.display_name.gsub("\"", "&quot;") %>"><%= ra[:entry].book.display_name %></h3>
-          <p><%= ra[:grouped_count] %> new entries</p>
-        </div>
-      </div>
-    </a>
-  </div>
-  <%- end -%>
+  <% item = ra %>
+  <% progress = ra[:percentage] %>
+  <%= render_component "card" %>
   <%- end -%>
 </div>
 <%- end -%>