feat: add groups to member overview

lib/mv_web/live/member_live/index.html.heex

@@ -52,6 +52,22 @@
       query={@query}
       placeholder={gettext("Search...")}
     />
+    <form id="group-filter-form" phx-change="group_filter_changed" class="contents">
+      <select
+        name="group_filter"
+        class="select select-bordered select-sm max-w-xs"
+        aria-label={gettext("Filter by group")}
+      >
+        <option value="" selected={@group_filter == nil}>
+          {gettext("All groups")}
+        </option>
+        <%= for group <- @groups do %>
+          <option value={group.id} selected={@group_filter == to_string(group.id)}>
+            {group.name}
+          </option>
+        <% end %>
+      </select>
+    </form>
     <.live_component
       module={MvWeb.Components.MemberFilterComponent}
       id="member-filter"
@@ -310,6 +326,34 @@
         <span class="badge badge-ghost">{gettext("No cycle")}</span>
       <% end %>
     </:col>
+    <:col
+      :let={member}
+      label={
+        ~H"""
+        <.live_component
+          module={MvWeb.Components.SortHeaderComponent}
+          id={:sort_groups}
+          field={:groups}
+          label={gettext("Groups")}
+          sort_field={@sort_field}
+          sort_order={@sort_order}
+        />
+        """
+      }
+    >
+      <%= for group <- (member.groups || []) do %>
+        <span
+          class="badge badge-outline badge-primary"
+          role="status"
+          aria-label={gettext("Member of group %{name}", name: group.name)}
+        >
+          {group.name}
+        </span>
+      <% end %>
+      <%= if (member.groups || []) == [] do %>
+        <span class="text-base-content/50">—</span>
+      <% end %>
+    </:col>
     <:action :let={member}>
       <div class="sr-only">
         <.link navigate={~p"/members/#{member}"}>{gettext("Show")}</.link>