feat: HaTS survey (#5153)

This adds integration with surveymonkey.com so we can run the feedback surveys. There is a middleware feedback that is added in all `/docs` routes that checks if the user should get the CTA to fill the survey. The criteria is: - There is a survey running - No popup in the last 90 days - Shows only to 8% of the users This middleware injects some variables in the handlebars context that are then read by the partial `feedback.hbs` that adds the right code to show the content.
2021-03-03 10:14:55 -08:00 · 2021-03-03 10:14:55 -08:00 · 82acbf2cfa
--- a/.gitignore
+++ b/.gitignore
@ -13,3 +13,4 @@ cypress/videos/*
 .nyc_output
 coverage
 .DS_Store
+.vscode
--- a/lib/surveymonkey.js
+++ b/lib/surveymonkey.js
@ -0,0 +1,96 @@
+//@ts-check
+
+/** @type {import("got").default} */
+const got = require('got')
+
+const token = process.env.SM_TOKEN
+
+const surveyMonkey = got.extend({
+  prefixUrl: 'https://api.surveymonkey.com/v3/',
+  headers: {
+    Authorization: `bearer ${token}`,
+    'Content-Type': 'application/json',
+  },
+  responseType: 'json',
+})
+
+/**
+ * Queries SurveyMonkey and returns the survey information
+ * @param {string} surveyId
+ */
+const getSurvey = async (surveyId) => {
+
+  /**
+   * The API returns an Array, but there should only be a collector
+   * with the name `popup`
+   * https://developer.surveymonkey.com/api/v3/#surveys-id-collectors
+   */
+  const [collectorInformation] = (
+    await surveyMonkey(`surveys/${surveyId}/collectors?name=popup`).json()
+  ).data
+
+  const collector = await surveyMonkey(
+    `collectors/${collectorInformation.id}`
+  ).json()
+
+  // Find collectors for dates and such
+  return { status: collector.status, embedCode: collector.embed_code }
+}
+
+/**
+ * @returns {Promise<any[]>}
+ */
+const getSurveys = async () => {
+  /** @type {any[]} */
+  const allSurveys = (
+    await surveyMonkey
+      .get(`surveys?sort_by=date_modified&sort_order=DESC`)
+      .json()
+  ).data
+
+  const surveys = allSurveys.filter((survey) => {
+    return survey.title.includes(`Electron's documentation`)
+  })
+
+  return surveys
+}
+
+/**
+ * Returns the information for the last survey related to Electron's documentation
+ */
+const getLatestSurvey = async () => {
+  const noSurvey = {
+    status: 'close',
+    embedCode: '<div>Survey not available</div>', // This will show up only in debug mode
+  }
+
+  if (!token) {
+    return noSurvey
+  }
+
+  const surveys = await getSurveys()
+
+  if(surveys.length === 0){
+    return noSurvey
+  }
+
+  const sortedSurveys = surveys.sort((surveyA, surveyB) => {
+    if (surveyA.date_modified < surveyB.date_modified) {
+      return -1
+    }
+
+    if (surveyA.date_modified > surveyB.date_modified) {
+      return 1
+    }
+
+    return 0
+  })
+
+  const latestSurvey = await getSurvey(sortedSurveys[0].id)
+
+  return latestSurvey
+}
+
+module.exports = {
+  getLatestSurvey,
+}
--- a/middleware/feedback.js
+++ b/middleware/feedback.js
@ -0,0 +1,103 @@
+//@ts-check
+
+/**
+ * Middleware that checks if the feedback CTA needs to be displayed or not
+ * and adds the right properties to the context to be consumed by partials.
+ */
+
+const surveyMonkey = require('../lib/surveymonkey')
+
+/** How long the user will not be bothered with the feedback CTA (90 days) */
+const cookieExpiration = 90 * 24 * 3600 * 1000
+const cookieName = 'feedbackCTA'
+const cookieValue = 'true'
+
+/** Refresh status every 15 minutes */
+const freshnessTimeout = 15 * 60 * 1000
+
+let surveyLastRefreshed = -1
+let cachedSurvey
+
+const getLastSurveyInformation = async () => {
+  const isFresh = Date.now() - surveyLastRefreshed < freshnessTimeout
+
+  if (!cachedSurvey || !isFresh) {
+    cachedSurvey = await surveyMonkey.getLatestSurvey()
+    surveyLastRefreshed = Date.now()
+  }
+
+  return cachedSurvey
+}
+
+/**
+ * Checks if the current survey is opened
+ * @returns {Boolean}
+ */
+const isSurveyOpen = (survey) => {
+  // Even though the doc say it's only "open" or "close", it can also be "new" 😒
+  return survey.status !== 'close'
+}
+
+/**
+ * Checks if the user has been shown the CTA previously
+ * @param {any} cookies
+ * @returns {Boolean}
+ */
+const userIsNotTainted = (cookies) => {
+  return !(cookies[cookieName] && cookies[cookieName] === cookieValue)
+}
+
+/**
+ * Randomly selects 8% of the users
+ * @returns {Boolean}
+ */
+const shouldShowCTAToUser = () => {
+  return Math.random() <= 0.08
+}
+
+/**
+ * Returns a JSON object telling if the CTA needs to be shown or not,
+ * and updating the cookie status so the client knows to now show it.
+ *
+ * Even though SM has a way to define the % of visitors that will see
+ * the pop up for a survey, it is only limited to that particular one.
+ * We want to make sure users are not bothered for 3 months and if we
+ * have a new one every 2 weeks that is not possible.
+ * @param {import("express").Request} req
+ * @param {import("express").Response} res
+ */
+module.exports = async (req, res, next) => {
+  const lastSurvey = await getLastSurveyInformation()
+  const criteria = [
+    isSurveyOpen(lastSurvey),
+    userIsNotTainted(req.cookies),
+    shouldShowCTAToUser(),
+  ]
+
+  const validatesCriteria = criteria.every((check) => check)
+  const debugging = req.query.debug === 'true'
+
+  if (validatesCriteria || debugging) {
+    // The context object is manually passed to HBS when rendering
+    // The associated partial (/views/partials/feedback.hbs) will
+    // use these variables to decide what and when to render
+    const context = {
+      showFeedback: true,
+      feedbackEmbedCode: lastSurvey.embedCode,
+      // Bypass the popup limitation of showing only once per session: https://stackoverflow.com/a/55789538
+      // The cookie will clear only if debugging is done in the first page where the cookie was set
+      debugging,
+    }
+
+    req.context = Object.assign(req.context, context)
+
+    // Set only the do-not-bother-me-for-a-while cookie if we are not debugging
+    if (!debugging) {
+      res.cookie(cookieName, cookieValue, {
+        maxAge: cookieExpiration,
+      })
+    }
+  }
+
+  next()
+}
--- a/package-lock.json
+++ b/package-lock.json
@ -2170,10 +2170,9 @@
      "dev": true
    },
    "@sindresorhus/is": {
-      "version": "0.14.0",
-      "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz",
-      "integrity": "sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==",
-      "dev": true
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-4.0.0.tgz",
+      "integrity": "sha512-FyD2meJpDPjyNQejSjvnhpgI/azsQkA4lGbuu5BQZfjvJ9cbRZXzeWL2HceCekW4lixO9JPesIIQkSoLjeJHNQ=="
    },
    "@stylelint/postcss-css-in-js": {
      "version": "0.37.2",
@ -2195,12 +2194,32 @@
      }
    },
    "@szmarczak/http-timer": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-1.1.2.tgz",
-      "integrity": "sha512-XIB2XbzHTN6ieIjfIMV9hlVcfPU26s2vafYWQcZHWXHOxiaRZYEDKEwdl129Zyg50+foYV2jCgtrqSA6qNuNSA==",
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-4.0.5.tgz",
+      "integrity": "sha512-PyRA9sm1Yayuj5OIoJ1hGt2YISX45w9WcFbh6ddT0Z/0yaFxOtGLInr4jUfU1EAFVs0Yfyfev4RNwBlUaHdlDQ==",
+      "requires": {
+        "defer-to-connect": "^2.0.0"
+      }
+    },
+    "@types/body-parser": {
+      "version": "1.19.0",
+      "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.0.tgz",
+      "integrity": "sha512-W98JrE0j2K78swW4ukqMleo8R7h/pFETjM2DQ90MF6XK2i4LO4W3gQ71Lt4w3bfm2EvVSyWHplECvB5sK22yFQ==",
      "dev": true,
      "requires": {
-        "defer-to-connect": "^1.0.1"
+        "@types/connect": "*",
+        "@types/node": "*"
+      }
+    },
+    "@types/cacheable-request": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/@types/cacheable-request/-/cacheable-request-6.0.1.tgz",
+      "integrity": "sha512-ykFq2zmBGOCbpIXtoVbz4SKY5QriWPh3AjyU4G74RYbtt5yOc5OfaY75ftjg7mikMOla1CTGpX3lLbuJh8DTrQ==",
+      "requires": {
+        "@types/http-cache-semantics": "*",
+        "@types/keyv": "*",
+        "@types/node": "*",
+        "@types/responselike": "*"
      }
    },
    "@types/color-name": {
@ -2209,6 +2228,47 @@
      "integrity": "sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==",
      "dev": true
    },
+    "@types/connect": {
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.34.tgz",
+      "integrity": "sha512-ePPA/JuI+X0vb+gSWlPKOY0NdNAie/rPUqX2GUPpbZwiKTkSPhjXWuee47E4MtE54QVzGCQMQkAL6JhV2E1+cQ==",
+      "dev": true,
+      "requires": {
+        "@types/node": "*"
+      }
+    },
+    "@types/cookie-parser": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/@types/cookie-parser/-/cookie-parser-1.4.2.tgz",
+      "integrity": "sha512-uwcY8m6SDQqciHsqcKDGbo10GdasYsPCYkH3hVegj9qAah6pX5HivOnOuI3WYmyQMnOATV39zv/Ybs0bC/6iVg==",
+      "dev": true,
+      "requires": {
+        "@types/express": "*"
+      }
+    },
+    "@types/express": {
+      "version": "4.17.11",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.11.tgz",
+      "integrity": "sha512-no+R6rW60JEc59977wIxreQVsIEOAYwgCqldrA/vkpCnbD7MqTefO97lmoBe4WE0F156bC4uLSP1XHDOySnChg==",
+      "dev": true,
+      "requires": {
+        "@types/body-parser": "*",
+        "@types/express-serve-static-core": "^4.17.18",
+        "@types/qs": "*",
+        "@types/serve-static": "*"
+      }
+    },
+    "@types/express-serve-static-core": {
+      "version": "4.17.18",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.18.tgz",
+      "integrity": "sha512-m4JTwx5RUBNZvky/JJ8swEJPKFd8si08pPF2PfizYjGZOKr/svUWPcoUmLow6MmPzhasphB7gSTINY67xn3JNA==",
+      "dev": true,
+      "requires": {
+        "@types/node": "*",
+        "@types/qs": "*",
+        "@types/range-parser": "*"
+      }
+    },
    "@types/hast": {
      "version": "2.3.1",
      "resolved": "https://registry.npmjs.org/@types/hast/-/hast-2.3.1.tgz",
@ -2217,6 +2277,11 @@
        "@types/unist": "*"
      }
    },
+    "@types/http-cache-semantics": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@types/http-cache-semantics/-/http-cache-semantics-4.0.0.tgz",
+      "integrity": "sha512-c3Xy026kOF7QOTn00hbIllV1dLR9hG9NkSrLQgCVs8NF6sBU+VGWjD3wLPhmh1TYAc7ugCFsvHYMN4VcBN1U1A=="
+    },
    "@types/http-proxy": {
      "version": "1.17.4",
      "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.4.tgz",
@ -2231,6 +2296,14 @@
      "integrity": "sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==",
      "dev": true
    },
+    "@types/keyv": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@types/keyv/-/keyv-3.1.1.tgz",
+      "integrity": "sha512-MPtoySlAZQ37VoLaPcTHCu1RWJ4llDkULYZIzOYxlhxBqYPB0RsRlmMU0R6tahtFe27mIdkHV+551ZWV4PLmVw==",
+      "requires": {
+        "@types/node": "*"
+      }
+    },
    "@types/mdast": {
      "version": "3.0.3",
      "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-3.0.3.tgz",
@ -2240,6 +2313,12 @@
        "@types/unist": "*"
      }
    },
+    "@types/mime": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
+      "integrity": "sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw==",
+      "dev": true
+    },
    "@types/minimatch": {
      "version": "3.0.3",
      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
@ -2274,6 +2353,36 @@
      "resolved": "https://registry.npmjs.org/@types/parse5/-/parse5-5.0.3.tgz",
      "integrity": "sha512-kUNnecmtkunAoQ3CnjmMkzNU/gtxG8guhi+Fk2U/kOpIKjIMKnXGp4IJCgQJrXSgMsWYimYG4TGjz/UzbGEBTw=="
    },
+    "@types/qs": {
+      "version": "6.9.5",
+      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.5.tgz",
+      "integrity": "sha512-/JHkVHtx/REVG0VVToGRGH2+23hsYLHdyG+GrvoUGlGAd0ErauXDyvHtRI/7H7mzLm+tBCKA7pfcpkQ1lf58iQ==",
+      "dev": true
+    },
+    "@types/range-parser": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.3.tgz",
+      "integrity": "sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA==",
+      "dev": true
+    },
+    "@types/responselike": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@types/responselike/-/responselike-1.0.0.tgz",
+      "integrity": "sha512-85Y2BjiufFzaMIlvJDvTTB8Fxl2xfLo4HgmHzVBz08w4wDePCTjYw66PdrolO0kzli3yam/YCgRufyo1DdQVTA==",
+      "requires": {
+        "@types/node": "*"
+      }
+    },
+    "@types/serve-static": {
+      "version": "1.13.9",
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.13.9.tgz",
+      "integrity": "sha512-ZFqF6qa48XsPdjXV5Gsz0Zqmux2PerNd3a/ktL45mHpa19cuMi/cL8tcxdAx497yRh+QtYPuofjT9oWw9P7nkA==",
+      "dev": true,
+      "requires": {
+        "@types/mime": "^1",
+        "@types/node": "*"
+      }
+    },
    "@types/sinonjs__fake-timers": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/@types/sinonjs__fake-timers/-/sinonjs__fake-timers-6.0.2.tgz",
@ -4147,36 +4256,23 @@
        }
      }
    },
+    "cacheable-lookup": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/cacheable-lookup/-/cacheable-lookup-5.0.4.tgz",
+      "integrity": "sha512-2/kNscPhpcxrOigMZzbiWF7dz8ilhb/nIHU3EyZiXWXpeq/au8qJ8VhdftMkty3n7Gj6HIGalQG8oiBNB3AJgA=="
+    },
    "cacheable-request": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-6.1.0.tgz",
-      "integrity": "sha512-Oj3cAGPCqOZX7Rz64Uny2GYAZNliQSqfbePrgAQ1wKAihYmCUnraBtJtKcGR4xz7wF+LoJC+ssFZvv5BgF9Igg==",
-      "dev": true,
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-7.0.1.tgz",
+      "integrity": "sha512-lt0mJ6YAnsrBErpTMWeu5kl/tg9xMAWjavYTN6VQXM1A/teBITuNcccXsCxF0tDQQJf9DfAaX5O4e0zp0KlfZw==",
      "requires": {
        "clone-response": "^1.0.2",
        "get-stream": "^5.1.0",
        "http-cache-semantics": "^4.0.0",
-        "keyv": "^3.0.0",
+        "keyv": "^4.0.0",
        "lowercase-keys": "^2.0.0",
        "normalize-url": "^4.1.0",
-        "responselike": "^1.0.2"
-      },
-      "dependencies": {
-        "get-stream": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
-          "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
-          "dev": true,
-          "requires": {
-            "pump": "^3.0.0"
-          }
-        },
-        "lowercase-keys": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-2.0.0.tgz",
-          "integrity": "sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==",
-          "dev": true
-        }
+        "responselike": "^2.0.0"
      }
    },
    "cachedir": {
@ -4741,7 +4837,6 @@
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/clone-response/-/clone-response-1.0.2.tgz",
      "integrity": "sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws=",
-      "dev": true,
      "requires": {
        "mimic-response": "^1.0.0"
      }
@ -5582,12 +5677,18 @@
      "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
    },
    "decompress-response": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz",
-      "integrity": "sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M=",
-      "dev": true,
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz",
+      "integrity": "sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==",
      "requires": {
-        "mimic-response": "^1.0.0"
+        "mimic-response": "^3.1.0"
+      },
+      "dependencies": {
+        "mimic-response": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-3.1.0.tgz",
+          "integrity": "sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ=="
+        }
      }
    },
    "dedent": {
@ -5616,10 +5717,9 @@
      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
    },
    "defer-to-connect": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-1.1.3.tgz",
-      "integrity": "sha512-0ISdNousHvZT2EiFlZeZAHBUvSxmKswVCEf8hW7KWgG4a8MVEu/3Vb6uWYozkjylyCxe0JBIiRB1jV45S70WVQ==",
-      "dev": true
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-2.0.0.tgz",
+      "integrity": "sha512-bYL2d05vOSf1JEZNx5vSAtPuBMkX8K9EUutg7zlKvTqKXHt7RhWJFbmd7qakVuf13i+IkGmp6FwSsONOf6VYIg=="
    },
    "define-properties": {
      "version": "1.1.3",
@ -8051,10 +8151,9 @@
      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
    },
    "get-stream": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
-      "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
-      "dev": true,
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
+      "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
      "requires": {
        "pump": "^3.0.0"
      }
@ -8247,22 +8346,21 @@
      }
    },
    "got": {
-      "version": "9.6.0",
-      "resolved": "https://registry.npmjs.org/got/-/got-9.6.0.tgz",
-      "integrity": "sha512-R7eWptXuGYxwijs0eV+v3o6+XH1IqVK8dJOEecQfTmkncw9AV4dcw/Dhxi8MdlqPthxxpZyizMzyg8RTmEsG+Q==",
-      "dev": true,
+      "version": "11.8.1",
+      "resolved": "https://registry.npmjs.org/got/-/got-11.8.1.tgz",
+      "integrity": "sha512-9aYdZL+6nHmvJwHALLwKSUZ0hMwGaJGYv3hoPLPgnT8BoBXm1SjnZeky+91tfwJaDzun2s4RsBRy48IEYv2q2Q==",
      "requires": {
-        "@sindresorhus/is": "^0.14.0",
-        "@szmarczak/http-timer": "^1.1.2",
-        "cacheable-request": "^6.0.0",
-        "decompress-response": "^3.3.0",
-        "duplexer3": "^0.1.4",
-        "get-stream": "^4.1.0",
-        "lowercase-keys": "^1.0.1",
-        "mimic-response": "^1.0.1",
-        "p-cancelable": "^1.0.0",
-        "to-readable-stream": "^1.0.0",
-        "url-parse-lax": "^3.0.0"
+        "@sindresorhus/is": "^4.0.0",
+        "@szmarczak/http-timer": "^4.0.5",
+        "@types/cacheable-request": "^6.0.1",
+        "@types/responselike": "^1.0.0",
+        "cacheable-lookup": "^5.0.3",
+        "cacheable-request": "^7.0.1",
+        "decompress-response": "^6.0.0",
+        "http2-wrapper": "^1.0.0-beta.5.2",
+        "lowercase-keys": "^2.0.0",
+        "p-cancelable": "^2.0.0",
+        "responselike": "^2.0.0"
      }
    },
    "graceful-fs": {
@ -8736,8 +8834,7 @@
    "http-cache-semantics": {
      "version": "4.1.0",
      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz",
-      "integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ==",
-      "dev": true
+      "integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ=="
    },
    "http-errors": {
      "version": "1.7.3",
@ -8851,6 +8948,22 @@
        "sshpk": "^1.7.0"
      }
    },
+    "http2-wrapper": {
+      "version": "1.0.0-beta.5.2",
+      "resolved": "https://registry.npmjs.org/http2-wrapper/-/http2-wrapper-1.0.0-beta.5.2.tgz",
+      "integrity": "sha512-xYz9goEyBnC8XwXDTuC/MZ6t+MrKVQZOk4s7+PaDkwIsQd8IwqvM+0M6bA/2lvG8GHXcPdf+MejTUeO2LCPCeQ==",
+      "requires": {
+        "quick-lru": "^5.1.1",
+        "resolve-alpn": "^1.0.0"
+      },
+      "dependencies": {
+        "quick-lru": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-5.1.1.tgz",
+          "integrity": "sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA=="
+        }
+      }
+    },
    "https-browserify": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
@ -9514,10 +9627,9 @@
      "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA=="
    },
    "json-buffer": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.0.tgz",
-      "integrity": "sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg=",
-      "dev": true
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
+      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ=="
    },
    "json-parse-better-errors": {
      "version": "1.0.2",
@ -9599,12 +9711,11 @@
      "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
    },
    "keyv": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz",
-      "integrity": "sha512-9ykJ/46SN/9KPM/sichzQ7OvXyGDYKGTaDlKMGCAlg2UK8KRy4jb0d8sFc+0Tt0YYnThq8X2RZgCg74RPxgcVA==",
-      "dev": true,
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.0.3.tgz",
+      "integrity": "sha512-zdGa2TOpSZPq5mU6iowDARnMBZgtCqJ11dJROFi6tg6kTn4nuUdU09lFyLFSaHrWqpIJ+EBq4E8/Dc0Vx5vLdA==",
      "requires": {
-        "json-buffer": "3.0.0"
+        "json-buffer": "3.0.1"
      }
    },
    "kind-of": {
@ -10690,10 +10801,9 @@
      }
    },
    "lowercase-keys": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
-      "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
-      "dev": true
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-2.0.0.tgz",
+      "integrity": "sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA=="
    },
    "lowlight": {
      "version": "1.18.0",
@ -11017,8 +11127,7 @@
    "mimic-response": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz",
-      "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==",
-      "dev": true
+      "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ=="
    },
    "min-document": {
      "version": "2.19.0",
@ -12163,8 +12272,7 @@
    "normalize-url": {
      "version": "4.5.0",
      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-4.5.0.tgz",
-      "integrity": "sha512-2s47yzUxdexf1OhyRi4Em83iQk0aPvwTddtFz4hnSSw9dCEsLEGf6SwIO8ss/19S9iBb5sJaOuTvTGDeZI00BQ==",
-      "dev": true
+      "integrity": "sha512-2s47yzUxdexf1OhyRi4Em83iQk0aPvwTddtFz4hnSSw9dCEsLEGf6SwIO8ss/19S9iBb5sJaOuTvTGDeZI00BQ=="
    },
    "npm-run-path": {
      "version": "4.0.1",
@ -12394,10 +12502,9 @@
      "dev": true
    },
    "p-cancelable": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz",
-      "integrity": "sha512-s73XxOZ4zpt1edZYZzvhqFa6uvQc1vwUa0K0BdtIZgQMAJj9IbebH+JkgKZc9h+B05PKHLOTl4ajG1BmNrVZlw==",
-      "dev": true
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-2.0.0.tgz",
+      "integrity": "sha512-wvPXDmbMmu2ksjkB4Z3nZWTSkJEb9lqVdMaCKpZUGJG9TMiNp9XcbG3fn9fPKjem04fJMJnXoyFPk2FmgiaiNg=="
    },
    "p-defer": {
      "version": "1.0.0",
@ -12444,6 +12551,132 @@
        "semver": "^6.2.0"
      },
      "dependencies": {
+        "@sindresorhus/is": {
+          "version": "0.14.0",
+          "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz",
+          "integrity": "sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==",
+          "dev": true
+        },
+        "@szmarczak/http-timer": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-1.1.2.tgz",
+          "integrity": "sha512-XIB2XbzHTN6ieIjfIMV9hlVcfPU26s2vafYWQcZHWXHOxiaRZYEDKEwdl129Zyg50+foYV2jCgtrqSA6qNuNSA==",
+          "dev": true,
+          "requires": {
+            "defer-to-connect": "^1.0.1"
+          }
+        },
+        "cacheable-request": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-6.1.0.tgz",
+          "integrity": "sha512-Oj3cAGPCqOZX7Rz64Uny2GYAZNliQSqfbePrgAQ1wKAihYmCUnraBtJtKcGR4xz7wF+LoJC+ssFZvv5BgF9Igg==",
+          "dev": true,
+          "requires": {
+            "clone-response": "^1.0.2",
+            "get-stream": "^5.1.0",
+            "http-cache-semantics": "^4.0.0",
+            "keyv": "^3.0.0",
+            "lowercase-keys": "^2.0.0",
+            "normalize-url": "^4.1.0",
+            "responselike": "^1.0.2"
+          },
+          "dependencies": {
+            "get-stream": {
+              "version": "5.2.0",
+              "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
+              "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
+              "dev": true,
+              "requires": {
+                "pump": "^3.0.0"
+              }
+            },
+            "lowercase-keys": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-2.0.0.tgz",
+              "integrity": "sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==",
+              "dev": true
+            }
+          }
+        },
+        "decompress-response": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz",
+          "integrity": "sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M=",
+          "dev": true,
+          "requires": {
+            "mimic-response": "^1.0.0"
+          }
+        },
+        "defer-to-connect": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-1.1.3.tgz",
+          "integrity": "sha512-0ISdNousHvZT2EiFlZeZAHBUvSxmKswVCEf8hW7KWgG4a8MVEu/3Vb6uWYozkjylyCxe0JBIiRB1jV45S70WVQ==",
+          "dev": true
+        },
+        "get-stream": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
+          "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
+          "dev": true,
+          "requires": {
+            "pump": "^3.0.0"
+          }
+        },
+        "got": {
+          "version": "9.6.0",
+          "resolved": "https://registry.npmjs.org/got/-/got-9.6.0.tgz",
+          "integrity": "sha512-R7eWptXuGYxwijs0eV+v3o6+XH1IqVK8dJOEecQfTmkncw9AV4dcw/Dhxi8MdlqPthxxpZyizMzyg8RTmEsG+Q==",
+          "dev": true,
+          "requires": {
+            "@sindresorhus/is": "^0.14.0",
+            "@szmarczak/http-timer": "^1.1.2",
+            "cacheable-request": "^6.0.0",
+            "decompress-response": "^3.3.0",
+            "duplexer3": "^0.1.4",
+            "get-stream": "^4.1.0",
+            "lowercase-keys": "^1.0.1",
+            "mimic-response": "^1.0.1",
+            "p-cancelable": "^1.0.0",
+            "to-readable-stream": "^1.0.0",
+            "url-parse-lax": "^3.0.0"
+          }
+        },
+        "json-buffer": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.0.tgz",
+          "integrity": "sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg=",
+          "dev": true
+        },
+        "keyv": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz",
+          "integrity": "sha512-9ykJ/46SN/9KPM/sichzQ7OvXyGDYKGTaDlKMGCAlg2UK8KRy4jb0d8sFc+0Tt0YYnThq8X2RZgCg74RPxgcVA==",
+          "dev": true,
+          "requires": {
+            "json-buffer": "3.0.0"
+          }
+        },
+        "lowercase-keys": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
+          "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
+          "dev": true
+        },
+        "p-cancelable": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz",
+          "integrity": "sha512-s73XxOZ4zpt1edZYZzvhqFa6uvQc1vwUa0K0BdtIZgQMAJj9IbebH+JkgKZc9h+B05PKHLOTl4ajG1BmNrVZlw==",
+          "dev": true
+        },
+        "responselike": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/responselike/-/responselike-1.0.2.tgz",
+          "integrity": "sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec=",
+          "dev": true,
+          "requires": {
+            "lowercase-keys": "^1.0.0"
+          }
+        },
        "semver": {
          "version": "6.3.0",
          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
@ -13707,6 +13940,11 @@
        "path-parse": "^1.0.5"
      }
    },
+    "resolve-alpn": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-alpn/-/resolve-alpn-1.0.0.tgz",
+      "integrity": "sha512-rTuiIEqFmGxne4IovivKSDzld2lWW9QCjqv80SYjPgf+gS35eaCAjaP54CCwGAwBtnCsvNLYtqxe1Nw+i6JEmA=="
+    },
    "resolve-cwd": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-2.0.0.tgz",
@ -13800,12 +14038,11 @@
      }
    },
    "responselike": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/responselike/-/responselike-1.0.2.tgz",
-      "integrity": "sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec=",
-      "dev": true,
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/responselike/-/responselike-2.0.0.tgz",
+      "integrity": "sha512-xH48u3FTB9VsZw7R+vvgaKeLKzT6jOogbQhEe/jewwnZgzPcnyWui2Av6JpoYZF/91uueC+lqhWqeURw5/qhCw==",
      "requires": {
-        "lowercase-keys": "^1.0.0"
+        "lowercase-keys": "^2.0.0"
      }
    },
    "restore-cursor": {
--- a/package.json
+++ b/package.json
@ -60,6 +60,7 @@
    "feed": "^4.2.2",
    "flat": "^5.0.2",
    "fs-extra": "^9.1.0",
+    "got": "^11.8.1",
    "gray-matter": "^4.0.2",
    "helmet": "^4.4.1",
    "http-proxy-middleware": "^1.0.6",
@ -89,6 +90,8 @@
  },
  "devDependencies": {
    "@octokit/action": "^3.5.0",
+    "@types/cookie-parser": "^1.4.2",
+    "@types/express": "^4.17.11",
    "babel-loader": "^8.2.2",
    "browser-sync": "^2.26.14",
    "chai": "^4.3.0",
--- a/server.js
+++ b/server.js
@ -19,6 +19,7 @@ const helmet = require('helmet')
 const langResolver = require('./middleware/lang-resolver')
 const contextBuilder = require('./middleware/context-builder')
 const getOcticons = require('./middleware/register-octicons')
+const feedback = require('./middleware/feedback')

 const port = Number(process.env.PORT) || argv.p || argv.port || 5000
 const app = express()
@ -127,6 +128,7 @@ app.get('/community', routes.community)
 app.get('/contact', (req, res) => res.redirect(301, '/community'))
 app.use('/crowdin', routes.languages.proxy)
 app.get('/devtron', routes.devtron)
+app.use('/docs', feedback)
 app.get('/docs', routes.docs.index)
 app.get('/docs/versions', (req, res) => res.redirect(301, '/releases/stable'))
 app.get('/docs/:category', routes.docs.category)
--- a/views/partials/feedback.hbs
+++ b/views/partials/feedback.hbs
@ -0,0 +1,27 @@
+{{#if showFeedback}}
+  {{#if debugging}}
+  <script>document.cookie = 'smcx_0_last_shown_at=;expires=Thu, 01 Jan 1970 00:00:01 GMT;';</script>
+  {{/if}}
+  <style>
+/* By default min height is 300 and position
+     in the center (and can't be tweaked).
+     Also we want only screens with enough
+     space to show the pop up.
+
+     TODO: Might be interesting to animate the
+     entrance instead of just popping up
+  */
+.smcx-widget.smcx-modal {
+  height: 220px;
+  bottom: 0;
+  right: 0;
+  top: auto;
+  left: auto;
+}
+
+body > div.smcx-widget.smcx-modal > div.smcx-modal-content {
+  height: 200px;
+}
+  </style>
+  {{{feedbackEmbedCode}}}
+{{/if}}
--- a/views/partials/head.hbs
+++ b/views/partials/head.hbs
@ -53,7 +53,7 @@
    ga('create', 'UA-160365006-1', 'auto');
    ga('send', 'pageview');
  </script>
-  {{!-- {{#eq currentLocale "en-US"}}
-
-  {{/eq}} --}}
+  {{#eq currentLocale "en-US"}}
+    {{> feedback }}
+  {{/eq}}
 </head>