seamapi / react

Seam Components are a set of white-labeled UI elements that can be added to your application in seconds. Use them in any app as native web components or as React components and hooks.
https://react.seam.co
MIT License
7 stars 2 forks source link

Allow browser back navigation #647

Closed louis-pre closed 4 months ago

louis-pre commented 4 months ago

We want users to be able to navigate back using the intuitive browser navigation. This behavior should be enabled by default and optional via config.

louis-pre commented 4 months ago

After having spent time on this, it seems like we first need to clarify the goal of this feature.

Potential goals

1/ We want users to have a good experience when browsing our hosted examples (as in, the browser navigation works) 2/ We want to show users how to implement browser navigation using Seam components 3/ We want users to have browser navigation enabled by default when they complete the quickstart guide 4/ We want users to have browser navigation enabled by default if they integrate any Seam component into their own application ..?

Options

a/ Implement routing in our example apps, outside of the Seam components

Advantages Disadvantages
Most straightforward We would still need an example without it (impacts goal 1/)
Follows regular routing conventions Does not achieve goals 3/ and 4/

b/ Implement routing within the Seam components themselves

Advantages Disadvantages
Solves 1/, 3/ and 4/ Complex to implement in a robust way
Most likely requires the user to do tie it in with their own routing to achieve goal 4/

The goals we initially wanted to achieve were goals 3/ and 4/, so I tried to implement solution b/ using a custom routing solution that relies on manually creating browser history stack entries that each contain the new state of the component (for example, if a device is selected then the entry in the stack would contain the device's id in its state). This works but has edge cases surrounding duplicate components, components mounting and unmounting, the user reloading the page, etc.. that need to be tackled with.

Evan and I ultimately decided the low ROI does not justify implementing a complex routing system within the components themselves (solution b/). Goals 1/ and 2/ are interesting but we decided they were ultimately out of scope for this iteration (their ROI is questionable too)

Closing this issue