diff --git a/src/components/AppBar.js b/src/components/AppBar.js
index 5355cc3..c61d4d2 100644
--- a/src/components/AppBar.js
+++ b/src/components/AppBar.js
@@ -48,7 +48,7 @@ function HarmonyAppBar() {
.then((ver) => {
setApiVersion(ver);
})
- .catch((e) => setError("ERROR: API unreachable"));
+ .catch((e) => setError("ERROR: API unreachable (version)"));
}, [getVersion]);
React.useEffect(() => {
@@ -56,7 +56,7 @@ function HarmonyAppBar() {
.then((models) => {
setAllModels(models);
})
- .catch((e) => setError("ERROR: API unreachable"));
+ .catch((e) => setError("ERROR: API unreachable (models)"));
}, [getModels]);
const handleModelSelect = (event) => {
diff --git a/src/components/InstrumentSimilarities.js b/src/components/InstrumentSimilarities.js
new file mode 100644
index 0000000..c9ed9c9
--- /dev/null
+++ b/src/components/InstrumentSimilarities.js
@@ -0,0 +1,54 @@
+import React from "react";
+import { Card, Box, Typography, Chip, Stack, Divider } from "@mui/material";
+
+export default function InstrumentSimilarities({ similarities }) {
+ if (!similarities || !similarities.length) return null;
+
+ return (
+
+
+ Instrument similarities
+
+
+ These scores indicate how similar each pair of instruments is overall.
+
+
+ } spacing={1}>
+ {similarities.map((s, idx) => (
+
+
+ {s.instrument_1_name} ↔ {s.instrument_2_name}
+
+
+ {typeof s.f1 !== "undefined" && (
+
+ )}
+ {typeof s.precision !== "undefined" && (
+
+ )}
+ {typeof s.recall !== "undefined" && (
+
+ )}
+
+
+ ))}
+
+
+ );
+}
+
+function roundPct(value) {
+ // If value appears already in percentage form (0-100), cap and show; otherwise convert from 0-1
+ const v = value > 1 ? value : value * 100;
+ return `${Math.round(v)}%`;
+}
diff --git a/src/components/Results.js b/src/components/Results.js
index b9d3aef..7595548 100644
--- a/src/components/Results.js
+++ b/src/components/Results.js
@@ -5,6 +5,7 @@ import { useParams } from "react-router-dom";
import { useData } from "../contexts/DataContext";
import AlertDialogSlide from "./Dialog";
import InlineFeedback from "./InlineFeedback";
+import InstrumentSimilarities from "./InstrumentSimilarities";
import ResultsOptions from "./ResultsOptions";
import { parse, test } from "liqe";
@@ -313,6 +314,11 @@ export default function Results({
state={computedMatches && computedMatches.length > 0}
/>
)}
+
+ {/* New: Instrument-to-instrument similarities */}
+ {apiData && apiData.instrumentSimilarities && (
+
+ )}
{topics && topics.length > 0 && (
controller.abort(), timeout);
+ console.log("GET:", url);
response = await fetch(url, {
method: "GET",
mode: "cors",
diff --git a/src/utilities/simplifyApi.js b/src/utilities/simplifyApi.js
index 2815012..cdaecbb 100644
--- a/src/utilities/simplifyApi.js
+++ b/src/utilities/simplifyApi.js
@@ -29,5 +29,9 @@ export function simplifyApi(apiResult, apiCall) {
});
instruments.push(instrument);
});
- return { instruments: instruments };
+ // Pass through instrument-to-instrument similarities if present from API
+ // Expecting shape: [{ instrument_1_name, instrument_2_name, precision, recall, f1, ... }]
+ const instrumentSimilarities =
+ apiResult.instrument_to_instrument_similarities || [];
+ return { instruments: instruments, instrumentSimilarities };
}