From 024fbd1c2dcfe229c13e5f29eaacfad557f0d702 Mon Sep 17 00:00:00 2001 From: Mike McNeil Date: Thu, 31 Dec 2020 20:28:18 -0600 Subject: [PATCH] Add chat to website (#165) * prevent eslintrc conflicts * Pricing + chat for website (#124) * Update manage users styles. Implement table (list) view. (#104) The goal of this PR is to change the layout of the manage users to a table (list view). Move the user actions into the table view. Move EditUserForm into a Modal Update styles for InviteUserForm Edit copy for the configuring SMTP warning. * Update query page (edit, new, manage) and packs page (edit, new, manage) styles. (#106) The goal of this PR is to update the style across the query and packs pages so they are consistent with the latest global styles (colors, buttons, and fonts). * Update app settings page and osquery options page styles. (#107) The goal of this PR is to implement the new global styling (colors, buttons, and fonts) to the "App settings" and "Osquery options" pages. These pages are only visible to users granted an admin role. * Fix and clarify API auth documentation (#109) - Fix header name. - Add note about SSO auth. * New styles for 404, 500, Login, User settings, and Confirm invite pages. (#108) - Kolide404 and Kolide500 components renamed to Fleet404 and Fleet500 - Styling for Login and Confirm invite pages are consistent with the recent changes to the Setup page. - Add "*" character to the 404 's path property. Now the 404 page renders when there is no exact path match. * Fix JSON in rest-endpoints.md (#110) * Add host enrollment cooldown period (#112) This addresses an issue some users experienced in which performance problems were encountered when hosts were "competing" for enrollment using the same osquery host identifier. The issue is addressed by adding a cooldown period for host enrollment, preventing the same (as judged by osquery host identifier) host from enrolling more than once per minute. When users end up in the problematic scenario, they will see quite a bit of error logs due to this issue. For now that's probably a good thing as users need to be aware of the lack of visibility. We can explore rate limiting the logging if that becomes an issue for someone. Fixes #102 * Improve MySQL transaction error logging (#113) Clarify what exactly happened when logging these errors. * Migrate remaining URLs to fleetdm.com (#116) * Clean up unused test/demo SQL data (#117) * Add style fixes caught during QA. Add favicon. (#119) Changes include style fixes that were caught during a QA pass. * Make password reset styles consistent with new global styles. (#120) The changes include adding sentence casing and updating the styles of the and components. * CHANGELOG for 3.5.0 (#121) * Update fleetctl version number. Fix spelling error in changelog. (#122) * Fix alt tag * Set up pricing cards * Match footer to bottom of gradient * Set up FAQ and stub out chat button click * Add chat, plus some other tweaks. * fiddling with Papercups to hopefully get it to recognize who's responding from the Fleet side * This isn't really a solution but it's the best we've got til Papercups is hacked to allow programmatic opening (or til we switch to something else, or just bring in the traditional contact form) * trivial * Temporary workaround using an undocumented API in papercups Co-authored-by: Rachael Shaw Co-authored-by: Mike McNeil Co-authored-by: Rachael McNeil Co-authored-by: Rachael Shaw --- website/.eslintrc | 6 +- website/assets/js/pages/homepage.page.js | 12 +- website/assets/styles/pages/homepage.less | 3 + website/config/routes.js | 2 +- website/views/layouts/layout.ejs | 9 +- website/views/pages/homepage.ejs | 142 ++++++++++++++++++++-- 6 files changed, 160 insertions(+), 14 deletions(-) diff --git a/website/.eslintrc b/website/.eslintrc index de92b9c3fb..7fe6deb437 100644 --- a/website/.eslintrc +++ b/website/.eslintrc @@ -5,7 +5,7 @@ // A set of basic code conventions designed to encourage quality and consistency // across your Sails app's code base. These rules are checked against // automatically any time you run `npm test`. - // + // // > An additional eslintrc override file is included in the `assets/` folder // > right out of the box. This is specifically to allow for variations in acceptable // > global variables between front-end JavaScript code designed to run in the browser @@ -22,6 +22,8 @@ // or could use some advice, come by https://sailsjs.com/support. // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + "root": true, // « ignore eslintrc files in parent directories + "env": { "node": true }, @@ -40,7 +42,7 @@ // Models: "User": true - + // …and any others. // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - }, diff --git a/website/assets/js/pages/homepage.page.js b/website/assets/js/pages/homepage.page.js index 2eaf683ebe..8354de7c32 100644 --- a/website/assets/js/pages/homepage.page.js +++ b/website/assets/js/pages/homepage.page.js @@ -20,6 +20,16 @@ parasails.registerPage('homepage', { // ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗ // ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝ methods: { - //… + clickChatButton: function() { + // Temporary hack to open the chat + // (there's currently no official API for doing this outside of React) + // + // > Alex: hey mike! if you're just trying to open the chat on load, we actually have a `defaultIsOpen` field + // > you can set to `true` :) i haven't added the `Papercups.open` function to the global `Papercups` object yet, + // > but this is basically what the functions look like if you want to try and just invoke them yourself: + // > https://github.com/papercups-io/chat-widget/blob/master/src/index.tsx#L4-L6 + // > ~Dec 31, 2020 + window.dispatchEvent(new Event('papercups:open')); + } } }); diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less index 6ddfad4950..fa63c38041 100644 --- a/website/assets/styles/pages/homepage.less +++ b/website/assets/styles/pages/homepage.less @@ -31,6 +31,9 @@ .quote-mark { font-family: @header-font; } + .footer-fade { + background: linear-gradient(360deg, #201E43 0%, #353D62 100%); + } @media (max-width: 1175px) { .hero-bg { background-position: -1100px bottom; diff --git a/website/config/routes.js b/website/config/routes.js index d677c2c421..16bcaf1d23 100644 --- a/website/config/routes.js +++ b/website/config/routes.js @@ -34,6 +34,7 @@ module.exports.routes = { '/company/about': '/blog', // FUTURE: brief "about" page explaining the origins of the company '/company/stewardship': 'https://github.com/fleetdm/fleet', // FUTURE: page about how we approach open source and our commitments to the community + // 'GET /company/contact': { action: 'view-contact' }, '/company/contact': (req, res)=>{ // FUTURE: Page about this. See “Contacting Fleet” in google drive for verbiage (updated holiday hours) - better to just make it all open source and check it in here. For inspiration, see also: https://about.gitlab.com/company/contact/ res.redirect('mailto:todo@example.com?subject=I have a question&body=Please do not send this email!\n\nWe are a very young company and still working on our processes. For now, if you have questions or feedback for us, please create an issue at https://github.com/fleetdm/fleet/issues. Thank you!'); @@ -44,7 +45,6 @@ module.exports.routes = { // 'GET /faq': { action: 'view-faq' }, // 'GET /legal/terms': { action: 'legal/view-terms' }, // 'GET /legal/privacy': { action: 'legal/view-privacy' }, - // 'GET /contact': { action: 'view-contact' }, // 'GET /signup': { action: 'entrance/view-signup' }, // 'GET /email/confirm': { action: 'entrance/confirm-email' }, diff --git a/website/views/layouts/layout.ejs b/website/views/layouts/layout.ejs index c3baf2d4b8..c0c29c1841 100644 --- a/website/views/layouts/layout.ejs +++ b/website/views/layouts/layout.ejs @@ -52,7 +52,7 @@ <%- body %> -
+
@@ -106,6 +106,11 @@ (https://sailsjs.com/docs/concepts/assets/task-automation) */ %> + <% /* Chat (Papercups) */ %> + + + + <%/* Stripe.js */%> @@ -219,7 +224,7 @@ document.body.style.padding = '75px 0'; } } - })();//† + })(); diff --git a/website/views/pages/homepage.ejs b/website/views/pages/homepage.ejs index 6d3ed6a932..b226916c7c 100644 --- a/website/views/pages/homepage.ejs +++ b/website/views/pages/homepage.ejs @@ -8,7 +8,7 @@

Open source
 device management

Ask questions about your servers, containers, and laptops running Linux, Windows, and macOS. Quickly deploy osquery and scale your fleet to 50,000+ devices on top of a stable core technology.

- Get started with Fleet + Get started with Fleet
@@ -140,9 +140,9 @@
“ -

Fleet is hands down the best osquery platform out there. Zach and I created Fleet as a natural extension to our original vision for osquery and this has manifested in the ease-of-use, flexibility, and adoption it has today. Look to Fleet for the future of open-source endpoint monitoring.

-

- Mike Arpaia, Creator of osquery

- Atlassian logo +

I've been using Fleet to manage thousands of hosts running osquery. Fleet itself is pretty low-maintenance; mostly I don't have to worry about Fleet uptime and instead focus on what matters: deploying osquery, developing better queries, and getting the most out of osquery logs.

+

- Brendan Shaklovitz, Senior Site Reliability Engineer, Security Team @ Atlassian

+ Atlassian logo
@@ -159,13 +159,139 @@
“ -

I've been using Fleet to manage thousands of hosts running osquery. Fleet itself is pretty low-maintenance; mostly I don't have to worry about Fleet uptime and instead focus on what matters: deploying osquery, developing better queries, and getting the most out of osquery logs.

-

- Brendan Shaklovitz, Senior Site Reliability Engineer, Security Team @ Atlassian

- Atlassian logo +

Fleet is hands down the best osquery platform out there. Zach and I created Fleet as a natural extension to our original vision for osquery and this has manifested in the ease-of-use, flexibility, and adoption it has today. Look to Fleet for the future of open-source endpoint monitoring.

+

- Mike Arpaia, Co-creator of osquery

+ osquery logo
- +
+
+
+

Choose a plan that suits your needs

+

All plans have unlimited hosts and collaborators.

+
+
+
+
+
+
+

Core

+

FREE

+

/host/month

+
+ Start now +
+

+ a circle with a checkmark + Open source +

+

+ a circle with a checkmark + Community supported +

+

+ a circle with a checkmark + Bring your own production + environment +

+
+
+
+
+
+
+
+
+

Basic

+

$4

+

/host/month

+

(USD, billed anually at $48)

+
+ +
+

+ a circle with a checkmark + Multiple teams (RBAC)* +

+

+ a circle with a checkmark + Next business day support +

+

+ *Coming 2021 +

+
+
+
+
+
+
+
+ <% /* +
+

FAQ

+
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

+ Mauris viverra tempus nisl, sed varius leo volutpat sit amet? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

+ Mauris viverra tempus nisl, sed varius leo volutpat sit amet? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

+ Mauris viverra tempus nisl, sed varius leo volutpat sit amet? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

+ Mauris viverra tempus nisl, sed varius leo volutpat sit amet? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit? + +

+

+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. +

+
+
+

Still got questions? Get in touch.

+ +
*/ %> +
+