New compile UI admin panel (#3666)

* Extract new logs UI feature check to a helper function

* Add new logs UI per-user availability to the admin panel

* Stub NewLogsUIHelper in the unit tests

GitOrigin-RevId: b5344448d507c7cd7422b342286ada2b839b1785

services/web/app/src/Features/Helpers/NewLogsUI.js

@@ -0,0 +1,29 @@
+const { ObjectId } = require('mongodb')
+const Settings = require('settings-sharelatex')
+
+function shouldUserSeeNewLogsUI(user) {
+  const {
+    _id: userId,
+    alphaProgram: isAlphaUser,
+    betaProgram: isBetaUser
+  } = user
+  if (!userId) {
+    return false
+  }
+
+  const userIdAsPercentile = (ObjectId(userId).getTimestamp() / 1000) % 100
+
+  if (isAlphaUser) {
+    return true
+  } else if (isBetaUser && userIdAsPercentile < Settings.logsUIPercentageBeta) {
+    return true
+  } else if (userIdAsPercentile < Settings.logsUIPercentage) {
+    return true
+  } else {
+    return false
+  }
+}
+
+module.exports = {
+  shouldUserSeeNewLogsUI
+}

services/web/app/src/Features/Project/ProjectController.js

@@ -36,6 +36,7 @@ const BrandVariationsHandler = require('../BrandVariations/BrandVariationsHandle
 const UserController = require('../User/UserController')
 const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const Modules = require('../../infrastructure/Modules')
+const { shouldUserSeeNewLogsUI } = require('../Helpers/NewLogsUI')
 
 const _ssoAvailable = (affiliation, session, linkedInstitutionIds) => {
   if (!affiliation.institution) return false
@@ -56,29 +57,6 @@ const _ssoAvailable = (affiliation, session, linkedInstitutionIds) => {
   return false
 }
 
-function _shouldSeeNewLogsUI(user) {
-  const {
-    _id: userId,
-    alphaProgram: isAlphaUser,
-    betaProgram: isBetaUser
-  } = user
-  if (!userId) {
-    return false
-  }
-
-  const userIdAsPercentile = (ObjectId(userId).getTimestamp() / 1000) % 100
-
-  if (isAlphaUser) {
-    return true
-  } else if (isBetaUser && userIdAsPercentile < Settings.logsUIPercentageBeta) {
-    return true
-  } else if (userIdAsPercentile < Settings.logsUIPercentage) {
-    return true
-  } else {
-    return false
-  }
-}
-
 const ProjectController = {
   _isInPercentageRollout(rolloutName, objectId, percentage) {
     if (Settings.bypassPercentageRollouts === true) {
@@ -824,7 +802,7 @@ const ProjectController = {
               })
             }
 
-            const userShouldSeeNewLogsUI = _shouldSeeNewLogsUI(user)
+            const userShouldSeeNewLogsUI = shouldUserSeeNewLogsUI(user)
             const wantsOldLogsUI =
               req.query && req.query.new_logs_ui === 'false'
 

services/web/test/unit/src/HelperFiles/NewLogsUITests.js

@@ -0,0 +1,83 @@
+const SandboxedModule = require('sandboxed-module')
+const { expect } = require('chai')
+const { ObjectId } = require('mongodb')
+const MODULE_PATH = require('path').join(
+  __dirname,
+  '../../../../app/src/Features/Helpers/NewLogsUI.js'
+)
+
+describe('NewLogsUI helper', function() {
+  let NewLogsUI
+
+  function userIdFromTime(time) {
+    return ObjectId.createFromTime(time).toString()
+  }
+
+  beforeEach(function() {
+    this.user = {
+      alphaProgram: false,
+      betaProgram: false,
+      _id: ObjectId('60085414b76eeb00737d93aa')
+    }
+    this.settings = {
+      logsUIPercentageBeta: 0,
+      logsUIPercentage: 0
+    }
+    NewLogsUI = SandboxedModule.require(MODULE_PATH, {
+      requires: {
+        mongodb: { ObjectId },
+        'settings-sharelatex': this.settings
+      }
+    })
+  })
+
+  it('should show the new logs ui for alpha users', function() {
+    this.user.alphaProgram = true
+    expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.true
+  })
+
+  describe('for beta users', function() {
+    beforeEach(function() {
+      this.user.betaProgram = true
+    })
+    it('should not show the new logs ui with a beta rollout percentage of 0', function() {
+      this.settings.logsUIPercentageBeta = 0
+      expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.false
+    })
+    describe('with a beta rollout percentage > 0', function() {
+      const percentileThresold = 50
+      beforeEach(function() {
+        this.settings.logsUIPercentageBeta = percentileThresold
+      })
+      it('should not show the new logs ui when the user id is higher than the percent threshold', function() {
+        this.user._id = userIdFromTime(percentileThresold + 1)
+        expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.false
+      })
+      it('should show the new logs ui when the user id is lower than the percent threshold', function() {
+        this.user._id = userIdFromTime(percentileThresold - 1)
+        expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.true
+      })
+    })
+  })
+
+  describe('for normal users', function() {
+    it('should not show the new logs ui rollout percentage of 0', function() {
+      this.settings.logsUIPercentage = 0
+      expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.false
+    })
+    describe('with a rollout percentage > 0', function() {
+      const percentileThresold = 50
+      beforeEach(function() {
+        this.settings.logsUIPercentage = percentileThresold
+      })
+      it('should not show the new logs ui when the user id is higher than the percent threshold', function() {
+        this.user._id = userIdFromTime(percentileThresold + 1)
+        expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.false
+      })
+      it('should show the new logs ui when the user id is lower than the percent threshold', function() {
+        this.user._id = userIdFromTime(percentileThresold - 1)
+        expect(NewLogsUI.shouldUserSeeNewLogsUI(this.user)).to.be.true
+      })
+    })
+  })
+})

services/web/test/unit/src/Project/ProjectControllerTests.js

@@ -119,6 +119,9 @@ describe('ProjectController', function() {
       },
       inc: sinon.stub()
     }
+    this.NewLogsUIHelper = {
+      shouldUserSeeNewLogsUI: sinon.stub().returns(false)
+    }
 
     this.ProjectController = SandboxedModule.require(MODULE_PATH, {
       globals: {
@@ -165,7 +168,8 @@ describe('ProjectController', function() {
         '../Analytics/AnalyticsManager': { recordEvent: () => {} },
         '../../infrastructure/Modules': {
           hooks: { fire: sinon.stub().yields(null, []) }
-        }
+        },
+        '../Helpers/NewLogsUI': this.NewLogsUIHelper
       }
     })
 
@@ -1047,85 +1051,6 @@ describe('ProjectController', function() {
       this.ProjectController.loadEditor(this.req, this.res)
     })
 
-    describe('showNewLogsUI staged rollout', function() {
-      function userIdFromTime(time) {
-        return ObjectId.createFromTime(time).toString()
-      }
-
-      function checkNewLogsUI(shouldGetNewLogsUI) {
-        it(`should set showNewLogsUI to ${shouldGetNewLogsUI}`, function(done) {
-          this.res.render = (pageName, opts) => {
-            opts.showNewLogsUI.should.equal(shouldGetNewLogsUI)
-            done()
-          }
-          this.ProjectController.loadEditor(this.req, this.res)
-        })
-      }
-
-      describe('for alpha users', function() {
-        beforeEach(function() {
-          this.user.alphaProgram = true
-        })
-        checkNewLogsUI(true)
-      })
-      describe('for beta users', function() {
-        beforeEach(function() {
-          this.user.betaProgram = true
-        })
-        describe('with a beta rollout percentage of 0', function() {
-          beforeEach(function() {
-            this.settings.logsUIPercentageBeta = 0
-          })
-          checkNewLogsUI(false)
-        })
-        describe('with a beta rollout percentage > 0', function() {
-          const percentileThresold = 50
-          beforeEach(function() {
-            this.settings.logsUIPercentageBeta = percentileThresold
-          })
-          describe('when the user id is higher than the percent threshold', function() {
-            beforeEach(function() {
-              this.user._id = userIdFromTime(percentileThresold + 1)
-            })
-            checkNewLogsUI(false)
-          })
-          describe('when the user id is lower than the percent threshold', function() {
-            beforeEach(function() {
-              this.user._id = userIdFromTime(percentileThresold - 1)
-            })
-            checkNewLogsUI(true)
-          })
-        })
-      })
-
-      describe('for normal users', function() {
-        describe('with a rollout percentage of 0', function() {
-          beforeEach(function() {
-            this.settings.logsUIPercentage = 0
-          })
-          checkNewLogsUI(false)
-        })
-        describe('with a rollout percentage > 0', function() {
-          const percentileThresold = 50
-          beforeEach(function() {
-            this.settings.logsUIPercentage = percentileThresold
-          })
-          describe('when the user id is higher than the percent threshold', function() {
-            beforeEach(function() {
-              this.user._id = userIdFromTime(percentileThresold + 1)
-            })
-            checkNewLogsUI(false)
-          })
-          describe('when the user id is lower than the percent threshold', function() {
-            beforeEach(function() {
-              this.user._id = userIdFromTime(percentileThresold - 1)
-            })
-            checkNewLogsUI(true)
-          })
-        })
-      })
-    })
-
     describe('wsUrl', function() {
       function checkLoadEditorWsMetric(metric) {
         it(`should inc metric ${metric}`, function(done) {