add sanitized firehose

lib/emoji/predictions.ex

@@ -67,12 +67,12 @@ defmodule Emoji.Predictions do
     )
   end
 
-  def list_firehose_predictions() do
+  def list_latest_safe_predictions(limit) do
     Repo.all(
       from p in Prediction,
-        where: not is_nil(p.no_bg_output),
+        where: not is_nil(p.no_bg_output) and p.moderation_score <= 5,
         order_by: [desc: p.inserted_at],
-        limit: 100
+        limit: ^limit
     )
   end
 

lib/emoji_web/components/components.ex

@@ -1,10 +1,15 @@
 defmodule EmojiWeb.Components do
+  import EmojiWeb.Gettext
   use EmojiWeb, :html
 
+  attr :class, :string, default: nil
+
   def emoji(assigns) do
     ~H"""
+    <div class={@class}>
       <.image id={@id} prediction={@prediction} />
       <.feedback id={@id} prediction={@prediction} />
+    </div>
     """
   end
 
@@ -16,7 +21,7 @@ defmodule EmojiWeb.Components do
 
   defp image(assigns) do
     ~H"""
-    <div class="group aspect-h-7 aspect-w-10 block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-black-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100">
+    <div class="group aspect-h-10 aspect-w-10 block overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-black-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100">
          <%= if is_nil(@prediction.emoji_output) and is_nil(@prediction.no_bg_output) do %>
            <div class="flex items-center justify-center h-36">
              <p class="animate-pulse ">Loading...</p>

lib/emoji_web/live/home_live.ex

@@ -12,7 +12,8 @@ defmodule EmojiWeb.HomeLive do
      |> assign(local_user_id: nil)
      |> assign(remove_bg: true)
      |> stream(:my_predictions, [])
-     |> stream(:featured_predictions, Predictions.list_featured_predictions())}
+     |> stream(:featured_predictions, Predictions.list_featured_predictions())
+     |> stream(:latest_predictions, Predictions.list_latest_safe_predictions(9))}
   end
 
   def handle_event("thumbs-up", %{"id" => id}, socket) do

lib/emoji_web/live/home_live.html.heex

@@ -51,6 +51,17 @@
       </li>
     </ul>
   </div>
+  <.header class="mt-12">Latest</.header>
+    <ul
+    id="latest-predictions"
+    phx-update="stream"
+    role="list"
+    class="mt-6 flex overflow-x-scroll gap-x-4 sm:gap-x-6"
+  >
+    <li :for={{id, prediction} <- @streams.latest_predictions} id={id} class="relative flex-none">
+      <EmojiWeb.Components.emoji id={id} class="w-52" prediction={prediction} />
+    </li>
+  </ul>
 
   <.header class="mt-12">Featured</.header>
   <ul