Include Add-on name and Add-on Icon in each review under "My reviews" on User Profile

[shribyte]

Fixes mozilla/addons#2050

This patch includes the Add-on Name and Add-on Icon in each review under "My reviews", on the User Profile.

Before:

After:

[codecov[bot]]

Codecov Report

All modified lines are covered by tests :white_check_mark:

Comparison is base (0094a99) 98.50% compared to head (9d086d9) 98.50%. Report is 20 commits behind head on master.

:exclamation: Current head 9d086d9 differs from pull request most recent head adc8f36. Consider uploading reports for the commit adc8f36 to get more accurate results

Additional details and impacted files

@@           Coverage Diff           @@
##           master   mozilla/addons-frontend#12426   +/-   ##
=======================================
  Coverage   98.50%   98.50%           
=======================================
  Files         258      258           
  Lines       10177    10189   +12     
  Branches     3060     3071   +11     
=======================================
+ Hits        10025    10037   +12     
  Misses        144      144           
  Partials        8        8           

Files	Coverage Δ
src/amo/actions/reviews.js	100.00% <100.00%> (ø)
src/amo/api/reviews.js	100.00% <ø> (ø)
src/amo/components/AddonReviewCard/index.js	100.00% <100.00%> (ø)
src/amo/pages/UserProfile/index.js	100.00% <ø> (ø)
src/amo/reducers/reviews.js	100.00% <100.00%> (ø)

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[shribyte]

There's a UX mockup in the issue - #5858 (comment) - can we have it look like that?

Sure, I will be pushing changes per the UX mockup tomorrow.

[shribyte]

Here's the UI after some styling changes, it's now similar to the UX mockup.

I've tried to avoid modifying the styling of existing elements (such as the rating and review body being pushed to the right, to afford more space for the icon), since that may have cascading effects across multiple views and would require re-styling a number of elements.

[eviljeff]

We need a test in TestAddonReviewCard that checks this extra markup is displayed when isUserProfile is true.

[diox]

I've tried to avoid modifying the styling of existing elements (such as the rating and review body being pushed to the right, to afford more space for the icon), since that may have cascading effects across multiple views and would require re-styling a number of elements.

It looks a little weird with the icon outside like that. IMHO the icon should be left-aligned with the stars and text on that page.

[shribyte]

Here's a screenshot of a hard-coded icon to make it simpler to visualize the left-align:

[shribyte]

there are some createInternalReview calls in amo/reducers/reviews.js that also make the invariant checks in selectLocalizedContent fail. What should I do about these? They are invoked via reviewReducerfunction in reducers/test_reviews.js

As discussed with @eviljeff, this may be due to some of the existing tests not having the correct setup.

[shribyte]

I assume that some of the existing tests don't have the correct setup. The fix should otherwise be ready to merge. I will move on to other bugs.

[eviljeff]

https://github.com/mozilla/addons-frontend/commit/e3409a1e0d7e6148e3c62e99cdc9180a29dcd766 reduces the failing tests to 6.

[diox]

@shribyte could you look at the last failing tests ?

[shribyte]

@diox I looked at it some time back and couldn't exactly figure out why some existing tests were failing despite the state.lang additions.

Will look into it again after I'm done with my current assigned bugs.