Show project tech tags on project cards

lib/algora_web/live/orgs_live.ex

@@ -109,6 +109,18 @@ defmodule AlgoraWeb.OrgsLive do
                           <span class="line-clamp-3 pt-2 text-xs text-gray-300 sm:text-sm">
                             {org.bio}
                           </span>
+
+                          <div
+                            :if={org.tech_stack != []}
+                            class="flex flex-wrap items-center justify-center gap-1.5 pt-3"
+                          >
+                            <span
+                              :for={tech <- Enum.take(org.tech_stack, 4)}
+                              class="rounded-full border border-white/10 bg-white/[6%] px-2 py-0.5 text-[0.6875rem] font-medium leading-5 text-gray-200"
+                            >
+                              {tech}
+                            </span>
+                          </div>
                         </div>
                       </div>
                     </div>

test/algora_web/live/orgs_live_test.exs

@@ -0,0 +1,29 @@
+defmodule AlgoraWeb.OrgsLiveTest do
+  use AlgoraWeb.ConnCase
+
+  import Algora.Factory
+  import Phoenix.LiveViewTest
+
+  test "renders project technology tags", %{conn: conn} do
+    org =
+      insert(:organization,
+        display_name: "Kyo",
+        handle: "kyo",
+        tech_stack: ["Scala", "TypeScript"],
+        featured: true
+      )
+
+    insert!(:transaction,
+      user: org,
+      net_amount: Money.new(1000, :USD),
+      type: :debit,
+      status: :succeeded
+    )
+
+    {:ok, _view, html} = live(conn, ~p"/projects")
+
+    assert html =~ "Kyo"
+    assert html =~ "Scala"
+    assert html =~ "TypeScript"
+  end
+end