governance_team.eml

let contact_icon (kind : Data.Governance.contact_kind) = match kind with
  | GitHub -> Icons.github
  | Email -> Icons.email
  | Discord -> Icons.discord
  | Chat -> Icons.chat

let render_team_member ~default_role (member : Data.Governance.Member.t) =
  <a href="https://github.com/<%s member.github %>" class="flex gap-x-2 p-4 card dark:dark-card">
    <img src="https://github.com/<%s member.github %>.png" alt="" class="h-32 w-32 mr-3 inline-block rounded-full">
    <div class="flex flex-col h-full">
      <div class="text-title dark:text-dark-title text-xl mt-3"><%s member.name %></div>
      <div class="text-sm text-content dark:text-dark-content"><%s Option.value ~default:default_role member.role %></div>
      <div class="mt-auto text-primary dark:text-dark-primary items-center flex gap-1">
        <%s! Icons.github "h-6 w-6" %>
        <p><%s member.github %></p>
      </div>
    </div>
  </a>

let render_dev_meeting (dev_meeting : Data.Governance.dev_meeting) _class =
  <div class="gap-4 <%s _class %>">
    <div class="flex gap-1 text-content dark:text-dark-content"><%s dev_meeting.date %> - <%s dev_meeting.time %></div>
    <div class="flex gap-4">
      <a class="flex gap-1 py-2 font-semibold text-primary dark:text-dark-title hover:underline dark:underline hover:text-primary dark:hover:text-dark-primary" href="<%s dev_meeting.notes %>">
        <%s! Icons.document "w-6 h-6" %>
        Notes
      </a>
      <a class="flex gap-1 py-2 font-semibold text-primary dark:text-dark-title hover:underline dark:underline hover:text-primary dark:hover:text-dark-primary" href="<%s dev_meeting.link %>">
        <%s! Icons.community "w-6 h-6" %>
        Meeting Link
      </a>
      <% match dev_meeting.calendar with | None -> () | Some calendar -> %>
      <a class="flex gap-1 py-2 font-semibold text-primary dark:text-dark-title hover:underline dark:underline hover:text-primary dark:hover:text-dark-primary" href="<%s calendar %>">
        <%s! Icons.calendar "w-6 h-6" %>
        Calendar Invite
      </a>
      <% ; %>
    </div>
  </div>

(* Define a string index map for members *)
module MemberMap = Map.Make (String)

let flatten_subteams (team : Data.Governance.team) =
  let open Data.Governance in
  List.fold_left
    (fun acc subteam ->
      List.fold_left
        (fun acc member ->
          MemberMap.update
            (member.Member.github : string)
            (fun m ->
              match m with
              | None -> Some (member, [ subteam.name ])
              | Some (m, subteams) -> Some (m, subteam.name :: subteams))
            acc)
        acc subteam.members)
    (team.members
    |> List.map (fun m -> (m.Member.github, (m, [])))
    |> List.to_seq |> MemberMap.of_seq )
    team.subteams
  |> MemberMap.bindings |> List.map snd
  |> List.map (fun (member, subteams) ->
         {
           member with
           Member.role =
             Some
               (Option.value
                  ~default:team.default_role
                  member.Member.role
               ^ " ("
               ^ String.concat ", " (List.rev subteams)
               ^ ")");
         })

let render_subteam (team : Data.Governance.team) =
  <div class="border-b last:border-b-0 border-separator_20 dark:border-dark-separator_30">
    <h3 class="gradient font-semibold text-3xl mb-4 text-title dark:text-dark-title" id="<%s team.name %>"><%s team.name %></h3>
    <p class="text-content dark:text-dark-content my-4"><%s team.description %></p>
    <% (if List.length team.contacts > 0 then %>
      <span class="flex gap-x-8">
      <% team.contacts |> List.iter (fun (contact : Data.Governance.contact) -> %>
        <a class="btn gap-1" href="<%s contact.link %>" target="_blank">
          <%s! contact_icon contact.kind "w-6 h-6" %>
          <%s contact.name %>
        </a>
        <% ); %>
      </span>
      <% ); %>
    <% (match team.dev_meeting with | None -> () | Some dev_meeting -> %>
    <div class="py-4 mt-6">
      <h4 class="font-semibold mb-4 text-2xl text-title dark:text-dark-title">Dev Meeting</h4>
      <%s! render_dev_meeting dev_meeting "" %>
    </div>
    <% ); %>
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10 mt-6 mb-4 pb-12">
      <%s! (if team.subteams = [] then team.members else flatten_subteams team)
      |> List.map (fun (member : Data.Governance.Member.t) -> render_team_member ~default_role:team.default_role member )
      |> String.concat "\n" %>
    </div>
  </div>

let render (t : Data.Governance.team) =
Layout.render
~title:(Printf.sprintf "%s · Rocq Governance" t.name)
~description:t.description @@
<div class="w-full">
  <div class="lg:col-span-8 lg:text-left intro-section-simple dark:dark-intro-section-simple w-full">
    <div class="container-fluid">
      <div class="flex justify-start gap-x-3 items-center text-primary dark:text-dark-primary hover:underline font-semibold mb-4 h-12">
        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24"
          stroke="currentColor">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18">
          </path>
        </svg>
        <a href="<%s Url.rocq_team None %>" class="hover:underline">Back to Governance</a>
      </div>
      <div class="flex flex-col md:flex-row gap-8 mb-8 md:items-center">
        <div class="md:max-w-[70%]">
          <h1 class="font-bold pb-2 text-title dark:text-dark-title"><%s t.name %></h1>
          <div class="text-content dark:text-dark-content">
            <%s t.description%>
          </div>
        </div>
        <div class="flex flex-wrap gap-x-4 mt-8 md:mt-0">
          <% t.contacts |> List.iter (fun (contact : Data.Governance.contact) -> %>
          <div class="flex h-max flex-col lg:flex-row lg:space-x-6 space-y-5 lg:space-y-0 md:space-y-5 w-full lg:w-auto">
            <%s!  Hero_section.hero_button ~left_icon:(contact_icon contact.kind "w-5 h-5") ~right_icon:("") ~text:(contact.name) ~href:(contact.link) "" %>
          <% ); %>
          </div>    
        </div>
      </div>
    </div>
  </div>
</div>
<div class="bg-background dark:bg-dark-background">
  <div class="py-2">
    <div class="container-fluid">
      <% (match t.dev_meeting with | None -> () | Some dev_meeting -> %>
      <h2 class="font-bold gradient mb-6 mt-6 md:mt-8 text-4xl text-title dark:text-dark-title">Dev Meeting</h2>
      <%s! render_dev_meeting dev_meeting "text-white mb-6" %>
      <% ); %>

      <% (match List.length t.members with | 0 -> () | _ -> %>
     <div class="">
      <h2 class="font-bold gradient mb-6 mt-6 md:mt-8 text-4xl text-title dark:text-dark-title">People</h2>
      <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-12 mb-4">
        <%s! t.members |> List.map (fun (member : Data.Governance.Member.t) -> render_team_member ~default_role:t.default_role member ) |> String.concat "\n" %>
      </div>
     </div>
      <% ); %>

      <% (match List.length t.subteams with | 0 -> () | _ -> %>
      <h2 class="font-bold gradient mb-6 mt-6 md:mt-8 text-4xl text-title dark:text-dark-title">Teams</h2>
      <div class="flex flex-col gap-12">
        <% t.subteams |> List.iter (fun (team : Data.Governance.team) -> %>
        <%s! render_subteam team %>
        <% ); %>
      </div>
      <% ); %>
    </div>
  </div>
</div>