Completed orders should break items out by Shop

[brent-hoover]

Closes #2308 and #2245

My first React component replacement from scratch so I open to input on layout, structure, etc. Layout is responsive thanks to help from @kieckhafer. Also first time I have done any HTML of significance so there might be problems there.

To Test

Single Shop (for just the completed page functionality)

1. Place an order
2. Proceed to the completed order page

Multi-shop

[Update] Slightly shorter instructions now that you can see products from both shops w/o switching shops.

1. Login as admin (Marketplace admin)
2. Set up shipping (I've only been testing with Flat Rate but YMMV)
3. Enable/Configure Stripe (keys are in reaction.json)
4. Click on "Shop" settings in the Dashboard
5. Click on "Marketplace"
6. Enter a name and email in the "Invite Owner Form" and click "Send Invitation"
7. Copy the URL from the invite email
8. Open that URL in an incognito window (you will want to keep your logged in session)
9. Open "My Shop Settings"
10. Click on "Start Accepting Payment". You will be taken to Stripe's site
11. Don't fill out this form. Click on the "Skip this account form" link at the top, this will return you to your local site and Stripe is now connected
12. While still a Shop Admin, create a product and publish
13. In your non-incognito browser window as Marketplace admin, place a Reaction item in your cart
14. Add your newly created Shop product to your cart
15. Checkout as normal

**Note that "Estimated Ship Date" is not implemented on the back end so that's why it doesn't display here.

Another Note There is currently an issue with the way that discounts are being stored on multi-shop orders so that discounts are doubled (once per shop).

[rymorgan]

@spencern As long as that last tiny css change is in there. I'm good yes. (see my previous comment)

[spencern]

One small thing and one big thing.
Small:
I think we should probably keep the shipping name next to the shipping address

@rymorgan @aaronjudd any opinion here?

Big:
After placing one order as a new user, I am unable to add products to my cart. There are no errors in the client or server consoles
http://recordit.co/epPjELF45R

Doing a hard refresh shows the products in the cart

[spencern]

I've not seen this issue with adding products to the cart before, so I'm inclined to believe that it's with this branch.

The shipping name is a design question and not a blocker.

[spencern]

Overall this feels pretty good though, and is much more marketplace ready than what we had before.

[rymorgan]

@zenweasel @spencern Totally agree that the Name should be in the shipping box. Good catch. I added to my zeplin mocks.

[spencern]

@rymorgan
While we're discussing copy/design on this.

"Quantity Total" feels like a really weird way to say the total number of items in an order. I realize that it's itemized in the box to the left, which helps, but it still feels weird to me.

[rymorgan]

@spencern I don't disagree, I took that from what was there because @aaronjudd wanted me to use the existing language. I think 'Quantity' would work though.

[brent-hoover]

@spencern I'm not able to replicate the "Cart Empty" issue with either a single shop or multi-shop checkout. Is there something specific I should be doing?

I'll keep trying though

[brent-hoover]

Ok, I was finally able to reproduce the bug and it's something that I fixed a long time ago in the Blaze version with this code:

  const cartSub = Reaction.Subscriptions.Cart = Meteor.subscribe("Cart", sessionId, userId);
  cartSub.stop();
  Reaction.Subscriptions.Cart = Meteor.subscribe("Cart", sessionId, userId);

It seems to be caused by the fact that we delete that Cart record and for some reason the subscription doesn't update (possibly the OpLog is tied to that original ID). So stopping and resubscribing used to fix it.

However, putting this same code in the container does not seem to resolve this issue as the new subscription is not going into place. Continuing to try and see how I can fix this. Super painful because it only happens the first time after a full reset.

[brent-hoover]

@spencern Ok, so that bug should be fixed now

[aaronjudd]

@rymorgan @zenweasel re: Quantity vs Quantity Total. Neither of these reflect the current language. The current language would be "Items in cart", and thus, it would make sense for this to be Items in order, if we're following the existing convention. I'd suggest that our designs should stick to the current labels, and conventions without updating unnecessarily (all the translations etc that have to be updated, backwards compatibility -> less surprises for existing users, etc..., as these are labels that the user can update via i18n, and an end goal is to allow direct updating of the "translations" collections as well, thus allowing the labels to all be edited on the fly.. so in the end, these really are just defaults, I'd look mostly for consistency.

[rymorgan]

We should make it consistent here then. (this is where it from)

[aaronjudd]

@rymorgan and where you got it from is inconsistent..

[spencern]

@aaronjudd is this language a blocker for you here or should I merge and create a new issue for updating copy?

[aaronjudd]

@spencern let's create an issue for label consistency, and we can tackle as one last design review before we call release the first marketplace. I'll give this full reviewing, ignoring labels in 10..

[rymorgan]

@spencern @aaronjudd -- I'll go through all my zeplin docs and update the label to "Items in cart" and also update everything to sentence case.