Lint/prettier to reduce delta in next PR.

This is mainly to make the next PR's delta readable. Seems like lint/prettier is being bypassed in the commit hook.

ui/component/txoList/view.jsx

@@ -122,7 +122,11 @@ function TxoList(props: Props) {
         }
 
         // TODO: remove this once pagination is implemented
-        if (customerTransactionResponse && customerTransactionResponse.length && customerTransactionResponse.length > 25) {
+        if (
+          customerTransactionResponse &&
+          customerTransactionResponse.length &&
+          customerTransactionResponse.length > 25
+        ) {
           customerTransactionResponse.length = 25;
         }
 
@@ -312,7 +316,8 @@ function TxoList(props: Props) {
   return (
     <Card
       title={
-        <><div className="table__header-text txo__table_header">{__(`Transactions`)}</div>
+        <>
+          <div className="table__header-text txo__table_header">{__(`Transactions`)}</div>
           <div className="txo__radios_container">
             <fieldset-section style={{ display: 'inline' }} className="txo__radios_fieldset">
               {/* toggle between LBC and fiat buttons */}
@@ -339,11 +344,11 @@ function TxoList(props: Props) {
             </fieldset-section>
           </div>
         </>
-
       }
       isBodyList
-      body={currency === 'credits'
-        ? <div>
+      body={
+        currency === 'credits' ? (
+          <div>
             {/* LBC transactions section */}
             <div className="card__body-actions">
               <div className="card__actions card__actions--between">
@@ -379,7 +384,9 @@ function TxoList(props: Props) {
                         name="subtype"
                         label={__('Payment Type')}
                         value={subtype || 'all'}
-                      onChange={(e) => handleChange({ changedParameterKey: TXO.SUB_TYPE, value: e.target.value, tab })}
+                        onChange={(e) =>
+                          handleChange({ changedParameterKey: TXO.SUB_TYPE, value: e.target.value, tab })
+                        }
                       >
                         {Object.values(TXO.DROPDOWN_SUBTYPES).map((v) => {
                           const stringV = String(v);
@@ -429,6 +436,7 @@ function TxoList(props: Props) {
                     </div>
                   )}
                 </div>
+
                 {/* export and refresh buttons */}
                 <div className="card__actions--inline">
                   {!isFetchingTransactions && transactionsFile === null && (
@@ -452,7 +460,8 @@ function TxoList(props: Props) {
             <TransactionListTable txos={txoPage} />
             <Paginate totalPages={Math.ceil(txoItemCount / Number(pageSize))} />
           </div>
-        : <div>
+        ) : (
+          <div>
             {/* FIAT SECTION ( toggle buttons and transactions) */}
             <div className="section card-stack">
               <div className="card__body-actions">
@@ -464,7 +473,9 @@ function TxoList(props: Props) {
                         {/* incoming transactions button */}
                         <Button
                           button="alt"
-                        onClick={(e) => handleChange({ changedParameterKey: QUERY_NAME_FIAT_TYPE, value: 'incoming'})}
+                          onClick={(e) =>
+                            handleChange({ changedParameterKey: QUERY_NAME_FIAT_TYPE, value: 'incoming' })
+                          }
                           className={classnames(`button-toggle`, {
                             'button-toggle--active': fiatType === 'incoming',
                           })}
@@ -473,7 +484,9 @@ function TxoList(props: Props) {
                         {/* incoming transactions button */}
                         <Button
                           button="alt"
-                        onClick={(e) => handleChange({ changedParameterKey: QUERY_NAME_FIAT_TYPE, value: 'outgoing'})}
+                          onClick={(e) =>
+                            handleChange({ changedParameterKey: QUERY_NAME_FIAT_TYPE, value: 'outgoing' })
+                          }
                           className={classnames(`button-toggle`, {
                             'button-toggle--active': fiatType === 'outgoing',
                           })}
@@ -491,8 +504,8 @@ function TxoList(props: Props) {
               {/* <Paginate totalPages={Math.ceil(txoItemCount / Number(pageSize))} /> */}
             </div>
           </div>
+        )
       }
-
     />
   );
 }

ui/component/walletFiatAccountHistory/view.jsx

@@ -56,9 +56,7 @@ const WalletBalance = (props: Props) => {
                     className=""
                     navigate={'/' + transaction.channel_name + ':' + transaction.source_claim_id}
                     label={
-                  transaction.channel_claim_id === transaction.source_claim_id
-                    ? 'Channel Page'
-                    : 'Content Page'
+                      transaction.channel_claim_id === transaction.source_claim_id ? 'Channel Page' : 'Content Page'
                     }
                     button="link"
                   />
@@ -73,7 +71,6 @@ const WalletBalance = (props: Props) => {
       </table>
       {!accountTransactions && <p className="wallet__fiat-transactions">No Transactions</p>}
     </div>
-
   );
 };
 

ui/component/walletFiatBalance/view.jsx

@@ -41,33 +41,56 @@ const WalletBalance = () => {
   }, [stripeEnvironment]);
 
   return (
-    <>{<Card
-      title={<><Icon size={18} icon={ICONS.FINANCE} />{(accountStatusResponse && ((accountStatusResponse.total_received_unpaid - accountStatusResponse.total_paid_out) / 100)) || 0} USD</>}
-      subtitle={accountStatusResponse && accountStatusResponse.total_received_unpaid > 0 ? (
+    <>
+      {
+        <Card
+          title={
+            <>
+              <Icon size={18} icon={ICONS.FINANCE} />
+              {(accountStatusResponse &&
+                (accountStatusResponse.total_received_unpaid - accountStatusResponse.total_paid_out) / 100) ||
+                0}{' '}
+              USD
+            </>
+          }
+          subtitle={
+            accountStatusResponse && accountStatusResponse.total_received_unpaid > 0 ? (
               <I18nMessage>
                 This is your pending balance that will be automatically sent to your bank account
-          </I18nMessage>) : (
-        <I18nMessage>
-          When you begin to receive tips your balance will be updated here
-        </I18nMessage>)
+              </I18nMessage>
+            ) : (
+              <I18nMessage>When you begin to receive tips your balance will be updated here</I18nMessage>
+            )
           }
           actions={
             <>
               <h2 className="section__title--small">
-            ${(accountStatusResponse && (accountStatusResponse.total_received_unpaid / 100)) || 0} Total Received Tips
+                ${(accountStatusResponse && accountStatusResponse.total_received_unpaid / 100) || 0} Total Received Tips
               </h2>
 
               <h2 className="section__title--small">
-            ${(accountStatusResponse && (accountStatusResponse.total_paid_out / 100)) || 0}  Withdrawn
+                ${(accountStatusResponse && accountStatusResponse.total_paid_out / 100) || 0} Withdrawn
               </h2>
 
               <div className="section__actions">
-            <Button button="secondary" label={__('Bank Accounts')} icon={ICONS.SETTINGS} navigate={`/$/${PAGES.SETTINGS_STRIPE_ACCOUNT}`} />
-            <Button button="secondary" label={__('Payment Methods')} icon={ICONS.SETTINGS} navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`} />
+                <Button
+                  button="secondary"
+                  label={__('Bank Accounts')}
+                  icon={ICONS.SETTINGS}
+                  navigate={`/$/${PAGES.SETTINGS_STRIPE_ACCOUNT}`}
+                />
+                <Button
+                  button="secondary"
+                  label={__('Payment Methods')}
+                  icon={ICONS.SETTINGS}
+                  navigate={`/$/${PAGES.SETTINGS_STRIPE_CARD}`}
+                />
               </div>
             </>
           }
-    />}</>
+        />
+      }
+    </>
   );
 };
 

ui/component/walletFiatPaymentHistory/view.jsx

@@ -33,7 +33,10 @@ const WalletBalance = (props: Props) => {
     (async function () {
       const customerStatusResponse = await getCustomerStatus();
 
-        const lastFour = customerStatusResponse.PaymentMethods && customerStatusResponse.PaymentMethods.length && customerStatusResponse.PaymentMethods[0].card.last4;
+      const lastFour =
+        customerStatusResponse.PaymentMethods &&
+        customerStatusResponse.PaymentMethods.length &&
+        customerStatusResponse.PaymentMethods[0].card.last4;
 
       setLastFour(lastFour);
     })();
@@ -77,9 +80,7 @@ const WalletBalance = (props: Props) => {
                         className=""
                         navigate={'/' + transaction.channel_name + ':' + transaction.source_claim_id}
                         label={
-                      transaction.channel_claim_id === transaction.source_claim_id
-                        ? 'Channel Page'
-                        : 'Content Page'
+                          transaction.channel_claim_id === transaction.source_claim_id ? 'Channel Page' : 'Content Page'
                         }
                         button="link"
                       />
@@ -96,7 +97,9 @@ const WalletBalance = (props: Props) => {
             </tbody>
           </table>
           {/* show some markup if there's no transactions */}
-          {(!accountTransactions || accountTransactions.length === 0) && <p className="wallet__fiat-transactions">No Transactions</p>}
+          {(!accountTransactions || accountTransactions.length === 0) && (
+            <p className="wallet__fiat-transactions">No Transactions</p>
+          )}
         </div>
       </div>
     </>