fix: page following when its not authenticated

cesium · Sep 13, 2024 · 8f73f00 · 8f73f00
1 parent 0794f74
commit 8f73f00
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 15 deletions.
diff --git a/lib/atomic_web/components/unauthenticated.ex b/lib/atomic_web/components/unauthenticated.ex
@@ -0,0 +1,25 @@
+defmodule AtomicWeb.Components.Unauthenticated do
+  @moduledoc """
+  A component for displaying an unauthenticated state.
+  """
+  use AtomicWeb, :component
+
+  attr :id, :string, default: "unauthenticated-state", required: false
+  attr :url, :string, default: "users/sign_in", required: false
+
+  def unauthenticated_state(assigns) do
+    ~H"""
+    <div id={@id} class="text-center">
+      <.icon name={:user_circle} class="mx-auto h-12 w-12 text-zinc-400" />
+      <h3 class="mt-2 text-sm font-semibold text-zinc-900">You are not authenticated</h3>
+      <p class="mt-1 text-sm text-zinc-500">Please sign in to view this content.</p>
+      <div class="mt-4">
+        <.link navigate={Routes.user_session_path(AtomicWeb.Endpoint, :new)} class="inline-flex items-center rounded-md bg-orange-500 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-orange-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-orange-500">
+          <span class="text-sm font-semibold leading-6 mr-2" aria-hidden="true">Sign in</span>
+        <.icon name={:arrow_right_end_on_rectangle} solid class="h-5 w-5" />
+        </.link>
+      </div>
+    </div>
+    """
+  end
+end
diff --git a/lib/atomic_web/live/activity_live/form_component.ex b/lib/atomic_web/live/activity_live/form_component.ex
@@ -75,7 +75,7 @@ defmodule AtomicWeb.ActivityLive.FormComponent do
     consume_uploaded_entries(socket, :image, fn %{path: path}, entry ->
       Activities.update_activity_image(activity, %{
         "image" => %Plug.Upload{
-          content_type: entry.content_type,
+          content_type: entry.client_type,
           filename: entry.client_name,
           path: path
         }

diff --git a/lib/atomic_web/live/home_live/index.ex b/lib/atomic_web/live/home_live/index.ex
@@ -2,7 +2,7 @@ defmodule AtomicWeb.HomeLive.Index do
   @moduledoc false
   use AtomicWeb, :live_view
 
-  import AtomicWeb.Components.{Activity, Announcement, Tabs}
+  import AtomicWeb.Components.{Activity, Announcement, Tabs, Unauthenticated}
   import AtomicWeb.HomeLive.Components.{FollowSuggestions, Schedule}
 
   alias Atomic.Activities
@@ -71,6 +71,11 @@ defmodule AtomicWeb.HomeLive.Index do
   def handle_event("load-following", _, socket) when socket.assigns.current_tab == "following",
     do: {:noreply, socket}
 
+  def handle_event("load-following", _, socket) when socket.assigns.is_authenticated? == false,
+    do: {:noreply,
+     socket
+     |> assign(:current_tab, "following")}
+
   def handle_event("load-following", _, socket) do
     current_user = socket.assigns.current_user
 

diff --git a/lib/atomic_web/live/home_live/index.html.heex b/lib/atomic_web/live/home_live/index.html.heex
@@ -39,19 +39,25 @@
         </div>
         <!-- Feed -->
         <%= if @current_tab != "schedule" do %>
-          <ul id="feed" role="list" phx-update="stream" phx-viewport-bottom="load-more">
-            <li :for={{id, post} <- @streams.posts} id={id} class="py-4 px-4 mx-auto max-w-5xl border-b border-gray-200 sm:px-6 lg:px-8">
-              <%= if post.type == :activity do %>
-                <.link navigate={Routes.activity_show_path(@socket, :show, post.activity)}>
-                  <.activity activity={post.activity} />
-                </.link>
-              <% else %>
-                <.link navigate={Routes.announcement_show_path(@socket, :show, post.announcement)}>
-                  <.announcement announcement={post.announcement} />
-                </.link>
-              <% end %>
-            </li>
-          </ul>
+          <%= if @is_authenticated? == false && @current_tab == "following" do %>
+            <div class="mt-6">
+              <.unauthenticated_state />
+            </div>
+          <% else %>
+            <ul id="feed" role="list" phx-update="stream" phx-viewport-bottom="load-more">
+              <li :for={{id, post} <- @streams.posts} id={id} class="py-4 px-4 mx-auto max-w-5xl border-b border-gray-200 sm:px-6 lg:px-8">
+                <%= if post.type == :activity do %>
+                  <.link navigate={Routes.activity_show_path(@socket, :show, post.activity)}>
+                    <.activity activity={post.activity} />
+                  </.link>
+                <% else %>
+                  <.link navigate={Routes.announcement_show_path(@socket, :show, post.announcement)}>
+                    <.announcement announcement={post.announcement} />
+                  </.link>
+                <% end %>
+              </li>
+            </ul>
+          <% end %>
         <% else %>
           <.schedule schedule={@schedule} />
         <% end %>