I have my extension targeting 'purchase.checkout.block.render'.
I want to add my new extension on both the 'shipping' page and the 'payment' page, and then use the 'buyer journey' active step to display slight variances of text.
But I'm missing something....
if i import 'useBuyerJourney', and then put this code at the top of my extension:
function App() {
const { extension, } = useApi();
const journey = useBuyerJourney();
console.log("usebuyerJourney:", JSON.stringify(journey),)
it displays the log with buyer journey details (4 times, actually) and the 'activeStep' is correct.
But, if i move through the checkout (information->shipping->payment) the log statement never runs again and i don't get an updated 'activeStep'.
If I change this to instead import 'userBuyerJourneyActiveStep', and then update my logging to this:
const activeStep = useBuyerJourneyActiveStep();
console.log("useBuyerJourneyActiveStep:", JSON.stringify(activeStep),)
That statement will record DOZENS of logs in the console, but it does keep logging and change to contain the correct step as i move through checkout.
I feel I'm missing something obvious.
How do I bring the current step into my application, without causing the extension to run so many times per page load or data update?
