[Content] grab "Purchase and tip confirmations"

ui/component/settingContent/index.js

@@ -14,6 +14,8 @@ const select = (state) => ({
   hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
   showNsfw: selectShowMatureContent(state),
   myChannelUrls: selectMyChannelUrls(state),
+  instantPurchaseEnabled: makeSelectClientSetting(SETTINGS.INSTANT_PURCHASE_ENABLED)(state),
+  instantPurchaseMax: makeSelectClientSetting(SETTINGS.INSTANT_PURCHASE_MAX)(state),
 });
 
 const perform = (dispatch) => ({

ui/component/settingContent/view.jsx

@@ -8,10 +8,15 @@ import { SIMPLE_SITE } from 'config';
 import * as MODALS from 'constants/modal_types';
 import Button from 'component/button';
 import Card from 'component/common/card';
-import { FormField } from 'component/common/form';
+import { FormField, FormFieldPrice } from 'component/common/form';
 import MaxPurchasePrice from 'component/maxPurchasePrice';
 import SettingsRow from 'component/settingsRow';
 
+type Price = {
+  currency: string,
+  amount: number,
+};
+
 type Props = {
   isAuthenticated: boolean,
   floatingPlayer: boolean,
@@ -19,6 +24,8 @@ type Props = {
   hideReposts: ?boolean,
   showNsfw: boolean,
   myChannelUrls: ?Array<string>,
+  instantPurchaseEnabled: boolean,
+  instantPurchaseMax: Price,
   setClientSetting: (string, boolean | string | number) => void,
   clearPlayingUri: () => void,
   openModal: (string) => void,
@@ -32,6 +39,8 @@ export default function SettingContent(props: Props) {
     hideReposts,
     showNsfw,
     myChannelUrls,
+    instantPurchaseEnabled,
+    instantPurchaseMax,
     setClientSetting,
     clearPlayingUri,
     openModal,
@@ -145,6 +154,32 @@ export default function SettingContent(props: Props) {
             <MaxPurchasePrice />
           </SettingsRow>
           {/* @endif */}
+
+          <SettingsRow title={__('Purchase and tip confirmations')} useVerticalSeparator>
+            <FormField
+              type="radio"
+              name="confirm_all_purchases"
+              checked={!instantPurchaseEnabled}
+              label={__('Always confirm before purchasing content or tipping')}
+              onChange={() => setClientSetting(SETTINGS.INSTANT_PURCHASE_ENABLED, false)}
+            />
+            <FormField
+              type="radio"
+              name="instant_purchases"
+              checked={instantPurchaseEnabled}
+              label={__('Only confirm purchases or tips over a certain amount')}
+              helper={__(HELP_ONLY_CONFIRM_OVER_AMOUNT)}
+              onChange={() => setClientSetting(SETTINGS.INSTANT_PURCHASE_ENABLED, true)}
+            />
+            {instantPurchaseEnabled && (
+              <FormFieldPrice
+                name="confirmation_price"
+                min={0.1}
+                onChange={(newValue) => setClientSetting(SETTINGS.INSTANT_PURCHASE_MAX, newValue)}
+                price={instantPurchaseMax}
+              />
+            )}
+          </SettingsRow>
         </>
       }
     />
@@ -159,3 +194,5 @@ const HELP_SHOW_MATURE =
   'Mature content may include nudity, intense sexuality, profanity, or other adult content. By displaying mature content, you are affirming you are of legal age to view mature content in your country or jurisdiction.  ';
 const HELP_MAX_PURCHASE_PRICE =
   'This will prevent you from purchasing any content over a certain cost, as a safety measure.';
+const HELP_ONLY_CONFIRM_OVER_AMOUNT = ''; // feel redundant. Disable for now.
+// const HELP_ONLY_CONFIRM_OVER_AMOUNT = "When this option is chosen, LBRY won't ask you to confirm purchases or tips below your chosen amount.";

ui/page/settingsAdvanced/index.js

@@ -22,8 +22,6 @@ const select = (state) => ({
   daemonSettings: selectDaemonSettings(state),
   allowAnalytics: selectAllowAnalytics(state),
   isAuthenticated: selectUserVerifiedEmail(state),
-  instantPurchaseEnabled: makeSelectClientSetting(SETTINGS.INSTANT_PURCHASE_ENABLED)(state),
-  instantPurchaseMax: makeSelectClientSetting(SETTINGS.INSTANT_PURCHASE_MAX)(state),
   walletEncrypted: selectWalletIsEncrypted(state),
   hideBalance: makeSelectClientSetting(SETTINGS.HIDE_BALANCE)(state),
   ffmpegStatus: selectFfmpegStatus(state),

ui/page/settingsAdvanced/view.jsx

@@ -1,7 +1,7 @@
 // @flow
 import * as React from 'react';
 
-import { FormField, FormFieldPrice } from 'component/common/form';
+import { FormField } from 'component/common/form';
 import Button from 'component/button';
 import I18nMessage from 'component/i18nMessage';
 import Page from 'component/page';
@@ -36,8 +36,6 @@ type Props = {
   setClientSetting: (string, SetDaemonSettingArg) => void,
   daemonSettings: DaemonSettings,
   isAuthenticated: boolean,
-  instantPurchaseEnabled: boolean,
-  instantPurchaseMax: Price,
   encryptWallet: () => void,
   decryptWallet: () => void,
   updateWalletStatus: () => void,
@@ -67,7 +65,6 @@ class SettingsAdvancedPage extends React.PureComponent<Props, State> {
     };
 
     (this: any).onMaxConnectionsChange = this.onMaxConnectionsChange.bind(this);
-    (this: any).onInstantPurchaseMaxChange = this.onInstantPurchaseMaxChange.bind(this);
     (this: any).onThemeChange = this.onThemeChange.bind(this);
     (this: any).onAutomaticDarkModeChange = this.onAutomaticDarkModeChange.bind(this);
     (this: any).onConfirmForgetPassword = this.onConfirmForgetPassword.bind(this);
@@ -127,14 +124,6 @@ class SettingsAdvancedPage extends React.PureComponent<Props, State> {
     this.props.setClientSetting(SETTINGS.AUTOMATIC_DARK_MODE_ENABLED, value);
   }
 
-  onInstantPurchaseEnabledChange(enabled: boolean) {
-    this.props.setClientSetting(SETTINGS.INSTANT_PURCHASE_ENABLED, enabled);
-  }
-
-  onInstantPurchaseMaxChange(newValue: Price) {
-    this.props.setClientSetting(SETTINGS.INSTANT_PURCHASE_MAX, newValue);
-  }
-
   onChangeEncryptWallet() {
     const { decryptWallet, walletEncrypted, encryptWallet } = this.props;
     if (walletEncrypted) {
@@ -169,8 +158,6 @@ class SettingsAdvancedPage extends React.PureComponent<Props, State> {
     const {
       daemonSettings,
       ffmpegStatus,
-      instantPurchaseEnabled,
-      instantPurchaseMax,
       isAuthenticated,
       walletEncrypted,
       setClientSetting,
@@ -201,47 +188,6 @@ class SettingsAdvancedPage extends React.PureComponent<Props, State> {
           </section>
         ) : (
           <div>
-            <Card
-              title={__('Purchase and tip confirmations')}
-              actions={
-                <React.Fragment>
-                  <FormField
-                    type="radio"
-                    name="confirm_all_purchases"
-                    checked={!instantPurchaseEnabled}
-                    label={__('Always confirm before purchasing content or tipping')}
-                    onChange={() => {
-                      this.onInstantPurchaseEnabledChange(false);
-                    }}
-                  />
-                  <FormField
-                    type="radio"
-                    name="instant_purchases"
-                    checked={instantPurchaseEnabled}
-                    label={__('Only confirm purchases or tips over a certain amount')}
-                    onChange={() => {
-                      this.onInstantPurchaseEnabledChange(true);
-                    }}
-                  />
-
-                  {instantPurchaseEnabled && (
-                    <FormFieldPrice
-                      name="confirmation_price"
-                      min={0.1}
-                      onChange={this.onInstantPurchaseMaxChange}
-                      price={instantPurchaseMax}
-                    />
-                  )}
-
-                  <p className="help">
-                    {__(
-                      "When this option is chosen, LBRY won't ask you to confirm purchases or tips below your chosen amount."
-                    )}
-                  </p>
-                </React.Fragment>
-              }
-            />
-
             {(isAuthenticated || !IS_WEB) && (
               <Card
                 title={__('Wallet security')}