feat(front): add members download button (#664)

## 📝 Description
- Add members download button on people page
- Implement export members as csv endpoint
- Add export members test

## ✅ Checklist
- [x] I have tested this change
- [ ] This change requires documentation update

Author: loadez

front/assets/js/service_accounts/components/ServiceAccountsList.tsx

@@ -72,15 +72,23 @@ export const ServiceAccountsList = ({
             <div className="b">Service Accounts</div>
           </div>
         </div>
-        {config.permissions.canManage && (
-          <button
-            className="btn btn-primary flex items-center"
-            onClick={onCreateNew}
-          >
-            <span className="material-symbols-outlined mr2">smart_toy</span>
-            Create Service Account
-          </button>
-        )}
+        <div className="flex">
+          {config.isOrgScope && (
+            <a aria-label="Download service accounts as CSV" title="Download service accounts as CSV" className="pointer flex items-center btn-secondary btn nowrap mr2" href={config.urls.export}>
+              <span className="material-symbols-outlined ">download</span>
+              Download .csv
+            </a>
+          )}
+          {config.permissions.canManage && (
+            <button
+              className="btn btn-primary flex items-center"
+              onClick={onCreateNew}
+            >
+              <span className="material-symbols-outlined mr2">smart_toy</span>
+              Create Service Account
+            </button>
+          )}
+        </div>
       </div>
 
       {serviceAccounts.length === 0 ? (

front/assets/js/service_accounts/config.ts

@@ -19,6 +19,7 @@ export class AppConfig {
       urls: {
         list: `/service_accounts`,
         create: `/service_accounts`,
+        export: `/service_accounts/export`,
         update: (id: string) => `/service_accounts/${id}`,
         delete: (id: string) => `/service_accounts/${id}`,
         regenerateToken: (id: string) =>

front/assets/js/service_accounts/types.ts

@@ -59,6 +59,7 @@ export interface Config {
   urls: {
     list: string;
     create: string;
+    export: string;
     update: (id: string) => string;
     delete: (id: string) => string;
     regenerateToken: (id: string) => string;

front/lib/front_web/controllers/people_controller.ex

@@ -24,8 +24,12 @@ defmodule FrontWeb.PeopleController do
   plug(FetchPermissions, [scope: "org"] when action in @person_action)
   plug(PageAccess, [permissions: "organization.view"] when action in @person_action)
 
-  plug(FetchPermissions, [scope: "org"] when action in [:organization])
-  plug(PageAccess, [permissions: "organization.view"] when action in [:organization])
+  plug(FetchPermissions, [scope: "org"] when action in [:organization, :organization_users])
+
+  plug(
+    PageAccess,
+    [permissions: "organization.view"] when action in [:organization, :organization_users]
+  )
 
   plug(
     FetchPermissions,
@@ -1061,6 +1065,51 @@ defmodule FrontWeb.PeopleController do
     end)
   end
 
+  def organization_users(conn, _params) do
+    Watchman.benchmark("people.organization_users.duration", fn ->
+      org_id = conn.assigns.organization_id
+
+      page_size = 100
+
+      data =
+        Stream.unfold(0, fn
+          nil ->
+            nil
+
+          page_no ->
+            case Members.list_org_members(org_id, page_no: page_no, page_size: page_size) do
+              {:ok, {members, total_pages}} ->
+                {members, next_valid_page_or_nil(total_pages, page_no)}
+
+              _ ->
+                nil
+            end
+        end)
+        |> Enum.flat_map(& &1)
+        |> Enum.map(fn e ->
+          %{
+            "name" => e.name,
+            "email" => e.email,
+            "github_login" => e.github_login,
+            "bitbucket_login" => e.bitbucket_login,
+            "gitlab_login" => e.gitlab_login
+          }
+        end)
+        |> CSV.encode(
+          headers: [
+            "name",
+            "email",
+            "github_login",
+            "bitbucket_login",
+            "gitlab_login"
+          ]
+        )
+        |> Enum.to_list()
+
+      send_download(conn, {:binary, data}, filename: "users.csv")
+    end)
+  end
+
   def sync(conn, %{"format" => "json"}) do
     Watchman.benchmark("sync.organization.duration", fn ->
       org_id = conn.assigns.organization_id
@@ -1213,4 +1262,14 @@ defmodule FrontWeb.PeopleController do
     email_regex = ~r/^[^\s@]+@[^\s@]+\.[^\s@]+$/
     Regex.match?(email_regex, email)
   end
+
+  defp next_valid_page_or_nil(total_pages, page) do
+    next_page_no = page + 1
+
+    if next_page_no <= total_pages do
+      next_page_no
+    else
+      nil
+    end
+  end
 end

front/lib/front_web/controllers/service_account_controller.ex

@@ -138,4 +138,55 @@ defmodule FrontWeb.ServiceAccountController do
         |> json(%{error: message})
     end
   end
+
+  def export(conn, _params) do
+    org_id = conn.assigns.organization_id
+
+    data =
+      Stream.unfold(1, fn
+        nil ->
+          nil
+
+        page ->
+          case Models.ServiceAccount.list(org_id, page) do
+            {:ok, {service_accounts, total_pages}} ->
+              {service_accounts, next_valid_page_or_nil(total_pages, page)}
+
+            _ ->
+              nil
+          end
+      end)
+      |> Enum.flat_map(& &1)
+      |> Enum.map(fn e ->
+        %{
+          "name" => e.name,
+          "description" => e.description,
+          "deactivated" => e.deactivated,
+          "created_at" => e.created_at,
+          "updated_at" => e.created_at
+        }
+      end)
+      |> CSV.encode(
+        headers: [
+          "name",
+          "description",
+          "deactivated",
+          "created_at",
+          "updated_at"
+        ]
+      )
+      |> Enum.to_list()
+
+    send_download(conn, {:binary, data}, filename: "service_accounts.csv")
+  end
+
+  defp next_valid_page_or_nil(total_pages, page) do
+    next_page_no = page + 1
+
+    if next_page_no <= total_pages do
+      next_page_no
+    else
+      nil
+    end
+  end
 end

front/lib/front_web/router.ex

@@ -152,6 +152,7 @@ defmodule FrontWeb.Router do
 
     scope "/people" do
       get("/", PeopleController, :organization)
+      get("/export", PeopleController, :organization_users)
       post("/", PeopleController, :create)
       post("/refresh", PeopleController, :refresh)
       post("/assign_role", PeopleController, :assign_role)
@@ -175,6 +176,7 @@ defmodule FrontWeb.Router do
     scope "/service_accounts" do
       get("/", ServiceAccountController, :index)
       post("/", ServiceAccountController, :create)
+      get("/export", ServiceAccountController, :export)
       get("/:id", ServiceAccountController, :show)
       put("/:id", ServiceAccountController, :update)
       delete("/:id", ServiceAccountController, :delete)

front/lib/front_web/templates/people/members/members_list.html.eex

@@ -32,7 +32,15 @@
           <div class="b">People</div>
         </div>
       </div>
-      <%= render "members/_add_people_button.html", conn: @conn, org_scope?: @org_scope?, permissions: @permissions %>
+      <div class="flex">
+      <%= if @org_scope? do %>
+        <%= link to: people_path(@conn, :organization_users), class: "pointer flex items-center btn-secondary btn nowrap mr2", aria_label: "Download members as CSV", title: "Download members as CSV" do %>
+          <span class="material-symbols-outlined ">download</span>
+          Download .csv
+        <% end %>
+      <% end %>
+        <%= render "members/_add_people_button.html", conn: @conn, org_scope?: @org_scope?, permissions: @permissions %>
+      </div>
     </div>
 
     <div id="members">

front/test/front_web/controllers/people_controller_test.exs

@@ -36,6 +36,46 @@ defmodule FrontWeb.PeopleControllerTest do
     ]
   end
 
+  describe "GET organization_users" do
+    test "when the user can't access the org => returns 404", %{
+      conn: conn
+    } do
+      PermissionPatrol.remove_all_permissions()
+
+      conn =
+        conn
+        |> get("/people/export")
+
+      assert html_response(conn, 404) =~ "404"
+    end
+
+    test "when the user can access the org => send csv", %{
+      conn: conn
+    } do
+      conn =
+        conn
+        |> get("/people/export")
+
+      assert response_content_type(conn, :csv)
+
+      rows =
+        conn.resp_body
+        |> String.split("\r\n", trim: true)
+        |> CSV.decode!(validate_row_length: true, headers: true)
+        |> Enum.to_list()
+
+      assert length(rows) == 8
+
+      first = List.first(rows)
+
+      assert Map.has_key?(first, "name")
+      assert Map.has_key?(first, "email")
+      assert Map.has_key?(first, "github_login")
+      assert Map.has_key?(first, "bitbucket_login")
+      assert Map.has_key?(first, "gitlab_login")
+    end
+  end
+
   describe "GET show" do
     test "when the user can't access the org => returns 404", %{
       conn: conn,

front/test/front_web/controllers/service_account_controller_test.exs

@@ -268,6 +268,65 @@ defmodule FrontWeb.ServiceAccountControllerTest do
     end
   end
 
+  describe "GET /service_accounts/export" do
+    test "requires service_accounts.view permission", %{
+      conn: conn,
+      org_id: org_id,
+      user_id: user_id
+    } do
+      Support.Stubs.PermissionPatrol.remove_all_permissions()
+      Support.Stubs.PermissionPatrol.add_permissions(org_id, user_id, ["organization.view"])
+
+      conn = get(conn, "/service_accounts/export")
+
+      assert html_response(conn, 404) =~ "Page not found"
+    end
+
+    test "when the user can access the org => send csv", %{
+      conn: conn,
+      org_id: org_id,
+      user_id: user_id
+    } do
+      Support.Stubs.PermissionPatrol.add_permissions(org_id, user_id, ["organization.view"])
+
+      expect(ServiceAccountMock, :describe_many, fn members ->
+        service_accounts =
+          Enum.map(members, fn member_id ->
+            %InternalApi.ServiceAccount.ServiceAccount{
+              id: member_id,
+              name: "Test Service Account",
+              description: "Test description",
+              org_id: org_id,
+              creator_id: "",
+              created_at: %Google.Protobuf.Timestamp{seconds: 1_704_103_200},
+              updated_at: %Google.Protobuf.Timestamp{seconds: 1_704_103_200},
+              deactivated: false
+            }
+          end)
+
+        {:ok, service_accounts}
+      end)
+
+      conn = get(conn, "/service_accounts/export")
+
+      rows =
+        conn.resp_body
+        |> String.split("\r\n", trim: true)
+        |> CSV.decode!(validate_row_length: true, headers: true)
+        |> Enum.to_list()
+
+      assert length(rows) == 3
+
+      first = List.first(rows)
+
+      assert Map.has_key?(first, "name")
+      assert Map.has_key?(first, "description")
+      assert Map.has_key?(first, "deactivated")
+      assert Map.has_key?(first, "created_at")
+      assert Map.has_key?(first, "updated_at")
+    end
+  end
+
   describe "PUT /service_accounts/:id" do
     setup %{org_id: org_id, user_id: user_id} do
       Support.Stubs.PermissionPatrol.add_permissions(org_id, user_id, [