[RFC] New users table layout

[tvdeyen]

The current admin users table looks like this

I think we can do better

1. This table does not look like any other table we have in the admin
2. We actually have more information available to display

But we can't know 100% what attributes a user has. Stores can define their own user classes. What all user classes have in common is defined in the UserMethods module that all stores need to include in their user class in order to work with Solidus.

The commonalities are:

• An email address
• A user role
• Orders
• Addresses
• Payment sources
• Rails timestamps created_at & updated_at

The user sidebar ("Lifetime Stats") displays following data:

• "Member Since" - the created_at timestamp
• "Order Count" - count of all completed orders
• "Average Order value" - mean of all completed order totals
• "Total Sales" - total of all completed orders

I think displaying all of these values in the table does not provide much value and the data is costly to gather. For a table of 20 users this could lead to lots of database queries.

So, I went with this approach

• Move the search form to the top of the table
• Add user roles column and filter
• Add "Member Since" column and date range filter
• link to last order
• total number of orders
• total number of dollars spent in the store

Please let me know what you think.

/c @Mandily @jhawthorn

[Mandily]

I like search at the top for consistency in the rest of the app. Thanks for doing that. By any chance does anyone reading this thread have data on how admins use/want to use this page? It would be helpful to have to know what data we should display for them.

A few thoughts:

1. It might be nice to allow admins to filter the roles by any combination. Displaying those in checkboxes instead of a dropdown would work well for that.

2. A pet peeve of mine is labels and table headers not matching and not in the same order. Could we

• list the form fields in the order of Email, Role, Member since
• rename the table header “Users” to “Email”

3. This could be a global thing for all list pages - Displaying the total number of records (in this case “322 users”) would be nice for an at a glance idea of how many people had been through the store.

4. As noted by @jhawthorn in Slack, the table pagination is off, but he may be fixing that in a separate PR

A couple of things I thought of, but would probably need admin validation from a few different groups before we implemented as you noted the technical load would increase:

5. Other filters that might be useful

• repeat buyers
• dropped cart users
• location

6. Other information that might be useful for admins

• link to last order
• total number of orders
• total number of dollars spent in the store

What do you think of those things?

[tvdeyen]

It might be nice to allow admins to filter the roles by any combination. Displaying those in checkboxes instead of a dropdown would work well for that.

Stores are able to add as many roles as they like. We can't know the number of roles a store has. That's why checkboxes won't work IMO, but we could try to use a multi select field.

list the form fields in the order of Email, Role, Member since

Yes

rename the table header “Users” to “Email”

Absolutely

This could be a global thing for all list pages - Displaying the total number of records (in this case “322 users”) would be nice for an at a glance idea of how many people had been through the store.

Would like to add this as a separate PR and then for all paginated tables, good idea 👍

As noted by @jhawthorn in Slack, the table pagination is off, but he may be fixing that in a separate PR

Yes, this is already handled by #1844

Other filters that might be useful

• repeat buyers
• dropped cart users
• location

These need extra information we don't have in all stores or are even tough to calculate. These are interesting filters, but belong more to an analytics or business intelligence tool IMO and are also very shop specific. I think we should only add the common information and filters on that table used by the majority of stores.

Other information that might be useful for admins

• link to last order
• total number of orders
• total number of dollars spent in the store

I already thought of those. We then need to make use of the new full-width layout for this table, what we should do anyway. Let me try those.

Thanks for the feedback 🌹

[tvdeyen]

@Mandily @jhawthorn this is now ready to review.

[Mandily]

@tvdeyen Do you have a new screenshot you could share? I don't generally get into the code review part of reviewing :)

[tvdeyen]

@Mandily

Sure. Will add them later, as I am on mobile right now.

Until then (and as a general tip):

Consider to install hub - a great tool for GitHub related stuff (https://hub.github.com).

With that you can easily pull down a PR and run the sandbox locally.

1. hub checkout <url-to-pr>
2. bundle exec rake sandbox
3. cd sandbox
4. bin/rails server

I always do this for reviewing layout related stuff.

[tvdeyen]

@Mandily the screenshot above is already updated.

[Mandily]

A few more things have come to mind since looking at this last:

• Could we change "total sales" to "total spent'?
• Can we add a sort caret to the last three columns?

Otherwise this looks good!

[tvdeyen]

• Could we change "total sales" to "total spent'?

Absolutely

• Can we add a sort caret to the last three columns?

These kind of queries are usually better inside a business intelligence tool. I already felt uncomfortable with adding these columns in the first place, but thought they provide some nice extra information on users (the same we display on the sidebar of the user detail screens).

Actually I already tried implementing this, but it turns out that this is a quite complex query. Ransack (the tool we use for search, filtering and sorting) has no built in support for this. We would need to add complexity to the code base that I’m not sure of want to have.

What do you think @jhawthorn @cbrundson?

[Mandily]

I discovered data tables a few weeks ago while looking into bootstrap sort functionality as a whole. Would this be helpful? https://datatables.net/examples/styling/bootstrap.html

[tvdeyen]

Data tables doesn’t help us, as we only load 10 results per page and data tables requires all data to be present at once.

Even their ajax feature won’t help us as not the rendering is the problem, the searching and sorting of huge amounts of data (users x orders x line items) is a slow and complex query. And with that data tables can’t help us.

I will try to implement something and then we can decide if we think it’s worth to keep in the core code base or if an extension would be something we should work on.