Merge 5ab9832131 into eef5db92b5

apps/web/cypress/component/TechStepCorrectionPopover.cy.tsx

@@ -103,8 +103,13 @@ describe("TechStepCorrectionPopover", () => {
     cy.wait("@getTechSteps");
     cy.get(".tech-step-correction-popover__remove").should("not.exist");
 
+    // An existing match starts pre-selected straight into the metadata view
+    // (see TechStepCorrectionPopover's own doc comment on why) — "Changer"
+    // reaches the pick list, where the remove option lives.
     cy.mount(<Harness previousTechStepId={cook.id} />);
     cy.wait("@getTechSteps");
+    cy.get(".tech-step-correction-popover__remove").should("not.exist");
+    cy.contains("button", "Changer").click();
     cy.get(".tech-step-correction-popover__remove").should("exist");
   });
 
@@ -199,9 +204,11 @@ describe("TechStepCorrectionPopover", () => {
         existingUtensils={[{ utensil: pan, start: 14, end: 23, source: "auto" }]}
       />,
     );
+    // An existing match starts pre-selected on itself (see
+    // TechStepCorrectionPopover's own doc comment) — the metadata sections,
+    // pre-seeded from `existingIngredients`/`existingUtensils`, are visible
+    // immediately, no need to re-pick "Cuire" from a list first.
     cy.wait("@getTechSteps");
-
-    cy.contains(".tech-step-correction-popover__list button", "Mijoter").click();
     cy.wait(["@getIngredients", "@getUnits", "@getUtensils"]);
 
     cy.contains(".tech-step-correction-popover__chip", "50 g Beurre").find("button").click();

apps/web/cypress/e2e/recipes.ts

@@ -114,8 +114,13 @@ Then("I should see the technique correction options", () => {
 // "Valider" click to actually submit (room was made for attaching
 // ingredient/utensil metadata first, see `TechStepCorrectionPopover.tsx`'s
 // own doc comment) — folded into this one step since nothing in this
-// scenario cares about that intermediate state on its own.
+// scenario cares about that intermediate state on its own. This step is
+// only ever reached after clicking an *existing* highlight (see the
+// previous step above), which now opens straight into that same
+// technique's metadata view, not the pick list — "Changer" reaches the
+// list this step actually needs to pick a different one from.
 When("I choose {string} as the correct technique", (label: string) => {
+  cy.contains("button", "Changer").click();
   cy.contains(".tech-step-correction-popover__list button", label).click();
   cy.contains(".tech-step-correction-popover__confirm-button", "Valider").click();
 });

apps/web/src/features/recipes/steps/TechStepCorrectionPopover.tsx

@@ -118,7 +118,17 @@ export function TechStepCorrectionPopover({
   const { t } = useTranslation();
   const popoverRef = useRef<HTMLDivElement>(null);
   const [techSteps, setTechSteps] = useState<TechStepView[] | null>(null);
-  const [selectedTechStepId, setSelectedTechStepId] = useState<number | null>(null);
+  // Opening this popover on an *already-detected* match (`previousTechStepId
+  // !== null`, i.e. the user clicked an existing highlight rather than
+  // selecting fresh text) starts pre-selected on that same technique —
+  // straight into the Ingrédients/Ustensiles view below, not the pick-a-
+  // technique list. Without this, editing an already-correct technique's
+  // metadata required re-picking that exact same technique from the list
+  // first, with nothing in the list marking it as the current one — the
+  // metadata sections were technically reachable but effectively
+  // undiscoverable. "Changer de technique" (below) still reaches the full
+  // list — to relabel, or to remove via the option only shown there.
+  const [selectedTechStepId, setSelectedTechStepId] = useState<number | null>(previousTechStepId);
   const [catalogs, setCatalogs] = useState<{
     ingredients: IngredientView[];
     units: UnitView[];