Как в react сделать переход на другую страницу только для Desktop?

Здравствуйте,
У меня есть пет проект, который я разрабатываю с использованием TypeScript и React, React Router.

Согласно заданию, на главной странице отображаются продукты, и у каждого продукта есть кнопка "Заказать". При нажатии на эту кнопку снизу появляется выдвижная панель (sheet) с информаций конкретного продукта и вариантами оплаты с кнопками "Отменить оплату" и "Оплатить".

Когда пользователь нажимает кнопку "Оплатить", он перенаправляется на страницу с деталями оплаты. У меня есть две страницы для оплаты, и в зависимости от выбранного способа оплаты открывается соответствующая страница.

и вот главное, если смотреть на макет и задание: на десктопной версии, когда пользователь нажимает "Оплатить", он переходит на новую страницу и далее идет реализованный мною процесс оплаты. В то же время, если на мобильных устройствах нажать на кнопку "Оплатить", на страницу не перебрасывать, должна открываться еще одна выдвижная панель с деталями оплаты (деталями оплаты, процессом оплаты который я реализовал в другой странице которая должна открываться на Desktop).

Я не понимаю как в теории можно сделать так, чтобы у меня на страницу перебрасывалось только если пользователь сидит на сайте с Desktop, а если с телефона, то на страницу перебрасывать не нужно и должно открываться выдвижное меню.