Own the Converter State

Open app/page.js and components/Converter.js.

Keep the selected pair in the page so the chart, statistics, and converter can all respond to the same values. Keep the editable amount local to the converter.

const [from, setFrom] = useState("USD");
const [to, setTo] = useState("EUR");

Pass the pair into Converter and expose a callback for pair changes.

Test it

Change one currency selector and confirm the page’s pair display changes.

Checkpoint

The page owns the selected currencies, while the converter owns the editable amount.