Switch component

Frontity Roadmap :biking_man:

β€” Feature Card

Description

Right now users have to do routing like this:

{(data.isFetching && <Loading />) ||
 (data.isArchive && <Archive data={data} />) ||
 (data.isPage && <Page data={data} />) ||
 (data.isPostType && <Post data={data} />) ||
 (data.is404 && <Page404 />)}

With a simple Switch component, it will be much clearer:

<Switch>
  <Loading when={data.isFetching} />
  <Archive when={data.isArchive} />
  <Page when={data.isPage} />
  <Post when={data.isPostType} />
  <Page404 />
</Switch>

User Stories

As a theme developer
I want to route between pages with a <Switch> component
so that I don’t have to use plain JavaScript logic

Possible solution

Reach Router has this type of component. It is implemented using React.Children.toArray(children) to iterate over children and check for the path prop in the element.props. In our case, we could check for when.

@Segun, as we talked today a little bit about improving the way routing works in Frontity, would you mind sharing your impressions about this Switch component? Do you see any limitations? Would you use a different approach?

@luisherranz What’s the plan this? Can we have a call to talk about it? I would love to work on it.

Sure! Let me know your questions :slight_smile:

Have you discussed any further details @iamuchejude @luisherranz ?