Show tech tags on project cards

lib/algora_web/live/orgs_live.ex

@@ -109,6 +109,15 @@ defmodule AlgoraWeb.OrgsLive do
                           <span class="line-clamp-3 pt-2 text-xs text-gray-300 sm:text-sm">
                             {org.bio}
                           </span>
+
+                          <div
+                            :if={display_tech_stack(org.tech_stack) != []}
+                            class="flex flex-wrap items-center justify-center gap-1.5 pt-3"
+                          >
+                            <%= for tech <- display_tech_stack(org.tech_stack) do %>
+                              <.tech_badge tech={tech} size="sm" />
+                            <% end %>
+                          </div>
                         </div>
                       </div>
                     </div>
@@ -137,4 +146,12 @@ defmodule AlgoraWeb.OrgsLive do
   end
 
   defp page_size, do: 9
+
+  defp display_tech_stack(tech_stack) do
+    tech_stack
+    |> List.wrap()
+    |> Enum.map(&String.trim/1)
+    |> Enum.reject(&(&1 == ""))
+    |> Enum.take(4)
+  end
 end

test/algora_web/live/orgs_live_test.exs

@@ -0,0 +1,32 @@
+defmodule AlgoraWeb.OrgsLiveTest do
+  use AlgoraWeb.ConnCase, async: false
+
+  import Algora.Factory
+  import Phoenix.LiveViewTest
+
+  test "renders project technology tags", %{conn: conn} do
+    user = insert(:user)
+
+    org =
+      insert(:organization,
+        display_name: "Golem Cloud",
+        handle: "golem-cloud",
+        featured: true,
+        tech_stack: ["Rust", "TypeScript"],
+        bio: "Build and deploy durable workers"
+      )
+
+    insert(:transaction, user: org, net_amount: Money.new(1000, :USD), type: :debit, status: :succeeded)
+
+    conn =
+      conn
+      |> Phoenix.ConnTest.init_test_session(%{})
+      |> AlgoraWeb.UserAuth.put_current_user(user)
+
+    {:ok, _view, html} = live(conn, ~p"/projects")
+
+    assert html =~ "Golem Cloud"
+    assert html =~ "Rust"
+    assert html =~ "TypeScript"
+  end
+end