Removes payment day from monthly statement

Resolves brave/brave-browser#8960

Author: NejcZdovc

.storybook/locale.ts

@@ -144,7 +144,6 @@ const locale: Record<string, string> = {
   openAdsHistory: 'Show Ads History',
   openBalance: 'Opening Balance',
   payment: 'Payment',
-  paymentMonthly: 'Payment made every {{day}}th day in each month.',
   paymentNotMade: 'Payment not made.',
   pendingContributions: 'Pending Contributions',
   pendingContributionEmpty: 'No pending contributions…',

browser/ui/webui/brave_webui_source.cc

@@ -529,7 +529,6 @@ void CustomizeWebUIHTMLSource(const std::string &name,
         { "openAdsHistory", IDS_BRAVE_UI_OPEN_ADS_HISTORY },
         { "optOutTooltip", IDS_BRAVE_UI_ADS_OPT_OUT_TOOLTIP },
         { "payment", IDS_BRAVE_UI_PAYMENT },
-        { "paymentMonthly", IDS_BRAVE_UI_PAYMENT_MONTHLY },
         { "paymentNotMade", IDS_BRAVE_UI_PAYMENT_NOT_MADE },
         { "pendingContributions", IDS_BRAVE_UI_PENDING_CONTRIBUTIONS },
         { "pendingContributionEmpty", IDS_BRAVE_UI_PENDING_CONTRIBUTION_EMPTY },

components/brave_rewards/resources/page/components/pageWallet.tsx

@@ -718,18 +718,12 @@ class PageWallet extends React.Component<Props, State> {
   }
 
   generateMonthlyReport = () => {
-    const {
-      monthlyReport,
-      ui,
-      reconcileStamp
-    } = this.props.rewardsData
+    const { monthlyReport, ui } = this.props.rewardsData
 
     if (!monthlyReport || monthlyReport.year === -1 || monthlyReport.month === -1) {
       return undefined
     }
 
-    const paymentDay = new Intl.DateTimeFormat('default', { day: 'numeric' }).format(reconcileStamp * 1000)
-
     return (
       <ModalActivity
         onlyAnonWallet={ui.onlyAnonWallet}
@@ -739,7 +733,6 @@ class PageWallet extends React.Component<Props, State> {
         months={this.getMonthlyReportDropDown()}
         onClose={this.onModalActivityToggle}
         onMonthChange={this.onModalActivityAction.bind(this,'onMonthChange')}
-        paymentDay={parseInt(paymentDay, 10)}
       />
     )
   }

components/brave_rewards/resources/ui/components/modalActivity/index.tsx

@@ -21,8 +21,7 @@ import {
   StyledActionIcon,
   Tabs,
   Tab,
-  TabContent,
-  PaymentMonthly
+  TabContent
 } from './style'
 import TableActivity, { DetailRow as ActivityRow } from '../tableActivity'
 import TableTransactions, { DetailRow as TransactionRow } from '../tableTransactions'
@@ -59,7 +58,6 @@ export interface Props {
   transactionRows: TransactionRow[]
   id?: string
   summary: SummaryItem[]
-  paymentDay: number,
   onlyAnonWallet?: boolean
 }
 
@@ -194,7 +192,7 @@ export default class ModalActivity extends React.PureComponent<Props, State> {
   }
 
   getMonthlyContributionTable = () => {
-    const { activityRows, paymentDay } = this.props
+    const { activityRows } = this.props
     const rows = activityRows.filter(row => row.type === 'monthly')
 
     return (
@@ -204,15 +202,12 @@ export default class ModalActivity extends React.PureComponent<Props, State> {
         >
           {getLocale('noActivity')}
         </TableActivity>
-        <PaymentMonthly>
-          {getLocale('paymentMonthly', { day: paymentDay })}
-        </PaymentMonthly>
       </>
     )
   }
 
   getAutoContributeTable = () => {
-    const { activityRows, paymentDay } = this.props
+    const { activityRows } = this.props
     const rows = activityRows.filter(row => row.type === 'contribute')
 
     return (
@@ -222,9 +217,6 @@ export default class ModalActivity extends React.PureComponent<Props, State> {
         >
           {getLocale('noActivity')}
         </TableActivity>
-        <PaymentMonthly>
-          {getLocale('paymentMonthly', { day: paymentDay })}
-        </PaymentMonthly>
       </>
     )
   }

components/brave_rewards/resources/ui/components/modalActivity/style.ts

@@ -116,14 +116,3 @@ export const Tab = styled<TabProps, 'button'>('button')`
 
 export const TabContent = styled<{}, 'div'>('div')`
 `
-
-export const PaymentMonthly = styled<{}, 'p'>('p')`
-  font-size: 14px;
-  font-weight: 300;
-  letter-spacing: 0.2px;
-  color: #4b4c5c;
-  text-transform: none;
-  padding: 0px;
-  margin: -8px 0 24px;
-  display: block;
-`

components/brave_rewards/resources/ui/stories/modal.tsx

@@ -209,7 +209,6 @@ storiesOf('Rewards/Modal', module)
             }
           }
         ]}
-        paymentDay={12}
       />
     )
   })

components/brave_rewards/resources/ui/stories/settings/pageWallet.tsx

@@ -335,7 +335,6 @@ class PageWallet extends React.Component<Props, State> {
                     }
                   }
                 ]}
-                paymentDay={12}
             />
             : null
         }

components/resources/brave_components_strings.grd

@@ -528,7 +528,6 @@
       <message name="IDS_BRAVE_UI_OPEN_BALANCE" desc="">Opening Balance</message>
       <message name="IDS_BRAVE_UI_OPEN_ADS_HISTORY" desc="">7-day Ads History</message>
       <message name="IDS_BRAVE_UI_PAYMENT" desc="">Payment</message>
-      <message name="IDS_BRAVE_UI_PAYMENT_MONTHLY" desc="">Payment made every {{day}}th each month.</message>
       <message name="IDS_BRAVE_UI_PAYMENT_NOT_MADE" desc="">Payment not made.</message>
       <message name="IDS_BRAVE_UI_PAYMENT_PINNED_SITES_HEADER" desc="">Pinned sites are now</message>
       <message name="IDS_BRAVE_UI_PAYMENT_PINNED_SITES_MSG" desc="">Here's how monthly contributions work:</message>