feat: add to basket experiment mp-346

[christian14b]

Bubble up an small borrower image to the new basket and show cart modal

add-to-basket-exp.mov

[eddieferrer]

Do we need to account for Anonymous loans in this work? I can't remember if Anonymous loans return "Anonymous" in the name field. I know they are few and far between, I can't even find one at the moment. @emuvente

[emuvente]

Do we need to account for Anonymous loans in this work?

Loans can only become anonymous after the fundraising period, so it shouldn't be a problem for this work. When loans are anonymous then the name does only come through from the API as "Anonymous".

[dyersituations]

I'm now seeing the page content always under the header in /lend/filter:

[dyersituations]

So it looks like we're just enabling this on the category pages? Or do we also want it enabled on /lend/filter? If we want it on /lend/filter, create a mixin like we have for other experiments, and enable the experiment on the filter page. Otherwise, if we only want the experiment on the category page, move the experiment tracking back to the channel component. Sorry if that's the case, I assumed we were rolling this checkout experience to as many pages as possible.

[dyersituations]

While testing on the category page, I also noticed that sometimes the animated bubbles go behind the other loan cards on the page. Make sure the z indexing is correct to make the bubbles always be on the top. I mostly noticed when I clicked a button on the left side of a row.

[dyersituations]

Is it expected that the tablet view is top left of the screen (not full-width or right-side)?

[dyersituations]

I noticed that the header doesn't become sticky until you add a loan to the basket. This means that there is a weird jump in the page layout when you are scrolled down a bit and add a loan to the basket. The jump can be seen more in mobile view. Would we rather want to have the header be sticky always for the experiment (whether there are loans in the basket or not)?

[christian14b]

Is it expected that the tablet view is top left of the screen (not full-width or right-side)?

Thanks for checking, this should be fixed with kiva/kv-ui-elements#428

[christian14b]

I noticed that the header doesn't become sticky until you add a loan to the basket. This means that there is a weird jump in the page layout when you are scrolled down a bit and add a loan to the basket. The jump can be seen more in mobile view. Would we rather want to have the header be sticky always for the experiment (whether there are loans in the basket or not)?

Yeah.. your solution seems like the most straightforward. I tried to make it sticky after the viewport but it looks weird because the cart modal appears with margin top value of the header's height on desktop. @emuvente what do you think?

[emuvente]

I noticed that the header doesn't become sticky until you add a loan to the basket. This means that there is a weird jump in the page layout when you are scrolled down a bit and add a loan to the basket. The jump can be seen more in mobile view. Would we rather want to have the header be sticky always for the experiment (whether there are loans in the basket or not)?

Yeah.. your solution seems like the most straightforward. I tried to make it sticky after the viewport but it looks weird because the cart modal appears with margin top value of the header's height on desktop. @emuvente what do you think?

I don't think we want to test making the header sticky always as part of this experiment. Could we try using a transition to slide the header in from the top instead of a sudden jump?

[christian14b]

I noticed that the header doesn't become sticky until you add a loan to the basket. This means that there is a weird jump in the page layout when you are scrolled down a bit and add a loan to the basket. The jump can be seen more in mobile view. Would we rather want to have the header be sticky always for the experiment (whether there are loans in the basket or not)?

Yeah.. your solution seems like the most straightforward. I tried to make it sticky after the viewport but it looks weird because the cart modal appears with margin top value of the header's height on desktop. @emuvente what do you think?

I don't think we want to test making the header sticky always as part of this experiment. Could we try using a transition to slide the header in from the top instead of a sudden jump?

Yeah, I added transition in my last commit just to soft page jump

[kiva-robot]

🎉 This PR is included in version 2.748.0-rc.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[kiva-robot]

🎉 This PR is included in version 2.748.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀