[Android] Brave news - ui fixes

[alexsafe]

Resolves brave/brave-browser#21868
Resolves brave/brave-browser#20580
Resolves brave/brave-browser#21873

Submitter Checklist:

• I confirm that no security/privacy review is needed, or that I have requested one
• There is a ticket for my issue
• Used Github auto-closing keywords in the PR description above
• Wrote a good PR/commit description
• Squashed any review feedback or "fixup" commits before merge, so that history is a record of what happened in the repo, not your PR
• Added appropriate labels (QA/Yes or QA/No; release-notes/include or release-notes/exclude; OS/...) to the associated issue
• Checked the PR locally: npm run test -- brave_browser_tests, npm run test -- brave_unit_tests, npm run lint, npm run gn_check, npm run tslint
• Ran git rebase master (if needed)

Reviewer Checklist:

• A security review is not needed, or a link to one is included in the PR description
• New files have MPL-2.0 license header
• Adequate test coverage exists to prevent regressions
• Major classes, functions and non-trivial code blocks are well-commented
• Changes in component dependencies are properly reflected in gn
• Code follows the style guide
• Test plan is specified in PR before merging

After-merge Checklist:

• The associated issue milestone is set to the smallest version that the
  changes has landed on
• All relevant documentation has been updated, for instance:
  • https://github.com/brave/brave-browser/wiki/Deviations-from-Chromium-(features-we-disable-or-remove)
  • https://github.com/brave/brave-browser/wiki/Proxy-redirected-URLs
  • https://github.com/brave/brave-browser/wiki/Fingerprinting-Protections
  • https://github.com/brave/brave-browser/wiki/Brave%E2%80%99s-Use-of-Referral-Codes
  • https://github.com/brave/brave-browser/wiki/Custom-Headers
  • https://github.com/brave/brave-browser/wiki/Web-Compatibility-Exceptions-in-Brave
  • https://github.com/brave/brave-browser/wiki/QA-Guide
  • https://github.com/brave/brave-browser/wiki/P3A

Test Plan:

[tapanmodh]

LGTM

[SergeyZhukovsky]

++

[AlexeyBarabash]

thanks 👍

[kjozwiak]

Test Case #1 - brave/brave-browser#21868

Verification PASSED on Samsung Galaxy Tablet A running Android 12 using the following build(s):

1.39.63 Chromium: 100.0.4896.127

Went through the STR/Cases outlined via brave/brave-browser#21868 (comment) and ensured that switching the orientation didn't cause the original issues that @Uni-verse originally reported.

Example of the fix/issue not occurring with the latest Nightly.

XRecorder_15042022_221619.mp4

Test Case #2 - brave/brave-browser#20580

Regarding the STR/Cases mentioned brave/brave-browser#20580 (comment), there still seems to be some issues with the Brave News jumping around but it has definitely improved compared to before. Quick example:

screen-20220415-230049.mp4

Went through the STR/Cases outlined via brave/brave-browser#20580 (comment) and ensured that the Brave News wasn't jumping around when refreshing a NTP. Also ensured that when refreshing a NTP, the feed restarts and starts at the top again.

screen-20220415-224507.mp4

Test Case #3 - brave/brave-browser#21873

Went through the STR/Cases oulined via brave/brave-browser#21873 (comment) and ensured that Brave News wasn't flickering by appearing like it was loading and then moved to the bottom. There's still some flickering which I think is due to #22187.

Example of the original issue not happening anymore:

screen-20220415-224200.mp4

[kjozwiak]

Created a follow up via brave/brave-browser#22356 to improve Android keeping the correct position with the Brave News feed when switching tabs.