First Fixes/Adjustments to the MelodyBuilder and SpeedCalc

frontend/src/melodies/MelodyForm.jsx

@@ -4,6 +4,7 @@ import api from "../api/client";
 import TranslationModal from "./TranslationModal";
 import SelectBuiltMelodyModal from "./builder/SelectBuiltMelodyModal";
 import BuildOnTheFlyModal from "./builder/BuildOnTheFlyModal";
+import SpeedCalculatorModal from "./SpeedCalculatorModal";
 import {
   getLocalizedValue,
   getLanguageName,
@@ -84,6 +85,8 @@ export default function MelodyForm() {
 
   const [showSelectBuilt, setShowSelectBuilt] = useState(false);
   const [showBuildOnTheFly, setShowBuildOnTheFly] = useState(false);
+  const [showSpeedCalc, setShowSpeedCalc] = useState(false);
+  const [builtMelody, setBuiltMelody] = useState(null);
 
   useEffect(() => {
     api.get("/settings/melody").then((ms) => {
@@ -124,6 +127,13 @@ export default function MelodyForm() {
       setPid(melody.pid || "");
       setMelodyStatus(melody.status || "published");
       setExistingFiles(files);
+      // Load built melody assignment (non-fatal)
+      try {
+        const bm = await api.get(`/builder/melodies/for-melody/${id}`);
+        setBuiltMelody(bm || null);
+      } catch {
+        setBuiltMelody(null);
+      }
     } catch (err) {
       setError(err.message);
     } finally {
@@ -259,6 +269,16 @@ export default function MelodyForm() {
           {isEdit ? "Edit Melody" : "Add Melody"}
         </h1>
         <div className="flex gap-3">
+          {isEdit && (
+            <button
+              type="button"
+              onClick={() => setShowSpeedCalc(true)}
+              className="px-4 py-2 text-sm rounded-md transition-colors"
+              style={{ backgroundColor: "var(--bg-card-hover)", color: "var(--text-primary)", border: "1px solid var(--border-primary)" }}
+            >
+              Speed Calculator
+            </button>
+          )}
           <button
             type="button"
             onClick={() => navigate(isEdit ? `/melodies/${id}` : "/melodies")}
@@ -610,6 +630,13 @@ export default function MelodyForm() {
 
       {isEdit && (
         <>
+          <SpeedCalculatorModal
+            open={showSpeedCalc}
+            melody={{ id, information, default_settings: settings, type, url, uid, pid }}
+            builtMelody={builtMelody}
+            onClose={() => setShowSpeedCalc(false)}
+            onSaved={() => { setShowSpeedCalc(false); loadMelody(); }}
+          />
           <SelectBuiltMelodyModal
             open={showSelectBuilt}
             melodyId={id}