Add swipe navigation to bottom

[kas-catholic]

It isn't obvious that you need to swipe. Can we add some kind of indicator?

The library we're using for this is Swiper. I'd be surprised if there's not an option we can turn on that will make this easy to do.

[JohnRDOrazio]

maybe a kind of toaster message at the bottom of the screen, inviting the user to swipe from right to left to proceed to the next step? Or a tutorial for first time users?

[kas-catholic]

We do already have a welcome modal (shows on first usage) that should sort of indicate this. Perhaps we could review the text to see if we should modify it to indicate swiping...

Beyond that, our library does support pagination indicators, but I couldn't get them working. Some Google searching suggests something might be broken between our version of react-id-swiper (React implementation) and swiper (native JS package). The most recent version of Swiper supports react via WebComponents, and their docs suggest we should use that. I think that in doing so we'll be able to set pagination="true" to get pagination bullets. So:

• Remove our dependency on react-id-swiper.
• Update Swiper (^9.3.2)
• Use the Swiper docs to change our usage of react-id-swiper and instead use the native Swiper WebComponent/react implementation, with pagination dots.