MAGETWO-39881: [Tech Debt] Enable CC auto-detection for Braintree

- show detection if the the config is enabled

Author: Cristian Partica

app/code/Magento/Braintree/Model/Config/Cc.php

@@ -30,6 +30,7 @@ class Cc extends \Magento\Braintree\Model\Config
     const KEY_CC_TYPES = 'cctypes';
     const KEY_ACTIVE = 'active';
     const KEY_FRAUD_PROTECTION = 'fraudprotection';
+    const KEY_AUTO_DETECTION = 'enable_cc_detection';
 
     /**
      * @var string
@@ -176,6 +177,17 @@ public function isFraudDetectionEnabled()
         return (bool)(int)$this->getConfigData(self::KEY_ADVANCED_FRAUD_PROTECTION, $this->storeId);
     }
 
+    /**
+     * If Credit Card Auto Detection is enabled
+     *
+     * @return bool
+     */
+    public function isCcDetectionEnabled()
+    {
+        return (bool)(int)$this->getConfigData(self::KEY_AUTO_DETECTION, $this->storeId);
+    }
+
+
     /**
      * Get Advanced Fraud JS
      *

app/code/Magento/Braintree/Model/ConfigProvider.php

@@ -182,6 +182,7 @@ public function getConfig()
                     'creditCardExpYear' => (int)$this->dataHelper->getTodayYear(),
                     'countrySpecificCardTypes' => $this->config->getCountrySpecificCardTypeConfig(),
                     'isFraudDetectionEnabled' => $this->config->isFraudDetectionEnabled(),
+                    'isCcDetectionEnabled' => $this->config->isCcDetectionEnabled(),
                     'availableCardTypes' => $this->getCcAvailableCcTypes(),
                     'braintreeDataJs'=> $this->config->getBraintreeDataJs(),
                     'ajaxGenerateNonceUrl' => $this->getAjaxGenerateNonceUrl(),

app/code/Magento/Braintree/view/frontend/web/js/view/payment/method-renderer/cc-form.js

@@ -238,6 +238,11 @@ define(
                     configBraintree.useVault :
                     false;
             },
+            isCcDetectionEnabled: function() {
+                return configBraintree ?
+                    configBraintree.isCcDetectionEnabled :
+                    false;
+            },
             getStoredCards: function() {
                 var availableTypes = this.getCcAvailableTypes();
                 var storedCards = this.storedCards();

app/code/Magento/Braintree/view/frontend/web/template/payment/cc-form.html

@@ -37,13 +37,21 @@
             </select>
         </div>
     </div>
-    <!-- /ko -->
     <div>&nbsp;</div>
+    <!-- /ko -->
     <div class="field type required" data-bind="visible: isCcFormShown">
         <label data-bind="attr: {for: getCode() + '_cc_type'}" class="label">
             <span><!-- ko text: $t('Credit Card Type')--><!-- /ko --></span>
         </label>
         <div class="control">
+            <!-- ko if: (!isCcDetectionEnabled())-->
+            <select name="payment[cc_type]" class="select"
+                    data-bind="attr: {id: getCode() + '_cc_type', 'data-container': getCode() + '-cc-type', 'data-validate': JSON.stringify({required:true, 'validate-cc-type-select':'#' + getCode() + '_cc_number'})},
+                mageInit: {creditCardType:{creditCardTypeContainer:'#' + getCode() + '_cc_type_ss_div'}},
+                enable: true, options: getCcAvailableTypesValues(), optionsValue: 'value', optionsText: 'type', optionsCaption: $t('--Please Select--'), value: creditCardType">
+            </select>
+            <!-- /ko -->
+            <!-- ko if: (isCcDetectionEnabled())-->
             <ul class="credit-card-types">
                 <!-- ko foreach: {data: getCcAvailableTypesValues(), as: 'item'} -->
                 <li class="item" data-bind="css: {_active: $parent.selectedCardType() == item.value} ">
@@ -65,6 +73,7 @@
                    data-bind="attr: {id: getCode() + '_cc_type', 'data-container': getCode() + '-cc-type'},
                    value: creditCardType
                    ">
+            <!-- /ko -->
         </div>
     </div>
     <div class="field number required" data-bind="visible: isCcFormShown">