ui/component/commentCreate/view.jsx

@@ -1,6 +1,6 @@
 // @flow
 import type { ElementRef } from 'react';
-import { SIMPLE_SITE, STRIPE_PUBLIC_KEY } from 'config';
+import { SIMPLE_SITE } from 'config';
 import * as PAGES from 'constants/pages';
 import * as ICONS from 'constants/icons';
 import React from 'react';
@@ -21,12 +21,8 @@ import Empty from 'component/common/empty';
 import { getChannelIdFromClaim } from 'util/claim';
 import { Lbryio } from 'lbryinc';
 
-let stripeEnvironment = 'test';
+import { getStripeEnvironment } from 'util/stripe';
-// if the key contains pk_live it's a live key
+let stripeEnvironment = getStripeEnvironment();
-// update the environment for the calls to the backend to indicate which environment to hit
-if (STRIPE_PUBLIC_KEY && STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
-  stripeEnvironment = 'live';
-}
 
 const TAB_FIAT = 'TabFiat';
 const TAB_LBC = 'TabLBC';
@@ -534,7 +530,7 @@ export function CommentCreate(props: Props) {
               />
             )}
             {/* @if TARGET='web' */}
-            {!claimIsMine && (
+            {!claimIsMine && stripeEnvironment && (
               <Button
                 disabled={disabled}
                 button="alt"

ui/component/walletFiatPaymentHistory/view.jsx

@@ -4,14 +4,8 @@ import Button from 'component/button';
 import Card from 'component/common/card';
 import { Lbryio } from 'lbryinc';
 import moment from 'moment';
-import { STRIPE_PUBLIC_KEY } from 'config';
+import { getStripeEnvironment } from 'util/stripe';
-
+let stripeEnvironment = getStripeEnvironment();
-let stripeEnvironment = 'test';
-// if the key contains pk_live it's a live key
-// update the environment for the calls to the backend to indicate which environment to hit
-if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
-  stripeEnvironment = 'live';
-}
 
 type Props = {
   accountDetails: any,
@@ -41,10 +35,13 @@ const WalletBalance = (props: Props) => {
 
   // TODO: this is actually incorrect, last4 should be populated based on the transaction not the current customer details
   React.useEffect(() => {
-    (async function() {
+    (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);
     })();
@@ -100,7 +97,11 @@ const WalletBalance = (props: Props) => {
                     ))}
                 </tbody>
               </table>
-              {(!accountTransactions || accountTransactions.length === 0) && <p style={{textAlign: 'center', marginTop: '20px', fontSize: '13px', color: 'rgb(171, 171, 171)'}}>No Transactions</p>}
+              {(!accountTransactions || accountTransactions.length === 0) && (
+                <p style={{ textAlign: 'center', marginTop: '20px', fontSize: '13px', color: 'rgb(171, 171, 171)' }}>
+                  No Transactions
+                </p>
+              )}
             </div>
           </>
         }

ui/modal/modalRemoveCard/view.jsx

@@ -5,43 +5,19 @@ import Card from 'component/common/card';
 import Button from 'component/button';
 import * as ICONS from 'constants/icons';
 import { Lbryio } from 'lbryinc';
-import { STRIPE_PUBLIC_KEY } from 'config';
+import { getStripeEnvironment } from 'util/stripe';
-
+let stripeEnvironment = getStripeEnvironment();
-let stripeEnvironment = 'test';
-// if the key contains pk_live it's a live key
-// update the environment for the calls to the backend to indicate which environment to hit
-if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
-  stripeEnvironment = 'live';
-}
 
 type Props = {
   closeModal: () => void,
-  abandonTxo: (Txo, () => void) => void,
-  abandonClaim: (string, number, ?() => void) => void,
-  tx: Txo,
-  claim: GenericClaim,
-  cb: () => void,
-  doResolveUri: (string) => void,
-  uri: string,
   paymentMethodId: string,
-  setAsConfirmingCard: () => void,
+  setAsConfirmingCard: () => void, // ?
 };
 
-export default function ModalRevokeClaim(props: Props) {
+export default function ModalRemoveCard(props: Props) {
-  var that = this;
+  const { closeModal, paymentMethodId } = props;
-  console.log(that);
-
-  console.log(props);
-
-  const { closeModal, uri, paymentMethodId, setAsConfirmingCard } = props;
-
-  console.log(uri);
-
-  console.log(setAsConfirmingCard);
 
   function removeCard() {
-    console.log(paymentMethodId);
-
     Lbryio.call(
       'customer',
       'detach',
@@ -51,11 +27,9 @@ export default function ModalRevokeClaim(props: Props) {
       },
       'post'
     ).then((removeCardResponse) => {
-      console.log(removeCardResponse);
-
       // TODO: add toast here
       // closeModal();
-
+      // Is there a better way to handle this? Why reload?
       window.location.reload();
     });
   }
@@ -63,15 +37,14 @@ export default function ModalRevokeClaim(props: Props) {
   return (
     <Modal ariaHideApp={false} isOpen contentLabel={'hello'} type="card" onAborted={closeModal}>
       <Card
-        title={'Confirm Remove Card'}
+        title={__('Confirm Remove Card')}
-        // body={getMsgBody(type, isSupport, name)}
         actions={
           <div className="section__actions">
             <Button
               className="stripe__confirm-remove-card"
               button="secondary"
               icon={ICONS.DELETE}
-              label={'Remove Card'}
+              label={__('Remove Card')}
               onClick={removeCard}
             />
             <Button button="link" label={__('Cancel')} onClick={closeModal} />

ui/page/settingsStripeAccount/view.jsx

@@ -7,17 +7,12 @@ import Card from 'component/common/card';
 import Page from 'component/page';
 
 import { Lbryio } from 'lbryinc';
-import { URL, WEBPACK_WEB_PORT, STRIPE_PUBLIC_KEY } from 'config';
+import { URL, WEBPACK_WEB_PORT } from 'config';
+import { getStripeEnvironment } from 'util/stripe';
 
 const isDev = process.env.NODE_ENV !== 'production';
 
-let stripeEnvironment = 'test';
+let stripeEnvironment = getStripeEnvironment();
-// if the key contains pk_live it's a live key
-// update the environment for the calls to the backend to indicate which environment to hit
-if (STRIPE_PUBLIC_KEY.indexOf('pk_live') > -1) {
-  stripeEnvironment = 'live';
-}
-
 let successStripeRedirectUrl, failureStripeRedirectUrl;
 let successEndpoint = '/$/settings/tip_account';
 let failureEndpoint = '/$/settings/tip_account';
@@ -46,7 +41,7 @@ type State = {
   unpaidBalance: number,
   pageTitle: string,
   stillRequiringVerification: boolean,
-  accountTransactions: any
+  accountTransactions: any,
 };
 
 class StripeAccountConnection extends React.Component<Props, State> {
@@ -144,7 +139,10 @@ class StripeAccountConnection extends React.Component<Props, State> {
             stillRequiringVerification: false,
           };
 
-          if ((eventuallyDueInformation && eventuallyDueInformation.length) || (currentlyDueInformation && currentlyDueInformation.length)) {
+          if (
+            (eventuallyDueInformation && eventuallyDueInformation.length) ||
+            (currentlyDueInformation && currentlyDueInformation.length)
+          ) {
             objectToUpdateState.stillRequiringVerification = true;
             getAndSetAccountLink(false);
           }
@@ -233,8 +231,17 @@ class StripeAccountConnection extends React.Component<Props, State> {
                   <div>
                     <div>
                       <h3>{__('Congratulations! Your account has been connected with Odysee.')}</h3>
-                      {stillRequiringVerification && <><h3 style={{marginTop: '10px'}}>Although your account is connected it still requires verification to begin receiving tips.</h3>
+                      {stillRequiringVerification && (
-                      <h3 style={{marginTop: '10px'}}>Please use the button below to complete your verification process and enable tipping for your account.</h3></> }
+                        <>
+                          <h3 style={{ marginTop: '10px' }}>
+                            Although your account is connected it still requires verification to begin receiving tips.
+                          </h3>
+                          <h3 style={{ marginTop: '10px' }}>
+                            Please use the button below to complete your verification process and enable tipping for
+                            your account.
+                          </h3>
+                        </>
+                      )}
                     </div>
                   </div>
                 </div>
@@ -254,9 +261,7 @@ class StripeAccountConnection extends React.Component<Props, State> {
                       <br />
                       <div>
                         <h3>
-                          {__(
+                          {__('Connect your bank account to be able to cash your pending balance out to your account.')}
-                            'Connect your bank account to be able to cash your pending balance out to your account.'
-                          )}
                         </h3>
                       </div>
                       <div className="section__actions">
@@ -271,19 +276,23 @@ class StripeAccountConnection extends React.Component<Props, State> {
             </div>
           }
           actions={
-            <>{ stillRequiringVerification && <Button
+            <>
+              {stillRequiringVerification && (
+                <Button
                   button="primary"
                   label={__('Complete Verification')}
                   icon={ICONS.SETTINGS}
                   navigate={stripeConnectionUrl}
                   className="stripe__complete-verification-button"
-            /> }
+                />
+              )}
               <Button
                 button="secondary"
                 label={__('View Transactions')}
                 icon={ICONS.SETTINGS}
                 navigate={`/$/${PAGES.WALLET}?tab=fiat-payment-history`}
-            /></>
+              />
+            </>
           }
         />
         <br />