Show oldest unread entry at the top

Author: cruessler

config/dev.exs

@@ -36,7 +36,14 @@ config :ex_rss, ExRssWeb.Endpoint,
       ~r{priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$},
       ~r{priv/gettext/.*(po)$},
       ~r{lib/ex_rss_web/views/.*(ex)$},
-      ~r{lib/ex_rss_web/templates/.*(eex)$}
+      ~r{lib/ex_rss_web/templates/.*(eex)$},
+      # TODO
+      # 2024-12-04
+      # This pattern is more generic than the one generated by Phoenix 1.7.
+      #
+      # This is due to a different folder structure. It is probably a good idea
+      # to move files around to match the expectations of Phoenix 1.7.
+      ~r{lib/ex_rss_web/.*(heex)$}
     ]
   ]
 

lib/ex_rss/user.ex

@@ -4,6 +4,7 @@ defmodule ExRss.User do
   alias Ecto.Changeset
 
   alias ExRss.Feed
+  alias ExRss.Repo
   alias ExRss.User
 
   @timestamps_opts [type: :utc_datetime]
@@ -33,4 +34,16 @@ defmodule ExRss.User do
   def verify_remember_me_token(token) do
     Phoenix.Token.verify(@context, @salt, token, max_age: @max_age)
   end
+
+  def oldest_unread_entry(user_id) do
+    user = Repo.get!(User, user_id)
+
+    from(e in assoc(user, :entries),
+      where: e.read == false,
+      order_by: [asc: :posted_at],
+      limit: 1
+    )
+    |> Repo.all()
+    |> List.first()
+  end
 end

lib/ex_rss_web/feed_live/index.ex

@@ -1,8 +1,21 @@
 defmodule ExRssWeb.FeedLive.Index do
   use ExRssWeb, :live_view
 
-  def mount(_params, %{"api_token" => api_token} = _session, socket) do
-    {:ok, assign(socket, :api_token, api_token)}
+  alias ExRss.User
+
+  def mount(
+        _params,
+        %{"api_token" => api_token, "current_user" => current_user} = _session,
+        socket
+      ) do
+    oldest_unread_entry = User.oldest_unread_entry(current_user.id)
+
+    socket =
+      socket
+      |> assign(:api_token, api_token)
+      |> assign(:oldest_unread_entry, oldest_unread_entry)
+
+    {:ok, socket}
   end
 
   # 2024-12-03

lib/ex_rss_web/feed_live/index.html.heex

@@ -1,3 +1,19 @@
+<h1 class="mb-2 font-bold">Oldest unread entry</h1>
+
+<ul class="mb-6 flex flex-col">
+  <li class="flex flex-col md:flex-row mt-4">
+    <div class="flex flex-col">
+      <a href={@oldest_unread_entry.url} target="_blank"><%= @oldest_unread_entry.title %></a>
+      <span><%= @oldest_unread_entry.posted_at %></span>
+    </div>
+
+    <div class="md:shrink-0 flex self-start mt-1 ml-auto space-x-4">
+      <a target="_blank" aria-label={"View entry #{@oldest_unread_entry.title}"}>View</a>
+      <button aria-label="Mark as read">Mark as read</button>
+    </div>
+  </li>
+</ul>
+
 <%=
   elm_module("App.Feeds", %{apiToken: @api_token})
 %>