🍕 Add preventAuth parameter (#40)

Author: jjpaulino

.circleci/config.yml

@@ -102,12 +102,6 @@ workflows:
   version: 2
   test:
     jobs:
-      - test_node10:
-          <<: *filter_all
-      - test_node12:
-          <<: *filter_all
-      - test_node14:
-          <<: *filter_all
       - deploy_package:
           <<: *filter_release
           context:

README.md

@@ -83,6 +83,14 @@ export LDAP_SEARCH_BASE=<LDAP_SEARCH_BASE>
 export LDAP_SEARCH_FILTER=<LDAP_SEARCH_FILTER>
 ```
 
+The following env variables are optional:
+
+This flag, when true, will prevent users from either going into edit mode or making any edits to a page they had already opened in edit mode in their browsers. This environment variable is optional and you can set it up from your Clay instance and it'll be picked up here since it'll share the same env file!
+It will redirect users to the login page where they'll see a message saying that Clay is under maintenance.
+```bash
+export MAINTENANCE_MODE_ENABLED=true
+```
+
 ## License
 
 MIT

constants.js

@@ -5,3 +5,4 @@ module.exports.AUTH_LEVELS = {
   ADMIN: 'admin',
   WRITE: 'write',
 };
+module.exports.MAINTENANCE_MODE_ENABLED = Boolean(process.env.MAINTENANCE_MODE_ENABLED);

index.js

@@ -13,7 +13,7 @@ const _isEmpty = require('lodash/isEmpty'),
   } = require('./utils'),
   createSessionStore = require('./services/session-store'),
   strategyService = require('./strategies'),
-  { AUTH_LEVELS } = require('./constants'),
+  { AUTH_LEVELS, MAINTENANCE_MODE_ENABLED } = require('./constants'),
   { withAuthLevel } = require('./services/auth'),
   { setDb } = require('./services/storage'),
   { setBus } = require('./controllers/users');
@@ -39,6 +39,13 @@ function isProtectedRoute(req) {
  */
 function isAuthenticated(site) {
   return function (req, res, next) {
+    // This variable controls wether or not people can log in to Clay
+    // and stops people from being able to make edits to pages.
+    // If someone were to edit something on a tab that was already opened,
+    // or attempted to go into edit mode, with this flag active,
+    // they'd get redirected to a screen displaying a message that the CMS is under maintenance.
+    if (MAINTENANCE_MODE_ENABLED) return res.redirect(`${getAuthUrl(site)}/login`);
+
     if (req.isAuthenticated()) {
       next(); // already logged in
     } else if (req.get('Authorization')) {
@@ -98,13 +105,14 @@ function onLogin(site, providers) {
       // going to use varnish to automatically redirect them back to the ldap auth
     } else {
       res.send(template({
-        path: getPathOrBase(site),
-        flash: flash,
         currentProviders: currentProviders,
-        user: req.user,
-        logoutLink: `${authUrl}/logout`,
+        flash: flash,
         localAuthPath: `${authUrl}/local`,
-        useLocalAuth: providers.includes('local')
+        logoutLink: `${authUrl}/logout`,
+        path: getPathOrBase(site),
+        maintenanceModeEnabled: MAINTENANCE_MODE_ENABLED,
+        useLocalAuth: providers.includes('local'),
+        user: req.user
       }));
     }
   };

views/login.handlebars

@@ -4,6 +4,15 @@
     <meta charset="utf-8">
     <title>Log In - Clay</title>
     <style>
+       @keyframes fadeIn {
+          from {
+            opacity: 0;
+            }
+          to {
+            opacity: 1;
+            }
+        }
+      animation: fadeIn 1s ease-in;
       .flash-error,
       .header,
       .details,
@@ -53,6 +62,15 @@
         text-align: center;
         width: 100%;
       }
+      .details.maintenance {
+        animation: fadeIn 1s ease-in;
+        background-color: #FFF3CD;
+        border-radius: 5px;
+        border: 2px solid #FFC107;
+        color: #FF0000;
+        font-size: 24px;
+        padding: 20px;
+      }
 
       .header {
         margin-bottom: 0;
@@ -172,7 +190,10 @@
       {{else}}
         <h1 class="header">Welcome, {{ username }}</h1>
       {{/if}}
-      <p class="details">You are currently logged in to Clay</p>
+      <p class="details">You are currently logged in to Clay.</p>
+      {{#if ../maintenanceModeEnabled}}
+        <p class="details maintenance">Clay is undergoing some routine maintenance. It will be back online shortly.</p>
+      {{/if}}
     {{else}}
       <h1 class="header">Log in to Clay</h1>
       {{#if currentProviders.length}}<p class="details">Please choose the provider attached to your account</p>{{/if}}