Website: add swag request CTA to /device-management page (#23370)

Closes: #23222


Changes:
- Added a swag request CTA to the /device-management page that is
visible to users visiting from the contiguous US




When this PR is merged, a new version of [this Zapier
automation](https://zapier.com/editor/158652809/draft/237372699) needs
to be published

website/api/controllers/view-device-management.js

@@ -39,9 +39,16 @@ module.exports = {
       return testimonialOrderForThisPage.indexOf(a.quoteAuthorName) - testimonialOrderForThisPage.indexOf(b.quoteAuthorName);
     });
 
+    let showSwagForm = false;
+    // Due to shipping costs, we'll check the requesting user's cf-ipcountry to see if they're in the US, and their cf-iplongitude header to see if they're in the contiguous US.
+    if(this.req.get('cf-ipcountry') === 'US' && this.req.get('cf-iplongitude') > -125) {
+      showSwagForm = true;
+    }
+
     // Respond with view.
     return {
       testimonialsForScrollableTweets,
+      showSwagForm,
     };
 
   }

website/assets/js/pages/device-management.page.js

@@ -29,6 +29,18 @@ parasails.registerPage('device-management-page', {
     },
     closeModal: function() {
       this.modal = undefined;
-    }
+    },
+    clickSwagRequestCTA: function () {
+      if(typeof gtag !== 'undefined') {
+        gtag('event','fleet_website__swag_request');
+      }
+      if(typeof window.lintrk !== 'undefined') {
+        window.lintrk('track', { conversion_id: 18587105 });// eslint-disable-line camelcase
+      }
+      if(typeof analytics !== 'undefined'){
+        analytics.track('fleet_website__swag_request');
+      }
+      this.goto('https://kqphpqst851.typeform.com/to/ZfA3sOu0#from_page=device-managment');
+    },
   }
 });

website/assets/js/pages/docs/basic-documentation.page.js

@@ -230,7 +230,7 @@ parasails.registerPage('basic-documentation', {
       if(typeof analytics !== 'undefined'){
         analytics.track('fleet_website__swag_request');
       }
-      this.goto('https://kqphpqst851.typeform.com/to/ZfA3sOu0');
+      this.goto('https://kqphpqst851.typeform.com/to/ZfA3sOu0#from_page=docs');
     },
 
     clickCTA: function (slug) {

website/assets/styles/pages/device-management.less

@@ -122,6 +122,39 @@
     padding-bottom: 16px;
     margin-bottom: 0px;
   }
+  [purpose='swag-request-button'] {
+    max-width: 380px;
+    cursor: pointer;
+    margin-top: 16px;
+    margin-bottom: 16px;
+    display: flex;
+    padding: 16px;
+    justify-content: center;
+    align-items: center;
+    gap: 16px;
+    align-self: stretch;
+    border-radius: 8px;
+    border: 1px solid #E2E4EA;
+    background: #F9FAFC;
+    img {
+      margin-right: 16px;
+    }
+    p {
+      color: var(--text-text-primary, #515774);
+      font-family: Inter;
+      font-size: 14px;
+      font-style: normal;
+      line-height: 21px;
+    }
+    span {
+      color: var(--Core-Fleet-Black, #192147);
+      font-family: Inter;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 21px;
+    }
+  }
 
   // Desktop features comparison table styles
   [purpose='desktop-comparison-table'] {

website/views/pages/device-management.ejs

@@ -84,7 +84,16 @@
           </div>
         </div>
       </div>
-
+      <div v-if="showSwagForm">
+      <a purpose="swag-request-button" class="d-flex align-items-center justify-content-center mx-auto" @click="clickSwagRequestCTA()">
+        <div class="d-flex flex-row align-items-center">
+        <img style="height: auto; width: 47px;" alt="A very nice Fleet branded shirt" src="/images/fleet-shirt-60x55@2x.png">
+          <p class="mb-0"><strong class="mr-1">Request Fleet swag. </strong>
+          </p>
+          <span>It's free <img purpose="right-arrow" class="d-inline" style="height: 16px; width: auto; margin-bottom: 2px;" alt="right arrow" src="/images/arrow-right-red-16x16@2x.png" /></span>
+        </div>
+      </a>
+      </div>
       <div purpose="comparison-section">
         <h2>Head-to-head with the big players</h2>
         <p>Considering a move to Fleet as a cross-platform, open-source MDM alternative? See how we compare:</p>