Fetching Firestore document based on react-router-dom param doesn't work

I am using React, Firestore and the 'Run payments with Stripe' firebase extension. I have this function for creating the checkout session (works ok)

const session = await createCheckoutSession(payments, {
    payment_method_types: ['card'],
    line_items: [
      { price: 'price_xyz',
       quantity: 1 },
      { price: 'price_xyz',
       quantity: 1 },
       { price: 'price_xyz',
       quantity: 1 },
    ],
    discounts: [{
      coupon: 'abc'
    }],
    mode: 'payment',
    success_url:'http://localhost:3000/order/'+currentOrderNumber,
  });
  window.location.assign(session.url);

After the payment is successful I am redirected to the OrderConfirmationPage (and I pass the currentOrderNumber as a param-> to get it from firestore). This is from the OrderConfirmationPage.

export const OrderConfirmationPage = () => {
    const {number} = useParams();

    //const {state} = useLocation();

    const [order, setOrder]=React.useState({});

    

    React.useEffect(async()=>{
      console.log(number)
      const q = query(collection(db, "orders"), where("orderNumber", "==", number));
      const orderDoc = await getDocs(q);
      let orderClone=orderDoc.docs[0].data()
      console.log(orderClone)
      setOrder(orderClone)
    })

It seems that it's not entering in the useEffect because I don't see any console.log, just these errors.

The above error occurred in the <OrderConfirmationPage> component:

    at OrderConfirmationPage (http://localhost:3000/static/js/bundle.js:11501:66)
    at Routes (http://localhost:3000/static/js/bundle.js:175507:5)
    at App
    at Router (http://localhost:3000/static/js/bundle.js:175440:15)
    at BrowserRouter (http://localhost:3000/static/js/bundle.js:174250:5)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.

This one is trying to read the first order attribute from the component.

Uncaught TypeError: Cannot read properties of undefined (reading 'email')
    at OrderConfirmationPage (OrderConfirmationPage.jsx:103:1)
    at renderWithHooks (react-dom.development.js:14985:1)
    at mountIndeterminateComponent (react-dom.development.js:17811:1)
    at beginWork (react-dom.development.js:19049:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at beginWork$1 (react-dom.development.js:23964:1)
    at performUnitOfWork (react-dom.development.js:22776:1)
    at workLoopSync (react-dom.development.js:22707:1)

Any idea what is the problem? Is it because of that success_url? And if so, how can I use navigate if the payment was successful for example?