Sort libraries by supported and usages

extensions/ql-vscode/src/data-extensions-editor/bqrs.ts

@@ -47,17 +47,5 @@ export function decodeBqrsToExternalApiUsages(
     method.usages.push(usage);
   });
 
-  const externalApiUsages = Array.from(methodsByApiName.values());
-  externalApiUsages.sort((a, b) => {
-    // Sort first by supported, putting unmodeled methods first.
-    if (a.supported && !b.supported) {
-      return 1;
-    }
-    if (!a.supported && b.supported) {
-      return -1;
-    }
-    // Then sort by number of usages descending
-    return b.usages.length - a.usages.length;
-  });
-  return externalApiUsages;
+  return Array.from(methodsByApiName.values());
 }

extensions/ql-vscode/src/view/data-extensions-editor/ModeledMethodDataGrid.tsx

@@ -7,6 +7,7 @@ import {
 import { MethodRow } from "./MethodRow";
 import { ExternalApiUsage } from "../../data-extensions-editor/external-api-usage";
 import { ModeledMethod } from "../../data-extensions-editor/modeled-method";
+import { useMemo } from "react";
 
 type Props = {
   externalApiUsages: ExternalApiUsage[];
@@ -22,6 +23,22 @@ export const ModeledMethodDataGrid = ({
   modeledMethods,
   onChange,
 }: Props) => {
+  const sortedExternalApiUsages = useMemo(() => {
+    const sortedExternalApiUsages = [...externalApiUsages];
+    sortedExternalApiUsages.sort((a, b) => {
+      // Sort first by supported, putting unmodeled methods first.
+      if (a.supported && !b.supported) {
+        return 1;
+      }
+      if (!a.supported && b.supported) {
+        return -1;
+      }
+      // Then sort by number of usages descending
+      return b.usages.length - a.usages.length;
+    });
+    return sortedExternalApiUsages;
+  }, [externalApiUsages]);
+
   return (
     <VSCodeDataGrid>
       <VSCodeDataGridRow rowType="header">
@@ -47,7 +64,7 @@ export const ModeledMethodDataGrid = ({
           Kind
         </VSCodeDataGridCell>
       </VSCodeDataGridRow>
-      {externalApiUsages.map((externalApiUsage) => (
+      {sortedExternalApiUsages.map((externalApiUsage) => (
         <MethodRow
           key={externalApiUsage.signature}
           externalApiUsage={externalApiUsage}

extensions/ql-vscode/src/view/data-extensions-editor/ModeledMethodsList.tsx

@@ -4,6 +4,7 @@ import styled from "styled-components";
 import { ExternalApiUsage } from "../../data-extensions-editor/external-api-usage";
 import { ModeledMethod } from "../../data-extensions-editor/modeled-method";
 import { ModeledMethodDataGrid } from "./ModeledMethodDataGrid";
+import { calculateModeledPercentage } from "./modeled";
 
 const LibraryContainer = styled.div`
   margin-bottom: 1rem;
@@ -35,7 +36,34 @@ export const ModeledMethodsList = ({
   }, [externalApiUsages]);
 
   const sortedLibraryNames = useMemo(() => {
-    return Object.keys(groupedByLibrary).sort();
+    return Object.keys(groupedByLibrary).sort((a, b) => {
+      const supportedPercentageA = calculateModeledPercentage(
+        groupedByLibrary[a],
+      );
+      const supportedPercentageB = calculateModeledPercentage(
+        groupedByLibrary[b],
+      );
+
+      // Sort first by supported percentage ascending
+      if (supportedPercentageA > supportedPercentageB) {
+        return 1;
+      }
+      if (supportedPercentageA < supportedPercentageB) {
+        return -1;
+      }
+
+      const numberOfUsagesA = groupedByLibrary[a].reduce(
+        (acc, curr) => acc + curr.usages.length,
+        0,
+      );
+      const numberOfUsagesB = groupedByLibrary[b].reduce(
+        (acc, curr) => acc + curr.usages.length,
+        0,
+      );
+
+      // Then sort by number of usages descending
+      return numberOfUsagesB - numberOfUsagesA;
+    });
   }, [groupedByLibrary]);
 
   return (

extensions/ql-vscode/test/unit-tests/data-extensions-editor/bqrs.test.ts

@@ -168,6 +168,26 @@ describe("decodeBqrsToExternalApiUsages", () => {
     // - Iterating over a map (as done by .values()) is guaranteed to be in insertion order
     // - Sorting the array of usages is guaranteed to be a stable sort
     expect(decodeBqrsToExternalApiUsages(chunk)).toEqual([
+      {
+        signature: "java.io.PrintStream#println(String)",
+        packageName: "java.io",
+        typeName: "PrintStream",
+        methodName: "println",
+        methodParameters: "(String)",
+        supported: true,
+        usages: [
+          {
+            label: "println(...)",
+            url: {
+              uri: "file:/home/runner/work/sql2o-example/sql2o-example/src/main/java/org/example/HelloController.java",
+              startLine: 29,
+              startColumn: 9,
+              endLine: 29,
+              endColumn: 49,
+            },
+          },
+        ],
+      },
       {
         signature:
           "org.springframework.boot.SpringApplication#run(Class,String[])",
@@ -279,26 +299,6 @@ describe("decodeBqrsToExternalApiUsages", () => {
           },
         ],
       },
-      {
-        signature: "java.io.PrintStream#println(String)",
-        packageName: "java.io",
-        typeName: "PrintStream",
-        methodName: "println",
-        methodParameters: "(String)",
-        supported: true,
-        usages: [
-          {
-            label: "println(...)",
-            url: {
-              uri: "file:/home/runner/work/sql2o-example/sql2o-example/src/main/java/org/example/HelloController.java",
-              startLine: 29,
-              startColumn: 9,
-              endLine: 29,
-              endColumn: 49,
-            },
-          },
-        ],
-      },
       {
         signature: "org.sql2o.Sql2o#Sql2o(String,String,String)",
         packageName: "org.sql2o",