Update sorting strategy

When Javascript is off, companies are sorted by descending number of
devs. When Javascript is on, the first company is always the biggest
one, then each subsequent company in the sorted list has a 50% chance of
getting skipped, and this is carried out until 5 companies are chosen.
This means that predominantly large companies will be shown, but
everyone has a chance to get shown.

src/components/Leaderboard.astro

@@ -10,7 +10,7 @@ const { grouped } = Astro.props;
 
 import LeaderboardMember from "./LeaderboardMember.astro";
 import {
-  getMembers, formatDevGroupBounds, filterInactiveMembers, groupMembers, sortMembers, DEV_GROUP_BOUNDS
+  getMembers, formatDevGroupBounds, filterInactiveMembers, groupMembers, sortMembersByDollarsPerDev, DEV_GROUP_BOUNDS
 } from '../members.ts';
 
 const members = await getMembers();
@@ -27,7 +27,7 @@ const members = await getMembers();
         </tr>
       </thead>
       <tbody>
-        {sortMembers(groupMembers).map((member) =>
+        {sortMembersByDollarsPerDev(groupMembers).map((member) =>
           <LeaderboardMember member={member}></LeaderboardMember>
         )}
       </tbody>
@@ -42,7 +42,7 @@ const members = await getMembers();
       </tr>
     </thead>
     <tbody>
-      {sortMembers(filterInactiveMembers(members)).map((member) => <tr>
+      {sortMembersByDollarsPerDev(filterInactiveMembers(members)).map((member) => <tr>
         <LeaderboardMember member={member}></LeaderboardMember>
       </tr>)}
     </tbody>

src/components/MiniLeaderboard.astro

@@ -3,23 +3,11 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import {
-  getMembers, filterInactiveMembers, sortMembers,
-  getDollarsPerDev, fmtCurrency
+  getMembers, filterInactiveMembers, getDollarsPerDev, fmtCurrency, sortMembersByDevs,
 } from '../members.ts';
 
-const members = await getMembers();
-
-function shuffle(array: any[]) {
-    for (let i = array.length - 1; i >= 0; i--) {
-        let j = Math.floor(Math.random() * (i + 1));
-        let temp = array[i];
-        array[i] = array[j];
-        array[j] = temp;
-    }
-    return array;
-}
-
-const N_TO_SHOW = 5;
+const N_TO_CHOOSE = 5;
+const members = sortMembersByDevs(filterInactiveMembers(await getMembers()));
 ---
 
 <table class="mini-leaderboard table--lr">
@@ -30,7 +18,7 @@ const N_TO_SHOW = 5;
     </tr>
   </thead>
   <tbody>
-    {shuffle(sortMembers(filterInactiveMembers(members))).map((member, idx) => <tr hidden={ idx >= N_TO_SHOW }>
+    {members.map((member, idx) => <tr hidden={idx >= N_TO_CHOOSE}>
       <td>
         <a class="sneaky" href={`/members/${member.id}`}>
           <img src={member.data.urlSquareLogoWithBackground} alt={`The ${member.data.name} logo`}>
@@ -65,20 +53,22 @@ const N_TO_SHOW = 5;
 </style>
 
 <script>
-  const N_TO_SHOW = 5;
+  const N_TO_CHOOSE = 5;
+  const PROBABILITY_TO_SKIP = 0.5;
+
   const $miniLeaderboards = document.querySelectorAll<HTMLElement>('.mini-leaderboard');
   $miniLeaderboards.forEach(($miniLeaderboard) => {
     const $rows = $miniLeaderboard.querySelectorAll<HTMLElement>('tbody tr');
-    const rowIds = [...Array($rows.length).keys()];
-    let rowsToShow = [];
-    for (let i = 0; i < N_TO_SHOW; i++) {
-      const randomIdx = Math.round(Math.random() * (rowIds.length - 1));
-      rowsToShow.push(rowIds[randomIdx]);
-      rowIds.splice(randomIdx, 1);
-    }
+    let nChosen = 0;
+    const nTotal = $rows.length;
     $rows.forEach(($row, idx) => {
-      if (rowsToShow.includes(idx)) {
+      const mustChoose = idx == 0 || (N_TO_CHOOSE - nChosen == nTotal - idx);
+      const mustNotChoose = nChosen == N_TO_CHOOSE;
+      if (mustNotChoose) {
+        $row.hidden = true;
+      } else if (mustChoose || Math.random() < PROBABILITY_TO_SKIP) {
         $row.hidden = false;
+        nChosen++;
       } else {
         $row.hidden = true;
       }

src/members.ts

@@ -102,10 +102,27 @@ export function groupMembers(members: MemberWithId[]): MemberWithId[][] {
   return groups;
 }
 
+/**
+ * Sorts members by the average number of devs in their latest annual report.
+ */
+export function sortMembersByDevs(members: MemberWithId[]): MemberWithId[] {
+  return members.toSorted((m1, m2) => {
+    if (m1.data.annualReports.length == 0) {
+      return 1;
+    }
+    if (m2.data.annualReports.length == 0) {
+      return -1;
+    }
+    const devs1 = m1.data.annualReports[0].averageNumberOfDevs;
+    const devs2 = m2.data.annualReports[0].averageNumberOfDevs;
+    return devs2 - devs1;
+  });
+}
+
 /**
  * Sorts members by the dollars per dev donated in their latest annual report.
  */
-export function sortMembers(members: MemberWithId[]): MemberWithId[] {
+export function sortMembersByDollarsPerDev(members: MemberWithId[]): MemberWithId[] {
   return members.toSorted((m1, m2) => {
     if (m1.data.annualReports.length == 0) {
       return 1;