-2

If I have an React/Redux single page application that has - say - a customers page that lists businesses that are customers, and from there each customer can be accessed with a URL like this:

/customer/1

From there, the page lists contacts at said customer, and the user can drill into individual contacts at that customer:

/contact/58

On the contact page, there are details about the customer, and a few details about the customer they work for.

This all works fine if the user navigates through the pages as I've described. But if the user goes straight to /contact/58, there won't be any state about the customer to display.

Finally, the question: how should Redux-based SPAs cope with this?

Improve this question
3
  • Any explanation for the downvote? Commented Nov 1, 2017 at 12:32
  • 2
    Why are your URLs context-sensitive? Why not use /customers/1/contacts/58 to get to the 58-th contact of the 1-st customer? Thar URL should work regardless of navigation history. Commented Nov 1, 2017 at 12:52
  • @BartvanIngenSchenau they aren't context-sensitive, in that contact/58 is the absolute URL to the contact, but still, fair point - I thought this might come up, as it seems like the most likely option to work. If I did, though, would the screen always do a get on customer and then a get on contact? And - getting to the heart of my question - what's the best way to do that sort of "chaining" of calls in React/Redux? Commented Nov 1, 2017 at 13:11

1 Answer 1

Reset to default
0

I would imagine it working something like this:

  1. You navigate to /customers. The browser makes a request for /customers and gets back customer data, including a list of contacts (probably just name and an id) for each customer/business.
  2. Drill down on a contact. The browser makes a request for /contact/58 and renders a new page once it has that data.

Also, your URL scheme is confusing. Why are you saying /customers/1 will bring you to the list of customers? That to me implies I'll get a view of customer data for customer id = 1. I would think just /customers would return a list of customers.

Improve this answer
4
  • Apologies - I rewrote that top bit part way through. I'm going to edit out the change rather than show the edit publically, to avoid confusion; I hope that's okay. Commented Nov 1, 2017 at 12:28
  • On the actual question: if the user goes straight to /contact/58, and there is no customer data in the store, your description of how things should work will still error (or show empty fields where the customer data should show). How do we compose these calls (that might go further levels of nesting deep, potentially) so we make them if needed? Commented Nov 1, 2017 at 15:16
  • If a user goes straight to /contact/58, make a request to the server for that data, and then render it. Commented Nov 1, 2017 at 20:28
  • What I'm trying to say is that the Contact screen also has information about the Customer on it, so if the user goes to /contact/58, two requests are needed. I'm asking about a good way to compose those requests, or whatever is good Redux practice. Commented Nov 1, 2017 at 20:46

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.