get priority order of scenarios

src/app/portfolio/[slug]/(portfolio)/reporting/RecommendationsOptions.tsx

@@ -38,6 +38,11 @@ export interface RecommendationsOptionsProps {
   scenarios: ScenarioSummary[]
 }
 
+interface ScenarioWithPriority {
+  id: number;
+  priority: number; // 1 = highest, 2 = next, etc.
+}
+
 function SortableScenarioItem({
   id,
   name,
@@ -85,21 +90,28 @@ export function RecommendationsOptions({
 }: RecommendationsOptionsProps) {
   const [isApplying, setIsApplying] = useState(false);
   const [open, setOpen] = useState(false);
-  const [selectedScenarios, setSelectedScenarios] = useState<number[]>([]);
+  const [selectedScenarios, setSelectedScenarios] = useState<ScenarioWithPriority[]>([]);
   const [warning, setWarning] = useState<string | null>(null);
 
   const toggleScenario = (id: number) => {
     setWarning("")
-    setSelectedScenarios((prev) =>
-      prev.includes(id)
-        ? prev.filter((s) => s !== id)
-        : [...prev, id]
-    );
+    setSelectedScenarios((prev) => {
+      const exists = prev.find((s) => s.id === id);
+      if (exists) {
+        // Remove
+        return prev.filter((s) => s.id !== id);
+      } else {
+        // Add at the end with next priority
+        return [...prev, { id, priority: prev.length + 1 }];
+      }
+    });
   };
 
   const handleSelectAll = () => {
     setWarning("")
-    setSelectedScenarios(scenarios.map((s) => s.id));
+    setSelectedScenarios(
+      scenarios.map((s, index) => ({ id: s.id, priority: index + 1 }))
+    );
   };
 
   const handleDeselectAll = () => {
@@ -112,14 +124,18 @@ export function RecommendationsOptions({
     if (!over || active.id === over.id) return;
 
     setSelectedScenarios((items) => {
-      const oldIndex = items.indexOf(active.id);
-      const newIndex = items.indexOf(over.id);
-      return arrayMove(items, oldIndex, newIndex);
+      const oldIndex = items.findIndex((s) => s.id === active.id);
+      const newIndex = items.findIndex((s) => s.id === over.id);
+
+      const newOrder = arrayMove(items, oldIndex, newIndex);
+
+      // Update priority to match array index
+      return newOrder.map((s, index) => ({ ...s, priority: index + 1 }));
     });
   };
 
   const handleSubmit = async () => {
-    console.log('handleSubmit', selectedScenarios, selectedScenarios.length);
+    console.log('handleSubmit', selectedScenarios);
     if (selectedScenarios.length === 1) {
       setWarning("Cannot generate recommendations for a single scenario");
       return;
@@ -130,9 +146,9 @@ export function RecommendationsOptions({
 
     await onApply({
       selectedScenarios:
-        selectedScenarios.length > 0 ? selectedScenarios : null,
+        selectedScenarios.length > 0 ? selectedScenarios.map(s => s.id) : null,
       prioritisedScenarios:
-        selectedScenarios.length > 0 ? selectedScenarios : null,
+        selectedScenarios.length > 0 ? selectedScenarios.map(s => s.id) : null,
     });
 
     setIsApplying(false);
@@ -145,7 +161,10 @@ export function RecommendationsOptions({
   };
 
   const selectedScenarioObjects = selectedScenarios.map(
-    (id) => scenarios.find((s) => s.id === id)!
+    (s) => ({
+      ...scenarios.find((sc) => sc.id === s.id)!,
+      priority: s.priority,
+    })
   );
 
   return (
@@ -184,7 +203,7 @@ export function RecommendationsOptions({
           {scenarios.map((scenario) => (
             <div key={scenario.id} className="flex items-center gap-2">
               <Checkbox
-                checked={selectedScenarios.includes(scenario.id)}
+                checked={selectedScenarios.some((s) => s.id === scenario.id)}
                 onCheckedChange={() => toggleScenario(scenario.id)}
               />
               <Label>{scenario.name}</Label>