Release 2.14.0 (#752)

* Added Live Step Viewed variable and controller

* Added sourcemap generation on development

* Updated Sentry dependency and refactored plugin installation

* Added action to interact with live step viewed in storage

* Added exception capture on get link onboarding and on account 'false'

* Refactored plugin installation order

* Modified environment variable names

* Modified package version to 2.14.0

.gitignore

@@ -14,6 +14,7 @@ config_*.xml
 ### Vuejs ignore build files ###
 /views/js/back/
 /views/js/app.js
+/views/js/app.js.map
 /views/js/front.js
 /views/js/front.js.LICENSE.txt
 /views/img/almost-ready.png

_dev/js/back/package.json

@@ -37,9 +37,10 @@
   },
   "dependencies": {
     "@femessage/log-viewer": "^1.4.1",
-    "@prestashopcorp/segment-vue": "^1.2.10",
-    "@sentry/browser": "^5.18.0",
-    "@sentry/integrations": "^5.18.0",
+    "@prestashopcorp/segment-vue": "^1.2.11",
+    "@sentry/browser": "^6.2.1",
+    "@sentry/tracing": "^6.2.1",
+    "@sentry/vue": "^6.2.1",
     "axios": "^0.21.1",
     "bootstrap-vue": "^2.16.0",
     "core-js": "^3.6.5",

_dev/js/back/src/components/block/onboarding.vue

@@ -51,6 +51,8 @@
 </template>
 
 <script>
+  import * as Sentry from '@sentry/vue';
+
   export default {
     name: 'Onboarding',
     data() {
@@ -90,6 +92,8 @@
             this.$refs.paypalButton.click();
           })
           .catch(response => {
+            Sentry.captureException(response);
+
             // eslint-disable-next-line no-console
             console.log(response);
           });

_dev/js/back/src/components/panel/paypal-account.vue

@@ -155,8 +155,11 @@
 </template>
 
 <script>
+  import * as Sentry from '@sentry/vue';
+
   import AccountStatusPayPal from '@/components/block/account-status-paypal.vue';
   import Onboarding from '@/components/block/onboarding';
+  import { PaypalAccountFalseOnboardingException } from '@/exception/paypal-onboarding.exception';
 
   export default {
     components: {
@@ -169,7 +172,21 @@
         return this.$store.state.paypal.paypalOnboardingLink === false;
       },
       paypalEmail() {
-        return this.$store.state.paypal.emailMerchant;
+        const emailMerchant = this.$store.state.paypal.emailMerchant;
+        if (
+          !this.$store.state.context.liveStepViewed &&
+          this.paypalAccountStatus
+        ) {
+          if (!emailMerchant) {
+            Sentry.captureException(
+              new PaypalAccountFalseOnboardingException()
+            );
+          }
+
+          this.$store.dispatch('updatePaypalStatusViewed');
+        }
+
+        return emailMerchant;
       },
       checkoutAccountStatus() {
         return this.$store.state.firebase.onboardingCompleted;

_dev/js/back/src/core/plugins/segment.js

@@ -0,0 +1,30 @@
+/**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to [email protected] so we can send you a copy immediately.
+ *
+ * @author    PrestaShop SA <[email protected]>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ */
+import Segment from '@prestashopcorp/segment-vue';
+
+export default {
+  install(Vue, { router }) {
+    Vue.use(Segment, {
+      id: process.env.VUE_APP_PS_CHECKOUT_SEGMENT_API_KEY,
+      router,
+      debug: process.env.NODE_ENV !== 'production',
+      pageCategory: 'ps_checkout'
+    });
+  }
+};

_dev/js/back/src/core/plugins/sentry.js

@@ -0,0 +1,45 @@
+/**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to [email protected] so we can send you a copy immediately.
+ *
+ * @author    PrestaShop SA <[email protected]>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ */
+import * as Sentry from '@sentry/vue';
+import { Integrations } from '@sentry/tracing';
+
+export default {
+  install(Vue, { store }) {
+    const correlationId = Math.random()
+      .toString(36)
+      .substr(2, 9);
+
+    Sentry.init({
+      Vue,
+      dsn: `https://${process.env.VUE_APP_PS_CHECKOUT_SENTRY_KEY}@${process.env.VUE_APP_PS_CHECKOUT_SENTRY_ORGANIZATION}.ingest.sentry.io/${process.env.VUE_APP_PS_CHECKOUT_SENTRY_PROJECT}`,
+      integrations: [new Integrations.BrowserTracing()],
+
+      // We recommend adjusting this value in production, or using tracesSampler
+      // for finer control
+      tracesSampleRate: 1.0,
+
+      logErrors: process.env.NODE_ENV !== 'production'
+    });
+
+    Sentry.configureScope(scope => {
+      scope.setExtras(store.state);
+      scope.setTag('transaction_id', correlationId);
+    });
+  }
+};

_dev/js/back/src/exception/paypal-onboarding.exception.js

@@ -0,0 +1,24 @@
+/**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to [email protected] so we can send you a copy immediately.
+ *
+ * @author    PrestaShop SA <[email protected]>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ */
+export class PaypalAccountFalseOnboardingException extends Error {
+  constructor() {
+    super("PayPal account 'false'");
+    this.name = 'PaypalAccountFalseOnboardingException';
+  }
+}

_dev/js/back/src/main.js

@@ -17,42 +17,24 @@
  * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
  */
 import Vue from 'vue';
+
+import Sentry from './core/plugins/sentry';
+import Segment from './core/plugins/segment';
+
+Vue.use(Sentry, { store });
+Vue.use(Segment, { router });
+
 import BootstrapVue from 'bootstrap-vue';
 import VueCollapse from 'vue2-collapse';
-import * as Sentry from '@sentry/browser';
-import { Vue as VueIntegration } from '@sentry/integrations';
 
 import i18n from './lib/i18n';
 import App from './App.vue';
 import router from './router';
 import store from './store';
-import VueSegment from '@prestashopcorp/segment-vue';
 
 Vue.use(BootstrapVue);
 Vue.use(VueCollapse);
 
-Vue.use(VueSegment, {
-  id: 'BftCN3EnnGD1ETnf4FUBxP1WFMQ80JFZ',
-  router,
-  debug: process.env.NODE_ENV !== 'production',
-  pageCategory: 'ps_checkout'
-});
-
-Sentry.init({
-  dsn: `https://${process.env.VUE_APP_SENTRY_KEY}@${process.env.VUE_APP_SENTRY_ORGANIZATION}.ingest.sentry.io/${process.env.VUE_APP_SENTRY_PROJECT}`,
-  integrations: [new VueIntegration({ Vue, attachProps: true })]
-});
-Sentry.configureScope(scope => {
-  scope.setExtra(store.state);
-});
-
-const correlationId = Math.random()
-  .toString(36)
-  .substr(2, 9);
-Sentry.configureScope(scope => {
-  scope.setTag('transaction_id', correlationId);
-});
-
 Vue.config.productionTip = process.env.NODE_ENV === 'production';
 
 window.onload = () => {

_dev/js/back/src/store/modules/paypal/actions.js

@@ -59,6 +59,19 @@ export default {
       throw resp;
     });
   },
+  updatePaypalStatusViewed({ commit, getters }) {
+    return ajax({
+      url: getters.adminController,
+      action: 'LiveStepViewed'
+    }).then(resp => {
+      if (resp) {
+        commit(types.UPDATE_VIEWED_LIVE_STEP, true);
+        return true;
+      }
+
+      throw resp;
+    });
+  },
   updatePaypalValueBanner({ commit, getters }) {
     return ajax({
       url: getters.adminController,

_dev/js/back/src/store/modules/paypal/mutation-types.js

@@ -20,4 +20,5 @@ export const UNLINK_ACCOUNT = 'UNLINK_ACCOUNT';
 export const UPDATE_ONBOARDING_LINK = 'UPDATE_ONBOARDING_LINK';
 export const UPDATE_PAYPAL_ACCOUNT_STATUS = 'UPDATE_PAYPAL_ACCOUNT_STATUS';
 export const UPDATE_CONFIRMED_LIVE_STEP = 'UPDATE_CONFIRMED_LIVE_STEP';
+export const UPDATE_VIEWED_LIVE_STEP = 'UPDATE_VIEWED_LIVE_STEP';
 export const UPDATE_VALUE_BANNER_CLOSED = 'UPDATE_VALUE_BANNER_CLOSED';

_dev/js/back/src/store/modules/paypal/mutations.js

@@ -33,6 +33,9 @@ export default {
   [types.UPDATE_CONFIRMED_LIVE_STEP](state, confirmed) {
     state.isLiveStepConfirmed = confirmed;
   },
+  [types.UPDATE_VIEWED_LIVE_STEP](state, viewed) {
+    state.isLiveStepViewed = viewed;
+  },
   [types.UPDATE_VALUE_BANNER_CLOSED](state, closed) {
     state.isValueBannerClosed = closed;
   }

_dev/js/back/vue.config.js

@@ -17,6 +17,7 @@
  * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
  */
 const path = require('path');
+
 module.exports = {
   chainWebpack: config => {
     config.optimization.delete('splitChunks');
@@ -25,6 +26,12 @@ module.exports = {
     config.plugins.delete('prefetch');
     config.resolve.alias.set('@', path.resolve(__dirname, 'src'));
   },
+  configureWebpack:
+    process.env.NODE_ENV === 'production'
+      ? {}
+      : {
+          devtool: 'source-map'
+        },
   css: {
     extract: false
   },

config.xml

@@ -2,7 +2,7 @@
 <module>
 	<name>ps_checkout</name>
 	<displayName><![CDATA[PrestaShop Checkout]]></displayName>
-	<version><![CDATA[2.13.0]]></version>
+	<version><![CDATA[2.14.0]]></version>
 	<description><![CDATA[Provide the most commonly used payment methods to your customers in this all-in-one module, and manage all your sales in a centralized interface.]]></description>
 	<author><![CDATA[PrestaShop]]></author>
 	<tab><![CDATA[payments_gateways]]></tab>

controllers/admin/AdminAjaxPrestashopCheckoutController.php

@@ -83,6 +83,18 @@ public function ajaxProcessLiveStepConfirmed()
         $this->ajaxDie(json_encode(true));
     }
 
+    /**
+     * AJAX: Confirm PS Live Step fist time
+     */
+    public function ajaxProcessLiveStepViewed()
+    {
+        /** @var \PrestaShop\Module\PrestashopCheckout\OnBoarding\Step\LiveStep $stepLive */
+        $stepLive = $this->module->getService('ps_checkout.step.live');
+        $stepLive->viewed(true);
+
+        $this->ajaxDie(json_encode(true));
+    }
+
     /**
      * AJAX: Confirm PS Value Banner closed
      */
@@ -136,6 +148,7 @@ public function ajaxProcessLogOutPaypalAccount()
         /** @var \PrestaShop\Module\PrestashopCheckout\OnBoarding\Step\LiveStep $stepLive */
         $stepLive = $this->module->getService('ps_checkout.step.live');
         $stepLive->confirmed(false);
+        $stepLive->viewed(false);
 
         // we reset the Value banner
         /** @var \PrestaShop\Module\PrestashopCheckout\OnBoarding\Step\ValueBanner $valueBanner */

ps_checkout.php

@@ -117,6 +117,7 @@ class Ps_checkout extends PaymentModule
         'PS_CHECKOUT_LOGGER_LEVEL' => '400',
         'PS_CHECKOUT_LOGGER_HTTP' => '0',
         'PS_CHECKOUT_LOGGER_HTTP_FORMAT' => 'DEBUG',
+        'PS_CHECKOUT_LIVE_STEP_VIEWED' => false,
         'PS_CHECKOUT_INTEGRATION_DATE' => self::INTEGRATION_DATE,
         'PS_CHECKOUT_SHOP_UUID_V4' => '',
     ];
@@ -126,7 +127,7 @@ class Ps_checkout extends PaymentModule
 
     // Needed in order to retrieve the module version easier (in api call headers) than instanciate
     // the module each time to get the version
-    const VERSION = '2.13.0';
+    const VERSION = '2.14.0';
 
     const INTEGRATION_DATE = '2020-07-30';
 
@@ -147,7 +148,7 @@ public function __construct()
 
         // We cannot use the const VERSION because the const is not computed by addons marketplace
         // when the zip is uploaded
-        $this->version = '2.13.0';
+        $this->version = '2.14.0';
         $this->author = 'PrestaShop';
         $this->need_instance = 0;
         $this->currencies = true;

src/Environment/SegmentEnv.php

@@ -33,7 +33,7 @@ public function __construct()
     {
         parent::__construct();
 
-        $this->setSegmentApiKey($this->getEnv('SEGMENT_API_KEY'));
+        $this->setSegmentApiKey($this->getEnv('PS_CHECKOUT_SEGMENT_API_KEY'));
     }
 
     /**

src/Environment/SentryEnv.php

@@ -47,9 +47,9 @@ public function __construct()
     {
         parent::__construct();
 
-        $this->setKey($this->getEnv('VUE_APP_SENTRY_KEY'));
-        $this->setOrganisation($this->getEnv('VUE_APP_SENTRY_ORGANIZATION'));
-        $this->setProject($this->getEnv('VUE_APP_SENTRY_PROJECT'));
+        $this->setKey($this->getEnv('PS_CHECKOUT_SENTRY_KEY'));
+        $this->setOrganisation($this->getEnv('PS_CHECKOUT_SENTRY_ORGANIZATION'));
+        $this->setProject($this->getEnv('PS_CHECKOUT_SENTRY_PROJECT'));
     }
 
     /**