Align scene ids with names and order

scenes/index.js

@@ -1,10 +1,27 @@
 (() => {
   const scenes = window.PhysilinksSceneDefs || [];
-  const gridDefault = scenes.find((s) => s.id === "scene-grid");
-  const defaultSceneId = gridDefault?.id || scenes[0]?.id || "scene-grid";
+  const desiredOrder = [
+    "scene-grid",
+    "low-g-terraces",
+    "fast-drop-maze",
+    "balanced",
+    "scene-lava",
+  ];
+  const orderedScenes = desiredOrder
+    .map((id) => scenes.find((s) => s.id === id))
+    .filter(Boolean);
+  const unordered = scenes.filter(
+    (s) => !orderedScenes.find((o) => o.id === s.id),
+  );
+  const finalScenes = [...orderedScenes, ...unordered];
+  const defaultSceneId =
+    desiredOrder.find((id) => finalScenes.some((s) => s.id === id)) ||
+    finalScenes[0]?.id ||
+    "scene-grid";
 
   window.PhysilinksScenes = {
-    scenes,
+    scenes: finalScenes,
     defaultSceneId,
+    order: desiredOrder,
   };
 })();