Fix #17692 - Add messaging in the UI about 5% tipping fee when tipping

[jumde]

Resolves brave/brave-browser#17692

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
• 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:

1. Try initiating a tip to a creator. Messaging should be updated to -

Brave collects 5% of the tip amount as a processing fee. By proceeding, you agree to the Terms of Service and Privacy Policy.

[zenparsing]

Unfortunately, I think this will update the terms of service text for all Rewards onboarding components. Also, I think we only want to show this message for users with a verified external wallet. We'll probably need to add a component to the tip application for this specific case.

[zenparsing]

To make this a little more self-documenting, let's name this string "tippingFeeNote" / IDS_BRAVE_REWARDS_TIPPING_FEE_NOTE.

Also, let's add a "tippingFeeNote" entry to tip/stories/locale_strings.ts for storybook.

[zenparsing]

If this component is just wrapping a string with styles, then we can get away with not defining a new component, and we can just use the string directly:

<style.terms>
  <style.feeNote>
    {getString('tippingFeeNote')}
  </style.feeNote>
  <TermsOfService />
</style.terms>

[kjozwiak]

Verification PASSED on Win 10 x64 using the following build:

Brave | 1.31.5 Chromium: 93.0.4577.58 (Official Build) nightly (64-bit)
-- | --
Revision | c4410ece044414ea42fa4ba328d08195e818a99c-refs/branch-heads/4577@{#1076}
OS | Windows 10 OS Version 2009 (Build 19042.1165)

• ensured that Terms of Service opens https://basicattentiontoken.org/user-terms-of-service/
• ensured that Privacy Policy opens https://brave.com/privacy/browser/#rewards

One-time Tip Examples

Example	Example	Example

Monthly Contribution Examples

Example	Example	Example