From ebb408ae8d5ed84bd8ac3e94d757f5c746ad0f90 Mon Sep 17 00:00:00 2001
From: Andrea <andrea@avris.it>
Date: Sun, 13 Feb 2022 23:19:06 +0100
Subject: [PATCH] [perf][bug] disable no-ssr and fix hCaptcha rendering in SSR

---
 components/Captcha.vue | 24 ++++++++++++------------
 components/Login.vue   |  2 +-
 layouts/default.vue    |  2 +-
 server/no-ssr.js       |  6 +++---
 4 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/components/Captcha.vue b/components/Captcha.vue
index 3dc0f260..752e02e8 100644
--- a/components/Captcha.vue
+++ b/components/Captcha.vue
@@ -1,5 +1,5 @@
 <template>
-    <div style="height: 73px"></div>
+    <div style="height: 73px" @click="render"></div>
 </template>
 
 <script>
@@ -11,19 +11,19 @@
             value: {},
         },
         async mounted() {
-            if (!process.client) {
-                return false;
-            }
-
-            await this.$loadScript('hcaptcha', 'https://js.hcaptcha.com/1/api.js');
-
-            window.hcaptcha.render(this.$el, {
-                sitekey: process.env.HCAPTCHA_SITEKEY,
-                theme: this.detectDark() ? 'dark' : 'light',
-                callback: this.solved,
-            });
+            if (!process.client) { return; }
+            await this.$loadScript('hcaptcha', `https://js.hcaptcha.com/1/api.js?hl=${this.config.locale}`);
+            setTimeout(() => { this.render() }, 500);
         },
         methods: {
+            render() {
+                if (!window.hcaptcha || this.$el.innerHTML.length) { return; }
+                window.hcaptcha.render(this.$el, {
+                    sitekey: process.env.HCAPTCHA_SITEKEY,
+                    theme: this.detectDark() ? 'dark' : 'light',
+                    callback: this.solved,
+                });
+            },
             solved(token) {
                 this.$emit('input', token);
             },
diff --git a/components/Login.vue b/components/Login.vue
index c09f2f08..1c32e907 100644
--- a/components/Login.vue
+++ b/components/Login.vue
@@ -24,7 +24,7 @@
                                     <Icon v="info-circle"/>
                                     <T>captcha.reason</T>
                                 </p>
-                                <Captcha class="h-captcha" v-model="captchaToken"/>
+                                <Captcha v-model="captchaToken"/>
                                 <button class="btn btn-primary mt-3 d-none d-md-block" :disabled="!canInit">
                                     <Icon v="sign-in"/>
                                     <T>user.login.action</T>
diff --git a/layouts/default.vue b/layouts/default.vue
index 6215a795..04dfc20a 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -51,7 +51,7 @@
             sorter();
 
             if (process.env.NODE_ENV === 'production') {
-                //this.monkeyPatchBlockTrackers(['google-analytics.com', 'tkr.arc.io', 'browser.sentry-cdn.com',]);
+                this.monkeyPatchBlockTrackers(['google-analytics.com', 'tkr.arc.io', 'browser.sentry-cdn.com',]);
                 this.$loadScript('arc', 'https://arc.io/widget.min.js#yHdNYRkC');
             }
 
diff --git a/server/no-ssr.js b/server/no-ssr.js
index c3bc131c..7482b62c 100644
--- a/server/no-ssr.js
+++ b/server/no-ssr.js
@@ -14,8 +14,8 @@ const isBrowser = (userAgent) => {
 }
 
 export default function(req, res, next) {
-    if (process.env.NODE_ENV === 'production' && !req.url.startsWith('/card/@')) {
-       res.spa = isBrowser(req.headers['user-agent']) || isHighLoadTime(process.env.LOCALE);
-    }
+    // if (process.env.NODE_ENV === 'production' && !req.url.startsWith('/card/@')) {
+    //    res.spa = isBrowser(req.headers['user-agent']) || isHighLoadTime(process.env.LOCALE);
+    // }
     next();
 }