Solidus: Create multiple page states for stock transfers

[Mandily]

I would like to introduce the concept of multiple page states in the admin. I plan to go through an exercise to evaluate what a page looks like when there's no data, a little data, and a lot of data. I also plan to look at whether it meets or doesn't meet any other criteria that is required to successfully interact with that page. This exercise will result in 1. page elements being shown/not shown and 2. new messages being created with the goal of making the UI more intuitive.

The first page I'd like to visit is the stock transfer page. I'm creating this issue for the community, so if you're interested in working on it, please leave a comment below so we don't duplicate efforts.

State 1: Only one stock location set
Display only a message that tells the user the purpose of the page, and a link to get to the page where they can set multiple stock locations.

State 2: Multiple locations exist, no stock transfers have been created
Display a message to prompt user to create a stock transfer

State 3: Multiple locations exist, less than 10 stock transfers exist
Display a table of stock transfers

State 4: Multiple locations exist, 10 or more stock transfers exist
Display the search filter and a table of stock transfers.

Feel free to suggest other improvements to messaging in addition to the ones above.

[mamhoff]

I <3 your high-level overview issues, @Mandily ! I feel the fourth page (with a lot of data) is missing pagination; otherwise I think this is great!

[tvdeyen]

I like this.

So this could be narrowed down to this:

1. We have a page missing prerequisites. Displaying action to create it
2. A page with no data. Having a link to create a record
3. A page with only few records. We omit the filters and pagination
4. A page with lots of records. We show the full feature set of filters and pagination.

I think this is actually a great pattern for all list pages, right? Not only the stock transfers.

[Mandily]

Yes, it's a great pattern and I'd like to see it across the app, not just list pages. I thought I'd try to lure someone in with just the stock transfer page before we expanded it to the rest ;)

I haven't cleared all my data to go through the admin empty, but there is the possibility that when we do, bullet 2 might be broken down into sub bullets if more than one piece of criteria needs to be met before a record can be created.

[jhawthorn]

State 1 should probably also hide the "New Stock Transfer" button, since one can't be made without two stock locations.

[Kingdutch]

What is the motivation for not showing filters for few records? I can admit that it provides a slightly cleaner page but it means that the user experience changes depending on a somewhat arbitrarily chosen limit.

An example use case for filters with less than 10 records would be someone implementing bulk editing with a select all field. Using the filters I could easily filter down to just the items I know I want (typing is faster than scrolling and clicking). Hit select all and be on my way.

Furthermore it means that the user can become familiar with the available filters the first time browsing the page. Knowing that it's there too when more items are added. I would probably be confused if I were evaluating solidus with only two items present and it seemed to lack basic filtering capabilities.

[Mandily]

@Kingdutch the sole motivation was to keep the page clean and help the user focus better on the data. But I like your counter points about getting the user familiar with the controls and bulk editing even if it is just a small portion.

I had future plans to collapse this area. So leaving it there isn't a big deal. I think we should do that.

So to edit @tvdeyen's previous comment:

1. We have a page missing prerequisites. Displaying action to create it. Hiding actions that cannot be completed without them.
2. A page with no data. Having a link to create a record
3. A page with only few records. We omit the pagination
4. A page with lots of records. We show the full feature set of filters and pagination.

[oojewale]

@Mandily, any update on this? A couple of friends and I are about to start working on it.

[Mandily]

@oojewale No updates. The last message is the most up to date, with the mocks up above being a little out of sync. If you get through this one page easily enough and are looking for more, let's sync up about how to tackle/track progress across all of Solidus.

[jtapia]

@oojewale https://github.com/solidusio/solidus/pull/1963