solidus_paypal_braintree 1.0.0 → 1.1.0

data/app/assets/images/solidus_paypal_braintree/venmo/venmo_white_button_375x48.svg

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="375px" height="48px" viewBox="0 0 375 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 46.1 (44463) - http://www.bohemiancoding.com/sketch -->
+    <title>svg/white_venmo_button_375x48</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="white_venmo_button_375x48">
+            <rect id="Rectangle" fill="#FFFFFF" x="0" y="0" width="375" height="48" rx="4"></rect>
+            <g id="Group" transform="translate(146.000000, 16.000000)" fill="#3D95CE">
+                <path d="M14.1355722,0.0643062201 C14.6997229,0.996022242 14.9540614,1.95569119 14.9540614,3.16795034 C14.9540614,7.03443424 11.6533091,12.0572714 8.97435371,15.5842648 L2.85545503,15.5842648 L0.401435711,0.910859951 L5.75920168,0.402203543 L7.05667586,10.8432743 C8.26898429,8.86832019 9.76503373,5.76467606 9.76503373,3.64865382 C9.76503373,2.49041769 9.56660332,1.70150782 9.25650148,1.0519281 L14.1355722,0.0643062201 L14.1355722,0.0643062201 Z" id="Shape"></path>
+                <path d="M21.0794779,6.525633 C22.0654018,6.525633 24.5475201,6.07462046 24.5475201,4.66393896 C24.5475201,3.98655114 24.0685351,3.64865382 23.5040948,3.64865382 C22.5165776,3.64865382 21.2206966,4.83281521 21.0794779,6.525633 L21.0794779,6.525633 Z M20.9665029,9.31947756 C20.9665029,11.0419863 21.924328,11.7177809 23.1941378,11.7177809 C24.5769225,11.7177809 25.9009024,11.3798836 27.6217431,10.505377 L26.9735853,14.9065874 C25.7611321,15.4989577 23.8715531,15.8942092 22.0374478,15.8942092 C17.3850512,15.8942092 15.7199738,13.0728462 15.7199738,9.545708 C15.7199738,4.97417302 18.4284766,0.120067244 24.0124822,0.120067244 C27.08685,0.120067244 28.8059526,1.84243114 28.8059526,4.24073451 C28.8062423,8.10707358 23.8437439,9.29152463 20.9665029,9.31947756 L20.9665029,9.31947756 Z" id="Shape"></path>
+                <path d="M44.2677372,3.50758567 C44.2677372,4.07185827 44.1821369,4.89031424 44.0969712,5.42518557 L42.4892503,15.58412 L37.2722686,15.58412 L38.7387707,6.27159447 C38.7665799,6.01900427 38.8520354,5.51049269 38.8520354,5.22835639 C38.8520354,4.55096858 38.4288137,4.3819475 37.9199918,4.3819475 C37.2441697,4.3819475 36.5667543,4.69203673 36.1155786,4.918412 L34.4522393,15.5842648 L29.2058551,15.5842648 L31.6026627,0.374540282 L36.1433878,0.374540282 L36.2008892,1.58853744 C37.2721237,0.88319669 38.6827177,0.120356912 40.6841129,0.120356912 C43.3356936,0.120067244 44.2677372,1.47498771 44.2677372,3.50758567 L44.2677372,3.50758567 Z" id="Shape"></path>
+                <path d="M59.7554481,1.78507694 C61.2496147,0.713885943 62.6604983,0.120067244 64.6058406,0.120067244 C67.2846511,0.120067244 68.216405,1.47498771 68.216405,3.50758567 C68.216405,4.07185827 68.1310944,4.89031424 68.0459287,5.42518557 L66.4400908,15.58412 L61.2216606,15.58412 L62.7161168,6.07476529 C62.7436363,5.82058192 62.8014274,5.51049269 62.8014274,5.31380835 C62.8014274,4.55111341 62.3780609,4.3819475 61.8693838,4.3819475 C61.2213709,4.3819475 60.5736477,4.6640838 60.0927798,4.918412 L58.4297302,15.5842648 L53.2126036,15.5842648 L54.7070598,6.07491013 C54.7345794,5.82072676 54.7906323,5.51063753 54.7906323,5.31395319 C54.7906323,4.55125824 54.367121,4.38209233 53.860182,4.38209233 C53.1829115,4.38209233 52.5069445,4.69218156 52.0557688,4.91855683 L50.3911259,15.5844097 L45.1464798,15.5844097 L47.5429977,0.374685116 L52.0282492,0.374685116 L52.1691783,1.64444329 C53.2126036,0.883486357 54.6220389,0.12064658 56.511473,0.12064658 C58.1474376,0.120067244 59.2185273,0.825552826 59.7554481,1.78507694 L59.7554481,1.78507694 Z" id="Shape"></path>
+                <path d="M78.5990953,6.21583344 C78.5990953,4.97417302 78.288559,4.12761929 77.358688,4.12761929 C75.2997914,4.12761929 74.8770043,7.76743825 74.8770043,9.62942196 C74.8770043,11.0419863 75.2722719,11.9162033 76.2018532,11.9162033 C78.1479196,11.9162033 78.5990953,8.07767231 78.5990953,6.21583344 L78.5990953,6.21583344 Z M69.5751464,9.40463986 C69.5751464,4.60817794 72.1127383,0.120067244 77.9512273,0.120067244 C82.3505888,0.120067244 83.9587442,2.71679297 83.9587442,6.30099573 C83.9587442,11.0418415 81.4485271,15.9514186 75.4692539,15.9514186 C71.0415037,15.9514186 69.5751464,13.0446036 69.5751464,9.40463986 L69.5751464,9.40463986 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>

data/app/assets/images/solidus_paypal_braintree/venmo/venmo_white_logo.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="126px" height="24px" viewBox="0 0 126 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 46.1 (44463) - http://www.bohemiancoding.com/sketch -->
+    <title>white_logosvg/</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="white_logo" fill="#FFFFFF">
+            <g id="Group">
+                <path d="M21.2033583,0.0964593301 C22.0495843,1.49403336 22.4310921,2.93353679 22.4310921,4.75192551 C22.4310921,10.5516514 17.4799637,18.0859072 13.4615306,23.3763973 L4.28318255,23.3763973 L0.602153567,1.36628993 L8.63880252,0.603305315 L10.5850138,16.2649114 C12.4034764,13.3024803 14.6475506,8.6470141 14.6475506,5.47298073 C14.6475506,3.73562654 14.349905,2.55226174 13.8847522,1.57789215 L21.2033583,0.0964593301 L21.2033583,0.0964593301 Z" id="Shape"></path>
+                <path d="M31.6192168,9.7884495 C33.0981028,9.7884495 36.8212801,9.11193069 36.8212801,6.99590844 C36.8212801,5.97982672 36.1028027,5.47298073 35.2561421,5.47298073 C33.7748663,5.47298073 31.8310449,7.24922281 31.6192168,9.7884495 L31.6192168,9.7884495 Z M31.4497544,13.9792163 C31.4497544,16.5629794 32.8864919,17.5766714 34.7912066,17.5766714 C36.8653838,17.5766714 38.8513536,17.0698254 41.4326146,15.7580654 L40.460378,22.359881 C38.6416981,23.2484366 35.8073297,23.8413138 33.0561717,23.8413138 C26.0775769,23.8413138 23.5799608,19.6092694 23.5799608,14.318562 C23.5799608,7.46125954 27.6427148,0.180100866 36.0187232,0.180100866 C40.630275,0.180100866 43.2089289,2.76364671 43.2089289,6.36110177 C43.2093634,12.1606104 35.7656158,13.937287 31.4497544,13.9792163 L31.4497544,13.9792163 Z" id="Shape"></path>
+                <path d="M66.4016058,5.26137851 C66.4016058,6.1077874 66.2732054,7.33547136 66.1454568,8.13777835 L63.7338755,23.37618 L55.9084028,23.37618 L58.108156,9.4073917 C58.1498699,9.0285064 58.278053,8.26573904 58.278053,7.84253459 C58.278053,6.82645286 57.6432206,6.57292125 56.8799877,6.57292125 C55.8662545,6.57292125 54.8501315,7.03805509 54.1733679,7.377618 L51.6783589,23.3763973 L43.8087826,23.3763973 L47.403994,0.561810423 L54.2150817,0.561810423 L54.3013338,2.38280616 C55.9081856,1.32479503 58.0240766,0.180535368 61.0261694,0.180535368 C65.0035404,0.180100866 66.4016058,2.21248157 66.4016058,5.26137851 L66.4016058,5.26137851 Z" id="Shape"></path>
+                <path d="M89.6331722,2.67761541 C91.874422,1.07082892 93.9907475,0.180100866 96.9087609,0.180100866 C100.926977,0.180100866 102.324608,2.21248157 102.324608,5.26137851 C102.324608,6.1077874 102.196642,7.33547136 102.068893,8.13777835 L99.6601361,23.37618 L91.8324909,23.37618 L94.0741752,9.11214794 C94.1154545,8.73087288 94.2021411,8.26573904 94.2021411,7.97071253 C94.2021411,6.82667012 93.5670913,6.57292125 92.8040757,6.57292125 C91.8320564,6.57292125 90.8604715,6.9961257 90.1391698,7.377618 L87.6445953,23.3763973 L79.8189054,23.3763973 L82.0605897,9.11236519 C82.101869,8.73109013 82.1859485,8.26595629 82.1859485,7.97092978 C82.1859485,6.82688737 81.5506815,6.5731385 80.790273,6.5731385 C79.7743672,6.5731385 78.7604168,7.03827234 78.0836532,7.37783525 L75.5866889,23.3766145 L67.7197197,23.3766145 L71.3144966,0.562027674 L78.0423739,0.562027674 L78.2537674,2.46666494 C79.8189054,1.32522954 81.9330583,0.180969869 84.7672095,0.180969869 C87.2211564,0.180100866 88.827791,1.23832924 89.6331722,2.67761541 L89.6331722,2.67761541 Z" id="Shape"></path>
+                <path d="M117.898643,9.32375016 C117.898643,7.46125954 117.432838,6.19142894 116.038032,6.19142894 C112.949687,6.19142894 112.315506,11.6511574 112.315506,14.4441329 C112.315506,16.5629794 112.908408,17.8743049 114.30278,17.8743049 C117.221879,17.8743049 117.898643,12.1165085 117.898643,9.32375016 L117.898643,9.32375016 Z M104.36272,14.1069598 C104.36272,6.91226691 108.169107,0.180100866 116.926841,0.180100866 C123.525883,0.180100866 125.938116,4.07518945 125.938116,9.4514936 C125.938116,16.5627622 122.172791,23.9271279 113.203881,23.9271279 C106.562256,23.9271279 104.36272,19.5669055 104.36272,14.1069598 L104.36272,14.1069598 Z" id="Shape"></path>
+            </g>
+        </g>
+    </g>
+</svg>

data/app/assets/javascripts/solidus_paypal_braintree/client.js

@@ -57,11 +57,15 @@ SolidusPaypalBraintree.Client = function(config) {
   this.useDataCollector = config.useDataCollector;
   this.usePaypal = config.usePaypal;
   this.useApplepay = config.useApplepay;
+  this.useVenmo = config.useVenmo;
+  this.flow = config.flow;
+  this.venmoNewTabSupported = config.newBrowserTabSupported
   this.useThreeDSecure = config.useThreeDSecure;
 
   this._braintreeInstance = null;
   this._dataCollectorInstance = null;
   this._paypalInstance = null;
+  this._venmoInstance = null;
   this._threeDSecureInstance = null;
 };
 
@@ -85,6 +89,10 @@ SolidusPaypalBraintree.Client.prototype.initialize = function() {
     initializationPromise = initializationPromise.then(this._createApplepay.bind(this));
   }
 
+  if (this.useVenmo) {
+    initializationPromise = initializationPromise.then(this._createVenmo.bind(this));
+  }
+
   if (this.useThreeDSecure) {
     initializationPromise = initializationPromise.then(this._createThreeDSecure.bind(this));
   }
@@ -116,6 +124,14 @@ SolidusPaypalBraintree.Client.prototype.getApplepayInstance = function() {
   return this._applepayInstance;
 };
 
+/**
+ * Returns the braintree Venmo instance
+ * @returns {external:"braintree.Venmo"} The Braintree Venmo that was initialized by this class
+**/
+SolidusPaypalBraintree.Client.prototype.getVenmoInstance = function() {
+  return this._venmoInstance;
+};
+
 /**
  * Returns the braintree dataCollector instance
  * @returns {external:"braintree.DataCollector"} The braintree dataCollector that was initialized by this class
@@ -193,6 +209,24 @@ SolidusPaypalBraintree.Client.prototype._createApplepay = function() {
   }.bind(this));
 };
 
+SolidusPaypalBraintree.Client.prototype._createVenmo = function() {
+  return SolidusPaypalBraintree.PromiseShim.convertBraintreePromise(braintree.venmo.create, [{
+    client: this._braintreeInstance,
+    allowDesktop: true,
+    paymentMethodUsage: this.flow === 'vault' ? 'multi_use' : 'single_use',
+    allowNewBrowserTab: this.venmoNewTabSupported
+  }]).then(function (venmoInstance) {
+    // Verify browser support before proceeding.
+    if (!venmoInstance.isBrowserSupported()) {
+      console.log('Browser does not support Venmo');
+      return;
+    }
+
+    this._venmoInstance = venmoInstance;
+    return venmoInstance;
+  }.bind(this));
+};
+
 SolidusPaypalBraintree.Client.prototype._createThreeDSecure = function() {
   return SolidusPaypalBraintree.PromiseShim.convertBraintreePromise(braintree.threeDSecure.create, [{
     client: this._braintreeInstance,

data/app/assets/javascripts/solidus_paypal_braintree/constants.js

@@ -32,6 +32,10 @@ SolidusPaypalBraintree = {
 
       applepayButton: function() {
         return SolidusPaypalBraintree.ApplepayButton;
+      },
+
+      venmoButton: function() {
+        return SolidusPaypalBraintree.VenmoButton;
       }
     }
   },
@@ -63,6 +67,10 @@ SolidusPaypalBraintree = {
     return SolidusPaypalBraintree._factory(SolidusPaypalBraintree.config.classes.applepayButton(), arguments);
   },
 
+  createVenmoButton: function() {
+    return SolidusPaypalBraintree._factory(SolidusPaypalBraintree.config.classes.venmoButton(), arguments);
+  },
+
   _factory: function(klass, args) {
     var normalizedArgs = Array.prototype.slice.call(args);
     return new (Function.prototype.bind.apply(klass, [null].concat(normalizedArgs)));

data/app/assets/javascripts/solidus_paypal_braintree/frontend.js

@@ -11,3 +11,4 @@
 //= require solidus_paypal_braintree/paypal_button
 //= require solidus_paypal_braintree/paypal_messaging
 //= require solidus_paypal_braintree/apple_pay_button
+//= require solidus_paypal_braintree/venmo_button

data/app/assets/javascripts/solidus_paypal_braintree/paypal_button.js

@@ -18,6 +18,14 @@ SolidusPaypalBraintree.PaypalButton = function(element, paypalOptions, options)
   this._environment = this._paypalOptions.environment || 'sandbox';
   delete this._paypalOptions.environment;
 
+  this._buyerCountry = this._paypalOptions.buyerCountry;
+  delete paypalOptions['buyerCountry'];
+
+  this._enabledFunding = [];
+
+  if (paypalOptions['venmoFunding']) this._enabledFunding.push('venmo');
+  delete paypalOptions['venmoFunding'];
+
   if(!this._element) {
     throw new Error("Element for the paypal button must be present on the page");
   }
@@ -32,7 +40,10 @@ SolidusPaypalBraintree.PaypalButton = function(element, paypalOptions, options)
  * See {@link https://braintree.github.io/braintree-web/3.9.0/PayPal.html#tokenize}
  */
 SolidusPaypalBraintree.PaypalButton.prototype.initialize = function() {
-  this._client = new SolidusPaypalBraintree.createClient({useDataCollector: true, usePaypal: true});
+  this._client = new SolidusPaypalBraintree.createClient({
+      useDataCollector: this._paypalOptions.useDataCollector,
+      usePaypal: true
+  });
 
   return this._client.initialize().then(this.initializeCallback.bind(this));
 };
@@ -40,17 +51,28 @@ SolidusPaypalBraintree.PaypalButton.prototype.initialize = function() {
 SolidusPaypalBraintree.PaypalButton.prototype.initializeCallback = function() {
   this._paymentMethodId = this._client.paymentMethodId;
 
-  this._client.getPaypalInstance().loadPayPalSDK({
+  var args = {
+    "client-id": this._environment === "sandbox" ? "sb" : null,
     currency: this._paypalOptions.currency,
     commit: true,
     vault: this._paypalOptions.flow == "vault",
     components: this.style['messaging'] == "true" && this._paypalOptions.flow != "vault" ? "buttons,messages" : "buttons",
     intent: this._paypalOptions.flow == "vault" ? "tokenize" : "authorize"
-  }).then(() => {
+  };
+
+  if (this._environment === "sandbox" && this._buyerCountry) {
+    args["buyer-country"] = this._buyerCountry
+  }
+  if (this._enabledFunding.length !== 0) {
+    args["enable-funding"] = this._enabledFunding.join(',');
+  }
+
+  this._client.getPaypalInstance().loadPayPalSDK(args).then(() => {
     var create_method = this._paypalOptions.flow == "vault" ? "createBillingAgreement" : "createOrder"
 
     var render_config = {
       style: this.style,
+      onClick: (data) => { SolidusPaypalBraintree.fundingSource = data.fundingSource },
       [create_method]: function () {
         return this._client.getPaypalInstance().createPayment(this._paypalOptions);
       }.bind(this),
@@ -121,6 +143,7 @@ SolidusPaypalBraintree.PaypalButton.prototype._transactionParams = function(payl
       "phone" : payload.details.phone,
       "nonce" : payload.nonce,
       "payment_type" : payload.type,
+      "paypal_funding_source": SolidusPaypalBraintree.fundingSource,
       "address_attributes" : this._addressParams(payload)
     }
   };

data/app/assets/javascripts/solidus_paypal_braintree/venmo_button.js

@@ -0,0 +1,86 @@
+//= require solidus_paypal_braintree/constants
+/**
+ * Constructor for Venmo button object
+ * @constructor
+ * @param {object} element - The DOM element of your Venmo button
+ */
+SolidusPaypalBraintree.VenmoButton = function(element, venmoOptions) {
+  this._element = element;
+  this._client = null;
+  this._venmoOptions = venmoOptions || {};
+
+  if(!this._element) {
+    throw new Error("Element for the Venmo button must be present on the page");
+  }
+};
+
+/**
+ * Creates the Venmo session using the provided options and enables the button
+ *
+ * @param {object} options - The options passed to tokenize when constructing
+ *                           the Venmo instance
+ *
+ * See {@link https://braintree.github.io/braintree-web/3.84.0/module-braintree-web_venmo.html#.create}
+ */
+SolidusPaypalBraintree.VenmoButton.prototype.initialize = function() {
+  this._client = new SolidusPaypalBraintree.createClient({
+    useVenmo: true,
+    newBrowserTabSupported: this._venmoOptions.newBrowserTabSupported,
+    flow: this._venmoOptions.flow
+  });
+
+  return this._client.initialize().then(this.initializeCallback.bind(this));
+};
+
+SolidusPaypalBraintree.VenmoButton.prototype.initializeCallback = function() {
+  this._venmoInstance = this._client.getVenmoInstance();
+
+  this._element.classList.add('visible');
+
+  // Check if tokenization results already exist. This occurs when your
+  // checkout page is relaunched in a new tab.
+  if (!this._venmoOptions.newBrowserTabSupported && this._venmoInstance.hasTokenizationResult()) {
+    this.tokenize();
+  }
+
+  this._element.addEventListener('click', function(event) {
+    event.preventDefault();
+    this._element.disabled = true;
+    this.initializeVenmoSession();
+  }.bind(this), false);
+};
+
+SolidusPaypalBraintree.VenmoButton.prototype.initializeVenmoSession = function() {
+  this.tokenize();
+};
+
+SolidusPaypalBraintree.VenmoButton.prototype.tokenize = function() {
+  var venmoButton = this._element;
+  this._venmoInstance.tokenize().then(handleVenmoSuccess).catch(handleVenmoError).then(function () {
+    venmoButton.removeAttribute('disabled');
+  });
+};
+
+function handleVenmoSuccess(payload) {
+  var $paymentForm = $("#checkout_form_payment");
+  var $nonceField = $("#venmo_payment_method_nonce", $paymentForm);
+
+  // Disable hostedFields' and enable Venmo's inputs as they use the same fields.
+  // Otherwise, they will clash. (Disabled inputs are not used on form submission)
+  $('.hosted-fields input').each(function(_index, input) {
+    input.disabled = true;
+  });
+  $('.venmo-fields input').each(function(_index, input) {
+    input.removeAttribute('disabled');
+  });
+
+  // remove hostedFields submit listener, otherwise empty credit card errors occur
+  $paymentForm.off('submit');
+
+  $nonceField.val(payload.nonce);
+  $paymentForm.submit();
+}
+
+function handleVenmoError(error) {
+  SolidusPaypalBraintree.config.braintreeErrorHandle(error);
+}

data/app/assets/javascripts/spree/backend/solidus_paypal_braintree.js

@@ -68,8 +68,8 @@ $(function() {
   if (!$paymentForm.length || !$hostedFields.length) { return; }
 
   $.when(
-    $.getScript("https://js.braintreegateway.com/web/3.34.0/js/client.min.js"),
-    $.getScript("https://js.braintreegateway.com/web/3.34.0/js/hosted-fields.min.js")
+    $.getScript("https://js.braintreegateway.com/web/3.84.0/js/client.min.js"),
+    $.getScript("https://js.braintreegateway.com/web/3.84.0/js/hosted-fields.min.js")
   ).done(function() {
     $hostedFields.each(function() {
       var $this = $(this),

data/app/assets/javascripts/spree/frontend/paypal_button.js

@@ -4,9 +4,9 @@
 $(document).ready(function() {
   if (document.getElementById("empty-cart")) {
     $.when(
-      $.getScript("https://js.braintreegateway.com/web/3.31.0/js/client.min.js"),
-      $.getScript("https://js.braintreegateway.com/web/3.31.0/js/paypal-checkout.min.js"),
-      $.getScript("https://js.braintreegateway.com/web/3.31.0/js/data-collector.min.js")
+      $.getScript("https://js.braintreegateway.com/3.84.0/js/client.min.js"),
+      $.getScript("https://js.braintreegateway.com/3.84.0/js/paypal-checkout.min.js"),
+      $.getScript("https://js.braintreegateway.com/3.84.0/js/data-collector.min.js")
     ).done(function() {
       $("#content").append('<div id="paypal-button"/>');
       $('<script/>').attr({

data/app/assets/stylesheets/spree/frontend/solidus_paypal_braintree.css

@@ -37,3 +37,15 @@ the installer will append this file to the app vendored assets here: 'vendor/ass
 .apple-pay-button.visible {
   visibility: visible;
 }
+
+.venmo-button {
+  visibility: hidden;
+  border: none;
+  height: 48px;
+  background-color: transparent;
+  background-repeat: no-repeat;
+}
+
+.venmo-button.visible {
+  visibility: visible;
+}

data/app/decorators/controllers/solidus_paypal_braintree/checkout_controller_decorator.rb

@@ -6,6 +6,6 @@ module SolidusPaypalBraintree
       base.helper ::SolidusPaypalBraintree::BraintreeCheckoutHelper
     end
 
-    ::Spree::CheckoutController.prepend(self)
+    ::Spree::CheckoutController.prepend(self) if SolidusSupport.frontend_available?
   end
 end

data/app/decorators/controllers/solidus_paypal_braintree/orders_controller_decorator.rb

@@ -6,6 +6,6 @@ module SolidusPaypalBraintree
       base.helper ::SolidusPaypalBraintree::BraintreeCheckoutHelper
     end
 
-    ::Spree::OrdersController.prepend(self)
+    ::Spree::OrdersController.prepend(self) if SolidusSupport.frontend_available?
   end
 end

data/app/helpers/solidus_paypal_braintree/braintree_checkout_helper.rb

@@ -3,9 +3,8 @@
 module SolidusPaypalBraintree
   module BraintreeCheckoutHelper
     def braintree_3ds_options_for(order)
-      ship_address = order.ship_address
-      bill_address = order.bill_address
-
+      ship_address = SolidusPaypalBraintree::Address.new(order.ship_address)
+      bill_address = SolidusPaypalBraintree::Address.new(order.bill_address)
       {
         nonce: nil, # populated after tokenization
         bin: nil, # populated after tokenization
@@ -19,7 +18,7 @@ module SolidusPaypalBraintree
           streetAddress: bill_address.address1,
           extendedAddress: bill_address.address2,
           locality: bill_address.city,
-          region: bill_address.state&.name,
+          region: bill_address.state&.abbr,
           postalCode: bill_address.zipcode,
           countryCodeAlpha2: bill_address.country&.iso,
         },
@@ -31,7 +30,7 @@ module SolidusPaypalBraintree
             streedAddress: ship_address.address1,
             extendedAddress: ship_address.address2,
             locality: ship_address.city,
-            region: ship_address.state&.name,
+            region: ship_address.state&.abbr,
             postalCode: ship_address.zipcode,
             countryCodeAlpha2: ship_address.country&.iso,
           }
@@ -42,5 +41,20 @@ module SolidusPaypalBraintree
     def paypal_button_preference(key, store:)
       store.braintree_configuration.preferences[key]
     end
+
+    def venmo_button_style(store)
+      configuration = store.braintree_configuration
+      color = configuration.preferred_venmo_button_color
+      width = configuration.preferred_venmo_button_width
+
+      { width: width, color: color }
+    end
+
+    def venmo_button_asset_url(style, active: false)
+      prefix = 'solidus_paypal_braintree/venmo/venmo_'
+      active_string = active ? 'active_' : ''
+      path = "#{prefix}#{active_string}#{style[:color]}_button_#{style[:width]}x48.svg"
+      asset_path(path)
+    end
   end
 end

data/app/models/solidus_paypal_braintree/address.rb

@@ -2,27 +2,61 @@
 
 module SolidusPaypalBraintree
   class Address
+    delegate :address1,
+      :address2,
+      :city,
+      :country,
+      :phone,
+      :state,
+      :zipcode,
+      to: :spree_address
+
+    def self.split_name(name)
+      if defined?(Spree::Address::Name)
+        address_name = Spree::Address::Name.new(name)
+        [address_name.first_name, address_name.last_name]
+      else
+        name.strip.split(' ', 2)
+      end
+    end
+
     def initialize(spree_address)
       @spree_address = spree_address
     end
 
     def to_json(*_args)
       address_hash = {
-        line1: spree_address.address1,
-        line2: spree_address.address2,
-        city: spree_address.city,
-        postalCode: spree_address.zipcode,
-        countryCode: spree_address.country.iso,
-        phone: spree_address.phone,
-        recipientName: spree_address.full_name
+        line1: address1,
+        line2: address2,
+        city: city,
+        postalCode: zipcode,
+        countryCode: country.iso,
+        phone: phone,
+        recipientName: "#{firstname} #{lastname}"
       }
 
-      if ::Spree::Config.address_requires_state && spree_address.country.states_required
-        address_hash[:state] = spree_address.state.name
+      if ::Spree::Config.address_requires_state && country.states_required
+        address_hash[:state] = state.name
       end
       address_hash.to_json
     end
 
+    def firstname
+      if SolidusSupport.combined_first_and_last_name_in_address?
+        self.class.split_name(spree_address.name).first
+      else
+        spree_address.firstname
+      end
+    end
+
+    def lastname
+      if SolidusSupport.combined_first_and_last_name_in_address?
+        self.class.split_name(spree_address.name).last
+      else
+        spree_address.lastname
+      end
+    end
+
     private
 
     attr_reader :spree_address

data/app/models/solidus_paypal_braintree/avs_result.rb

@@ -41,6 +41,9 @@ module SolidusPaypalBraintree
         'I' => 'I',
         'A' => 'I'
       },
+      'B' => {
+        'B' => 'B'
+      },
       nil => { nil => nil }
     }.freeze
 

data/app/models/solidus_paypal_braintree/configuration.rb

@@ -11,9 +11,11 @@ module SolidusPaypalBraintree
       messaging: { availables: %w[true false], default: 'false' }
     }.freeze
 
-    belongs_to :store, class_name: 'Spree::Store'
+    unless respond_to?(:preference)
+      include ::Spree::Preferences::Persistable
+    end
 
-    validates :store, presence: true
+    belongs_to :store, class_name: 'Spree::Store', optional: false
 
     # Preferences for Paypal button
     PAYPAL_BUTTON_PREFERENCES.each do |name, desc|
@@ -24,5 +26,16 @@ module SolidusPaypalBraintree
 
       validates attribute_name, inclusion: desc[:availables]
     end
+
+    preference :venmo_button_color, :preference_select, default: 'blue'
+    preference :venmo_button_width, :preference_select, default: '320'
+
+    def preferred_venmo_button_color_options
+      [["Blue", "blue"], ["White", "white"]]
+    end
+
+    def preferred_venmo_button_width_options
+      [["280", "280"], ["320", "320"], ["375", "375"]]
+    end
   end
 end

data/app/models/solidus_paypal_braintree/gateway.rb

@@ -12,8 +12,8 @@ module SolidusPaypalBraintree
     NON_VOIDABLE_STATUS_ERROR_REGEXP = /can only be voided if status is authorized/.freeze
 
     TOKEN_GENERATION_DISABLED_MESSAGE = 'Token generation is disabled.' \
-      ' To re-enable set the `token_generation_enabled` preference on the' \
-      ' gateway to `true`.'
+                                        ' To re-enable set the `token_generation_enabled` preference on the' \
+                                        ' gateway to `true`.'
 
     ALLOWED_BRAINTREE_OPTIONS = [
       :device_data,
@@ -55,6 +55,21 @@ module SolidusPaypalBraintree
     # Example: { number: "Enter card number", cvv: "Enter CVV", expirationDate: "mm/yy" }
     preference(:placeholder_text, :hash, default: {})
 
+    # Wether to use the JS device data collector
+    preference(:use_data_collector, :boolean, default: true)
+
+    # Useful for testing purposes, as PayPal will show funding sources based on the buyer's country;
+    # usually retrieved by their  ip geolocation. I.e. Venmo will show for US buyers, but not European.
+    preference(:force_buyer_country, :string)
+
+    preference(:enable_venmo_funding, :boolean, default: false)
+
+    # When on mobile, paying with Venmo, the user may be returned to the same store tab
+    # depending on if their browser supports it, otherwise a new tab will be created
+    # However, returning to a new tab may break the payment checkout flow for some stores, for example,
+    # if they are single-page applications (SPA). Set this to false if this is the case
+    preference(:venmo_new_tab_support, :boolean, default: true)
+
     def partial_name
       "paypal_braintree"
     end
@@ -334,6 +349,10 @@ module SolidusPaypalBraintree
         params[:options][:paypal] = { payee_email: paypal_email }
       end
 
+      if source.venmo? && venmo_business_profile_id
+        params[:options][:venmo] = { profile_id: venmo_business_profile_id }
+      end
+
       if merchant_account_id = merchant_account_for(source, options)
         params[:merchant_account_id] = merchant_account_id
       end
@@ -401,5 +420,11 @@ module SolidusPaypalBraintree
 
       params
     end
+
+    # override with the Venmo business profile that you want to use for transactions,
+    # or leave it to be nil if want Braintree to use your default account
+    def venmo_business_profile_id
+      nil
+    end
   end
 end

data/app/models/solidus_paypal_braintree/source.rb

@@ -6,21 +6,30 @@ module SolidusPaypalBraintree
 
     PAYPAL = "PayPalAccount"
     APPLE_PAY = "ApplePayCard"
+    VENMO = "VenmoAccount"
     CREDIT_CARD = "CreditCard"
 
+    enum paypal_funding_source: {
+      applepay: 0, bancontact: 1, blik: 2, boleto: 3, card: 4, credit: 5, eps: 6, giropay: 7, ideal: 8,
+      itau: 9, maxima: 10, mercadopago: 11, mybank: 12, oxxo: 13, p24: 14, paylater: 15, paypal: 16, payu: 17,
+      sepa: 18, sofort: 19, trustly: 20, venmo: 21, verkkopankki: 22, wechatpay: 23, zimpler: 24
+    }, _suffix: :funding
+
     belongs_to :user, class_name: ::Spree::UserClassHandle.new, optional: true
     belongs_to :payment_method, class_name: 'Spree::PaymentMethod'
     has_many :payments, as: :source, class_name: "Spree::Payment", dependent: :destroy
 
     belongs_to :customer, class_name: "SolidusPaypalBraintree::Customer", optional: true
 
-    validates :payment_type, inclusion: [PAYPAL, APPLE_PAY, CREDIT_CARD]
+    validates :payment_type, inclusion: [PAYPAL, APPLE_PAY, VENMO, CREDIT_CARD]
+
+    before_save :clear_paypal_funding_source, unless: :paypal?
 
     scope(:with_payment_profile, -> { joins(:customer) })
     scope(:credit_card, -> { where(payment_type: CREDIT_CARD) })
 
     delegate :last_4, :card_type, :expiration_month, :expiration_year, :email,
-      to: :braintree_payment_method, allow_nil: true
+      :username, :source_description, to: :braintree_payment_method, allow_nil: true
 
     # Aliases to match Spree::CreditCard's interface
     alias_method :last_digits, :last_4
@@ -68,6 +77,10 @@ module SolidusPaypalBraintree
       payment_type == PAYPAL
     end
 
+    def venmo?
+      payment_type == VENMO
+    end
+
     def reusable?
       token.present?
     end
@@ -79,11 +92,23 @@ module SolidusPaypalBraintree
     def display_number
       if paypal?
         email
+      elsif venmo?
+        username
       else
         "XXXX-XXXX-XXXX-#{last_digits.to_s.rjust(4, 'X')}"
       end
     end
 
+    def display_paypal_funding_source
+      I18n.t(paypal_funding_source,
+        scope: 'solidus_paypal_braintree.paypal_funding_sources',
+        default: paypal_funding_source)
+    end
+
+    def display_payment_type
+      "#{I18n.t('solidus_paypal_braintree.payment_type.label')}: #{friendly_payment_type}"
+    end
+
     private
 
     def braintree_payment_method
@@ -100,5 +125,9 @@ module SolidusPaypalBraintree
     def braintree_client
       @braintree_client ||= payment_method.try(:braintree)
     end
+
+    def clear_paypal_funding_source
+      self.paypal_funding_source = nil
+    end
   end
 end

data/app/models/solidus_paypal_braintree/transaction.rb

@@ -6,7 +6,7 @@ module SolidusPaypalBraintree
   class Transaction
     include ActiveModel::Model
 
-    attr_accessor :nonce, :payment_method, :payment_type, :address, :email, :phone
+    attr_accessor :nonce, :payment_method, :payment_type, :paypal_funding_source, :address, :email, :phone
 
     validates :nonce, presence: true
     validates :payment_method, presence: true